Uploaded image for project: 'Titanium SDK/CLI'
  1. Titanium SDK/CLI
  2. TIMOB-25631

Android :Unable to position TabGroup at the bottom of the screen with tabsAtBottom

    Details

    • Type: Bug
    • Status: Closed
    • Priority: None
    • Resolution: Invalid
    • Affects Version/s: Release 7.0.1
    • Fix Version/s: None
    • Component/s: Android
    • Labels:
    • Sprint:
      2018 Sprint 02 SDK

      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
      

        Attachments

          Issue Links

            Activity

              People

              • Assignee:
                jquick Joshua Quick
                Reporter:
                aislam Aminul Islam
              • Watchers:
                5 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Git Source Code