titanium-sdk
titanium-sdk copied to clipboard
feat(android): add tabMode to TabGroup
https://jira-archive.titaniumsdk.com/TIMOB/TIMOB-26990
Switch between fixed and srollable tabMode:
var win = Ti.UI.createWindow({
});
var btn1 = Ti.UI.createButton({
title: "fixed",
top: 5
});
var btn2 = Ti.UI.createButton({
title: "scrollable",
top: 60
});
win.add([btn1, btn2]);
btn1.addEventListener("click", function() {
openTabGroup(Ti.UI.Android.TAB_MODE_FIXED);
})
btn2.addEventListener("click", function() {
openTabGroup(Ti.UI.Android.TAB_MODE_SCROLLABLE);
})
win.open();
function openTabGroup(tabModeValue) {
var tabs = [];
for (var i = 0; i < 10; ++i) {
var w = Ti.UI.createWindow({});
var t = Ti.UI.createTab({
window: w,
title: 'win'
});
tabs.push(t);
}
tabGroup = Ti.UI.createTabGroup({
tabs: tabs,
tabMode: tabModeValue
});
tabGroup.open();
}
https://user-images.githubusercontent.com/4334997/160287343-79483db5-d6ea-42de-929f-c8a2b30282c1.mp4
Fails | |
---|---|
:no_entry_sign: |
:microscope: There are library changes, but no changes to the unit tests. That's OK as long as you're refactoring existing code, but will require an admin to merge this PR. Please see README.md#unit-tests for docs on unit testing. |
Warnings | |
---|---|
:warning: |
Commit f6785f54bd13f5effa9b768bc5c8bbd1dd860aeb has a message "remove files" giving 2 errors:
|
:warning: |
Commit 18a5ce207805577597c99f0ebe4e2097ce48f6cd has a message "update" giving 2 errors:
|
:warning: |
Commit 953c28f7512c9d11d60b5049850780f3154399c2 has a message "fixed fixed mode" giving 2 errors:
|
:warning: |
Commit ef3148807a7d7d0d0095de913b167d59c71868b1 has a message "type" giving 2 errors:
|
:warning: |
Commit 0280d33c21724a5d62b8ad8f44d5ea3b57d9e908 has a message "default values" giving 2 errors:
|
:warning: |
Commit 1779571fe2d3b2caf2c705449cdd76650fbdf3ab has a message "version number" giving 2 errors:
|
:warning: |
Commit 07d1897231af607d6169fdeeb632144f0c589d0e has a message "doc" giving 2 errors:
|
:warning: |
Commit d47109a8c340f93e6a921f17caa681f6455efb8a has a message "Android: add tabMode" giving 2 errors:
|
:warning: | Tests have failed, see below for more information. |
:warning: | This PR has milestone set to 10.0.0, but the version defined in package.json is 10.2.0 Please either: - Update the milestone on the PR - Update the version in package.json - Hold the PR to be merged later after a release and version bump on this branch |
Messages | |
---|---|
:book: |
:rotating_light: This PR has one or more commits with warnings/errors for commit messages not matching our configuration. You may want to squash merge this PR and edit the message to match our conventions, or ask the original developer to modify their history. |
:book: | :x: 3 tests have failed There are 3 tests failing and 1161 skipped out of 21274 total tests. |
:book: | :tada: Another contribution from our awesome community member, m1ga! Thanks again for helping us make Titanium SDK better. :thumbsup: |
:book: |
:floppy_disk: Here's the generated SDK zipfile. |
Tests:
Classname | Name | Time | Error |
---|---|---|---|
android.emulator.5.0.Titanium.UI.View | "after all" hook for "rgba fallback" (5.0.2) | 20.383 | Error: Timeout of 10000ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves. (app.js) |
android.emulator.5.0.Titanium.UI.View | "after each" hook for "getOrCreateView() should always return a View" (5.0.2) | 10.324 | Error: Timeout of 10000ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves. (app.js) |
android.emulator.main.Titanium.Geolocation.methods | #forwardGeocoder() works via callback argument (12) | 5.04 | Error: expected false to be true at Assertion.fail (/node_modules/should/cjs/should.js:275:13) at Assertion.value (/node_modules/should/cjs/should.js:356:9) at Geolocation.<anonymous> (/ti.geolocation.test.js:585:32) |
Generated by :no_entry_sign: dangerJS against be0d5dae5fabd3f8d3f9a8594afcce00b75382c0
cc @ypbnv
changed the text and the version number
@m1ga Thanks! Can you update the version number in the other two places I have commented on?
missed them, sorry! Updated too
@m1ga, @ypbnv,
Our TabGroup
in Titanium 7.x.x scrolled horizontally by default, but our new top tab style in 8.0.0 no longer scrolls without this tab mode. Which means we did not maintain the old behavior. (I didn't notice this until now, so, it got past me too.)
So, do you think we need a new "tabMode" property at all? I'm thinking we should make the top tabs scrollable by default and drop this new property if we can.
Perhaps a better question is would anyone want to use the "static" tab mode setting where it shows ellipsis if there isn't enough room for all tabs (this kind of looks bad).
Side Note: iOS shows a "More" button if there is not enough room to show all tabs. iOS never truncates tab titles with ellipsis, unlike Android's "static" tab mode.
@jquick-axway I can change the default value but it would be nice to have this option e.g. if you tabs are only some pixel too big it will be scrollable and with fixed you set it to be static.
I've changed the default value to scrollable again (inside the XML that caused it to be fixed: https://github.com/appcelerator/titanium_mobile/blame/1a2343d1500a47ea5adabe8a52fcc077dd4b5169/android/modules/design/res/values-land/values-land.xml)
@jquick-axway , @m1ga To me it feels OK to have the default value match the old behavior ( I have no clue why I did not pay attention to that doing the refactoring ) and have a new property exposed. I understand it does not make much sense parity-wise, but for edge cases like the one pointed out by Michael it would be useful.
And that rises a question - having a different default tabMode from the refactoring until now - which functionality would it make more sense to keep backward compatible?
The only thing that bugs me is that this new "tabMode" property only applies to Android and only its top tab style. It seems like a waste to me, which is why I was thinking about simplifying it. Hmm...
@m1ga, @ypbnv, does setting tab mode to "fixed" make the tabs fully span the width of the screen when in landscape mode? Or in portrait mode on a tablet? (I haven't tested this for myself yet.)
I ask because one thing that has changed as of Titanium 8.0.0 when we switched to the Java TabLayout
class is that the top tabs do not fully fill the width of the screen in portrait mode on a tablet... versus the old tab group behavior did. I don't think it's a big deal, but there have been a couple app devs who have complained about it.
What I've seen on stackoverflow below suggests that this will do the trick... https://stackoverflow.com/questions/30843775/tab-not-taking-full-width-on-tablet-device-using-android-support-design-widget
There is a difference between opening the Window in landscape mode vs turning it while open: http://migaweb.de/20190822_192849.mp4
If you open it in portrait fixed mode and turn it it will take the whole space. If you open it in landscape fixed mode it will be centered. Scrolling mode is always aligned to the left side
Edit: fixed the fixed mode behavior! It will be full width the whole time now
closing in favor of https://github.com/tidev/titanium-sdk/pull/13877