Ion-tab In andorid4.4 and andorid4.3 (below) is not the same performance


#1

i need some help

this is my code

ion-tabs.tabs-icon-top.tabs-positive
  ion-tab(title='首页', icon='icon ion-ios7-home-outline', icon-on="ion-ios7-home", href='#/home')
    ion-nav-view(name='home')
  ion-tab(title='精选理财', icon='icon ion-ios7-paper-outline', icon-on="ion-ios7-paper", ui-sref="tab.list")
    ion-nav-view(name='list-view')
  ion-tab(title='我的资产', icon='icon ion-ios7-person-outline',
    icon-on="ion-ios7-person", href='#/me', badge="12", badge-style="tabs-positive")
    ion-nav-view(name='me')
  ion-tab(title='更多', icon='icon ion-ios7-more-outline', icon-on="ion-ios7-more", href='#/more')
    ion-nav-view(name='more')

Below is a screenshot

Thanks!


#2

Hey there, so the icons are not loading? hmmm, can chance you could do some debugging to see if there are any errors?

You can use this for android 4.3


#3

I use weinre debugging and found

#In Android 4.4

<div class="tabs">

style is

display: flex;
height: 49px;
width: 360px;

#In Android 4.3
style is

display: block;
height: 49px;
width: 360px;

I use the ionic version is 1.0.0-beta.10, installed from the bower


#4

Hm, interesting. Just to make sure, can you test again using the nightly builds?


#5

display: flex; doesn’t seem to work on Android < 4.4. You can write a conditional using ionic.Platform.version() and use the style display: -webkit-box; and that should work. Try that.


#6

That or you could include all the prefixed for webkit

display: -webkit-box;
display: -webkit-flex;
display: flex

#7

That’s right. Thanks! I got it!