[TIMOB-25631] Android :Unable to position TabGroup at the bottom of the screen with tabsAtBottom
GitHub Issue | n/a |
---|---|
Type | Bug |
Priority | None |
Status | Closed |
Resolution | Invalid |
Resolution Date | 2018-02-28T18:39:09.000+0000 |
Affected Version/s | Release 7.0.1 |
Fix Version/s | n/a |
Components | Android |
Labels | Escalation |
Reporter | Aminul Islam |
Assignee | Joshua Quick |
Created | 2017-12-27T12:50:12.000+0000 |
Updated | 2018-02-28T18:39:09.000+0000 |
Description
we have a requirement to place the TabGroup at the bottom of the screen. we are able to achieve this in iOS but coming to android, TabGroup is being displayed at the top of screen by default. By referring to the Appcelerator docs we have found an property " tabsAtBottom" for "Tabgroup" api to reposition the TabGroup to bottom, But it is not working as expected
Test Steps:
1) Open studio and create a classic app
2) Paste the sample code to app.js
3) Run the app and observe that position of TabGroup is top of the screen.
Test code
/**
* Create a new Ti.UI.TabGroup
.
*/
var tabGroup = Ti.UI.createTabGroup({
tabsBackgroundColor : "#fff",
tabsAtBottom : true,
// tabsAtBottom : false
});
/**
* Add the two created tabs to the tabGroup object.
*/
tabGroup.addTab(createTab("Home", "Home Page", "assets/images/home-button.png"));
tabGroup.addTab(createTab("Saved", "Saved Items Page", "assets/images/star.png"));
tabGroup.addTab(createTab("Contact", "Contact US Page", "assets/images/phone-contact.png"));
tabGroup.addTab(createTab("More", "Settings & More", "assets/images/ellipsis.png"));
/**
* Open the tabGroup
*/
tabGroup.open();
/**
* Creates a new Tab and configures it.
*
* @param {String} title The title used in the Ti.UI.Tab
and it's included Ti.UI.Window
* @param {String} message The title displayed in the Ti.UI.Label
* @return {String} icon The icon used in the Ti.UI.Tab
*/
function createTab(title, message, icon) {
var win = Ti.UI.createWindow({
title: title,
backgroundColor: '#333',
navBarHidden : true
});
var label = Ti.UI.createLabel({
text: message,
color: "#fff",
font: {
fontSize: 20
}
});
win.add(label);
var tab = Ti.UI.createTab({
title: title,
icon: icon,
window: win,
backgroundColor : "#00AFDB",
backgroundFocusedColor : "#333"
});
return tab;
}
*Test Environment*:
Appcelerator Command-Line Interface, version 7.0.1
Copyright (c) 2014-2017, Appcelerator, Inc. All Rights Reserved.
Operating System Mac OS X Version 10.13.1
Node.js 8.9.1
npm 5.5.1
Android Device: Galaxy J7(7.0)
Appcelerator CLI
Installer = 4.2.11
Core Package = 7.0.1
Titanium CLI
CLI Version = 5.0.14
node-appc Version = 0.2.41
Titanium SDK 7.0.1.GA
Hello [~emerriman], Any update on this? The customer wants to know the updates from us. Best
Hi Team, We have a similar issue. In our application, we have to show tab group at the bottom of the screen similar to iOS. But we are unable to achieve it as the "tabsAtBottom" property for TabGroup is not working as expected. Please help us in achieving this requirement. Thanks, Snigdha
This is a documentation error. The "tabsAtBottom" property has never been supported on Android, iOS, or Window. This property was only supported by the deprecated "Mobile Web" platform. When we removed "Mobile Web" platform support, our documentation build system mistakenly defaulted to Android and iOS under platforms supported. https://github.com/appcelerator/titanium_mobile/pull/9236/files#diff-238ec1337a6863e5c571fbf5310188e0L656 Sorry about the confusion.
Thanks [~jquick]. The customer is informed about this. Will be back if there is any concern .