Ionic tabs hidden by nav-bar only in Android

@angeletti wrote:

Hi, I'm trying to build an interface with both side menu and tabs. On iOS it works fine, but on Android the tabs are hidden by the nav-bar. Here is one image explaining the issue.

ios-android-ionic-tabs.png828x734 10.4 KB

The code for the menu.html template is:

<ion-side-menus enable-menu-with-back-views="false">
  <ion-side-menu-content>
    <ion-nav-bar class="bar-positive">
      <ion-nav-back-button class="button-icon ion-arrow-left-c">
      </ion-nav-back-button>
      <ion-nav-buttons side="left">
        <button class="button button-icon button-clear ion-navicon" ng-click="toggleLeft()">
        </button>
      </ion-nav-buttons>
    </ion-nav-bar>
    <ion-nav-view name="menuContent"></ion-nav-view>
  </ion-side-menu-content>

  <ion-side-menu side="left">
    <ion-header-bar class="bar-positive">
      <h1 class="title">Menu</h1>
    </ion-header-bar>
    <ion-content>
      <ion-list>
        <ion-item menu-close href="#/menu/home">
          <i class="icon ion-home"></i>
          {{'HomeMenu' | translate}}
        </ion-item>
        <ion-item menu-close href="#/menu/settings">
          <i class="icon ion-ios-gear-outline"></i>
          Settings
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-side-menu>
</ion-side-menus>

And the code for the tabbed interface is:

<ion-view view-title="{{'Deals' | translate}}">

  <ion-tabs class="tabs-striped">
    <ion-tab title="{{'FoodCategory' | translate}}" href="#/menu/home/category/food/0">
      <ion-nav-view name="food"></ion-nav-view>
    </ion-tab>
    <ion-tab title="{{'WineCategory' | translate}}" href="#/menu/home/category/wine/1">
      <ion-nav-view name="wine"></ion-nav-view>
    </ion-tab>
  </ion-tabs>

</ion-view>

Thanks for the help!

Posts: 7

Participants: 3

Read full topic