New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ion-tabs not displaying in Android 4.4 kitkat #7604

Closed
Ghayyas opened this Issue Aug 8, 2016 · 48 comments

Comments

Projects
None yet
@Ghayyas

Ghayyas commented Aug 8, 2016

Hello, recently I just Upgrade my Ionic 2 project from beta 10 to beta 11. But Its having problem with its tabs..
I Have tabs on bottom.. On browser It Display tabs and Samasung Galxy s5 (Android 5.0) but It not showing tabs on my android 4.4 kitkat.. When I click on my tab I navigates me to that page but is Shows white blank screen on tabs bar..

@shamrozwarraich

This comment has been minimized.

Show comment
Hide comment
@shamrozwarraich

shamrozwarraich Aug 8, 2016

samee :/ update to beta 11 and tab hide ... bt it work white area appear at tab places...

shamrozwarraich commented Aug 8, 2016

samee :/ update to beta 11 and tab hide ... bt it work white area appear at tab places...

@bushev

This comment has been minimized.

Show comment
Hide comment
@bushev

bushev Aug 8, 2016

The same for me.

bushev commented Aug 8, 2016

The same for me.

@shamrozwarraich

This comment has been minimized.

Show comment
Hide comment
@shamrozwarraich

shamrozwarraich commented Aug 9, 2016

any solution.... @bushev @Ghayyas ??/

@jgw96

This comment has been minimized.

Show comment
Hide comment
@jgw96

jgw96 Aug 9, 2016

Contributor

Hello all! Would you all mind telling me exactly which version of Android the tabs are not showing on?

Contributor

jgw96 commented Aug 9, 2016

Hello all! Would you all mind telling me exactly which version of Android the tabs are not showing on?

@jgw96 jgw96 added the needs reply label Aug 9, 2016

@bushev

This comment has been minimized.

Show comment
Hide comment
@bushev

bushev Aug 9, 2016

@jgw96 Hello! I have tested Android 4.4.4

I'm not sure, related that or not, but I have found one more problem with UI: ionic-team/ionic-conference-app#223

bushev commented Aug 9, 2016

@jgw96 Hello! I have tested Android 4.4.4

I'm not sure, related that or not, but I have found one more problem with UI: ionic-team/ionic-conference-app#223

@Ghayyas

This comment has been minimized.

Show comment
Hide comment
@Ghayyas

Ghayyas Aug 9, 2016

Hi Im having this issue on android 4.4 kitkat.

Ghayyas commented Aug 9, 2016

Hi Im having this issue on android 4.4 kitkat.

@jgw96

This comment has been minimized.

Show comment
Hide comment
@jgw96

jgw96 Aug 9, 2016

Contributor

@Ghayyas @bushev thanks! @Ghayyas is it 4.4.4 or 4.4.2?

Contributor

jgw96 commented Aug 9, 2016

@Ghayyas @bushev thanks! @Ghayyas is it 4.4.4 or 4.4.2?

@Ghayyas

This comment has been minimized.

Show comment
Hide comment
@Ghayyas

Ghayyas Aug 9, 2016

@jgw96 I have android 4.4.2

Ghayyas commented Aug 9, 2016

@jgw96 I have android 4.4.2

@Ionitron Ionitron removed the needs reply label Aug 9, 2016

@pskhodad

This comment has been minimized.

Show comment
Hide comment
@pskhodad

pskhodad Aug 9, 2016

Same here on 4.4, I could see it happening when I have side-menu + tabs, similar to that in conference app

pskhodad commented Aug 9, 2016

Same here on 4.4, I could see it happening when I have side-menu + tabs, similar to that in conference app

@danbucholtz

This comment has been minimized.

Show comment
Hide comment
@danbucholtz

danbucholtz Aug 9, 2016

Contributor

Hello all,

I am not seeing this issue. Can you try running the following command and seeing if it resolves the issue:

ionic plugin add cordova-plugin-crosswalk-webview

Otherwise, can you provide a plunkr or codepen that I can use to recreate the issue?

Thanks,
Dan

Contributor

danbucholtz commented Aug 9, 2016

Hello all,

I am not seeing this issue. Can you try running the following command and seeing if it resolves the issue:

ionic plugin add cordova-plugin-crosswalk-webview

Otherwise, can you provide a plunkr or codepen that I can use to recreate the issue?

Thanks,
Dan

@danbucholtz danbucholtz self-assigned this Aug 9, 2016

@bushev

This comment has been minimized.

Show comment
Hide comment
@bushev

bushev Aug 9, 2016

@danbucholtz Hello! As for me it doesn't work with my app, crosswalk make the app 6 times bigger but now I can't see any icon or text inside my app:

image

I will try with conference app.

bushev commented Aug 9, 2016

@danbucholtz Hello! As for me it doesn't work with my app, crosswalk make the app 6 times bigger but now I can't see any icon or text inside my app:

image

I will try with conference app.

@bushev

This comment has been minimized.

Show comment
Hide comment
@bushev

bushev Aug 9, 2016

@danbucholtz the same for conference app.

Steps to reproduce:

  1. Check out ionic-conference-app
  2. ionic plugin add cordova-plugin-crosswalk-webview
  3. ionic build android --release
  4. Sing app and upload to Samsung Galaxy S5 - 4.4.4 - API 19 - Genymotion.
  5. See only blank (white) screen after splash

image

bushev commented Aug 9, 2016

@danbucholtz the same for conference app.

Steps to reproduce:

  1. Check out ionic-conference-app
  2. ionic plugin add cordova-plugin-crosswalk-webview
  3. ionic build android --release
  4. Sing app and upload to Samsung Galaxy S5 - 4.4.4 - API 19 - Genymotion.
  5. See only blank (white) screen after splash

image

@danbucholtz danbucholtz added this to the 2.0.0-beta.12 milestone Aug 9, 2016

@danbucholtz

This comment has been minimized.

Show comment
Hide comment
@danbucholtz

danbucholtz Aug 9, 2016

Contributor

I can't speak to your apps, but I can recreate this issue by removing crosswalk from the conference app. Thanks for putting together the examples!

Assigning to beta 12.

Thanks,
Dan

Contributor

danbucholtz commented Aug 9, 2016

I can't speak to your apps, but I can recreate this issue by removing crosswalk from the conference app. Thanks for putting together the examples!

Assigning to beta 12.

Thanks,
Dan

@jgw96 jgw96 removed this from the 2.0.0-beta.12 milestone Aug 9, 2016

@jgw96

This comment has been minimized.

Show comment
Hide comment
@jgw96

jgw96 Aug 9, 2016

Contributor

Hello all! So we have tested this with crosswalk on a moto g running android 4.4.2 and cannot reproduce the issue. I would recommend re-cloning the conference app, running npm install, add crosswalk with ionic plugin add cordova-plugin-crosswalk-webview and then run ionic run android. Also, make sure you completely uninstall the app from your device too. @bushev i would also recommend testing with a real device if possible and not genymotion. Thanks evereyone!

Contributor

jgw96 commented Aug 9, 2016

Hello all! So we have tested this with crosswalk on a moto g running android 4.4.2 and cannot reproduce the issue. I would recommend re-cloning the conference app, running npm install, add crosswalk with ionic plugin add cordova-plugin-crosswalk-webview and then run ionic run android. Also, make sure you completely uninstall the app from your device too. @bushev i would also recommend testing with a real device if possible and not genymotion. Thanks evereyone!

@jgw96 jgw96 closed this Aug 9, 2016

@bushev

This comment has been minimized.

Show comment
Hide comment
@bushev

bushev Aug 9, 2016

@jgw96

So, Android 4.4.2 (4.4.4) is supported with crosswalk only? That means all apps that use tabs should include crosswalk and be ~30mb in size?

PS: This but initially comes from a real device with Android 4.4.4

bushev commented Aug 9, 2016

@jgw96

So, Android 4.4.2 (4.4.4) is supported with crosswalk only? That means all apps that use tabs should include crosswalk and be ~30mb in size?

PS: This but initially comes from a real device with Android 4.4.4

@jgw96

This comment has been minimized.

Show comment
Hide comment
@jgw96

jgw96 Aug 9, 2016

Contributor

@bushev could you try my above steps but without crosswalk please? Thanks!

Contributor

jgw96 commented Aug 9, 2016

@bushev could you try my above steps but without crosswalk please? Thanks!

@bushev

This comment has been minimized.

Show comment
Hide comment
@bushev

bushev Aug 9, 2016

@jgw96

Okay, my test results:

Latest ionic-conference-app

  1. git clone https://github.com/driftyco/ionic-conference-app.git && cd ionic-conference-app
  2. npm i && ionic run android

Result: I can see the white screen only

ionic-conference-app with beta10 (ionic-team/ionic-conference-app@5ec378d)

  1. git checkout 5ec378dbc58c611160e3522505de4ac99a331697 .
  2. Strict ionic beta version to 10 (remove "^")
  3. rm -rf node_modules && npm i && ionic run android

Result: Application works great

bushev commented Aug 9, 2016

@jgw96

Okay, my test results:

Latest ionic-conference-app

  1. git clone https://github.com/driftyco/ionic-conference-app.git && cd ionic-conference-app
  2. npm i && ionic run android

Result: I can see the white screen only

ionic-conference-app with beta10 (ionic-team/ionic-conference-app@5ec378d)

  1. git checkout 5ec378dbc58c611160e3522505de4ac99a331697 .
  2. Strict ionic beta version to 10 (remove "^")
  3. rm -rf node_modules && npm i && ionic run android

Result: Application works great

@bushev

This comment has been minimized.

Show comment
Hide comment
@bushev

bushev commented Aug 9, 2016

@jgw96 jgw96 reopened this Aug 10, 2016

@jgw96 jgw96 added this to the 2.0.0-beta.12 milestone Aug 10, 2016

@Ghayyas

This comment has been minimized.

Show comment
Hide comment
@Ghayyas

Ghayyas Aug 10, 2016

I have Android 4.4... When i login it show tabs. when I select any tab it hides the tab and shows white blank screen on tabs.. It only happens in Android 4.4, I have tested in browser and Android 5.0 and Iphone.. I works fine but not in my android 4.4 :(

Ghayyas commented Aug 10, 2016

I have Android 4.4... When i login it show tabs. when I select any tab it hides the tab and shows white blank screen on tabs.. It only happens in Android 4.4, I have tested in browser and Android 5.0 and Iphone.. I works fine but not in my android 4.4 :(

@Ionitron Ionitron removed the needs reply label Aug 10, 2016

@danbucholtz danbucholtz removed their assignment Aug 10, 2016

@shamrozwarraich

This comment has been minimized.

Show comment
Hide comment
@shamrozwarraich

shamrozwarraich Aug 11, 2016

@Ghayyas @bushev hiii
tab work for me
am removing the platform android and update it to 5.2.1 and then add the platform and run its working tabs shown ...
4.4kitkat

shamrozwarraich commented Aug 11, 2016

@Ghayyas @bushev hiii
tab work for me
am removing the platform android and update it to 5.2.1 and then add the platform and run its working tabs shown ...
4.4kitkat

@jgw96

This comment has been minimized.

Show comment
Hide comment
@jgw96

jgw96 Aug 11, 2016

Contributor

Hello @Ghayyas and @bushev ! We are still having trouble reproducing this issue. Would you mind checking what version of Cordova your project is using? ionic info should tell you. Thanks!

Contributor

jgw96 commented Aug 11, 2016

Hello @Ghayyas and @bushev ! We are still having trouble reproducing this issue. Would you mind checking what version of Cordova your project is using? ionic info should tell you. Thanks!

@danbucholtz danbucholtz self-assigned this Aug 11, 2016

@jgw96 jgw96 added the needs reply label Aug 11, 2016

@Ghayyas

This comment has been minimized.

Show comment
Hide comment
@Ghayyas

Ghayyas Aug 11, 2016

Your system information:

Cordova CLI: 6.2.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.35
Ionic App Lib Version: 2.0.0-beta.19
ios-deploy version: Not installed
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v4.4.5
Xcode version: Xcode 7.3 Build version 7D175

Ghayyas commented Aug 11, 2016

Your system information:

Cordova CLI: 6.2.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.35
Ionic App Lib Version: 2.0.0-beta.19
ios-deploy version: Not installed
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v4.4.5
Xcode version: Xcode 7.3 Build version 7D175

@Ionitron Ionitron removed the needs reply label Aug 11, 2016

@Ghayyas

This comment has been minimized.

Show comment
Hide comment
@Ghayyas

Ghayyas Aug 11, 2016

Also It someTimes Blinks Loading.. LoadingCtrl

Ghayyas commented Aug 11, 2016

Also It someTimes Blinks Loading.. LoadingCtrl

@bushev

This comment has been minimized.

Show comment
Hide comment
@bushev

bushev Aug 12, 2016

@jgw96 Hello! I have tested latest Cordova and Android platform 5.2.1

Unfortunately with the same result.

There is a short video demonstrates how it was: https://youtu.be/5a1j-CRBUFA

The same for conference app: https://youtu.be/qpR5CI_GbCA


Cordova CLI: 6.3.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.32
Ionic App Lib Version: 2.0.0-beta.18
ios-deploy version: 1.8.6
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v5.11.1
Xcode version: Xcode 7.3.1 Build version 7D1014

bushev commented Aug 12, 2016

@jgw96 Hello! I have tested latest Cordova and Android platform 5.2.1

Unfortunately with the same result.

There is a short video demonstrates how it was: https://youtu.be/5a1j-CRBUFA

The same for conference app: https://youtu.be/qpR5CI_GbCA


Cordova CLI: 6.3.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.32
Ionic App Lib Version: 2.0.0-beta.18
ios-deploy version: 1.8.6
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v5.11.1
Xcode version: Xcode 7.3.1 Build version 7D1014

@oliviercherrier

This comment has been minimized.

Show comment
Hide comment
@oliviercherrier

oliviercherrier Aug 20, 2016

Hello,

I have got the same issue on Android 4.4 (Samsung Galaxy S3 and Galaxy Tab)

Ionic Info:
Cordova CLI: 6.3.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.37
Ionic App Lib Version: 2.0.0-beta.20
OS: Windows 7 SP1
Node Version: v4.4.7

Can you give us update about the resolution of this issue?

Thank you for your help,
Olivier.

oliviercherrier commented Aug 20, 2016

Hello,

I have got the same issue on Android 4.4 (Samsung Galaxy S3 and Galaxy Tab)

Ionic Info:
Cordova CLI: 6.3.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.37
Ionic App Lib Version: 2.0.0-beta.20
OS: Windows 7 SP1
Node Version: v4.4.7

Can you give us update about the resolution of this issue?

Thank you for your help,
Olivier.

@danbucholtz danbucholtz removed their assignment Aug 21, 2016

@F1ow

This comment has been minimized.

Show comment
Hide comment
@F1ow

F1ow Aug 23, 2016

Hi, I'm having the same issue on iOS 8.x

Ionic Info:
Cordova CLI: 6.3.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.37
Ionic App Lib Version: 2.0.0-beta.20
ios-deploy version: 1.8.6
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v4.4.5
Xcode version: Xcode 7.3.1 Build version 7D1014

F1ow commented Aug 23, 2016

Hi, I'm having the same issue on iOS 8.x

Ionic Info:
Cordova CLI: 6.3.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.37
Ionic App Lib Version: 2.0.0-beta.20
ios-deploy version: 1.8.6
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v4.4.5
Xcode version: Xcode 7.3.1 Build version 7D1014

@guidux

This comment has been minimized.

Show comment
Hide comment
@guidux

guidux Aug 23, 2016

Hi, I am having the same issue on Android 4.4.2 (samsung s5 mini) and 4.4.4 (genymotion).

I downloaded the latest code of ionic-conference-app and after playing with its css attributes I was able to display the tab by changing the inline css attribute of "ion-tabbar" bottom: 0; to a 2px but when changing to another tab the tab bar vanishes again till go back. I spent many hours to try to find out the root cause and a possible work around. but I couldn't. Similar behaviour happens to my own project I changed the bottom to different values.

I also upload a youtube video to show the behaviour.

Additionally I left my ionic info:

Cordova CLI: 6.2.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.32
Ionic App Lib Version: 2.0.0-beta.18
ios-deploy version: Not installed
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v5.12.0
Xcode version: Xcode 7.3.1 Build version 7D1014

guidux commented Aug 23, 2016

Hi, I am having the same issue on Android 4.4.2 (samsung s5 mini) and 4.4.4 (genymotion).

I downloaded the latest code of ionic-conference-app and after playing with its css attributes I was able to display the tab by changing the inline css attribute of "ion-tabbar" bottom: 0; to a 2px but when changing to another tab the tab bar vanishes again till go back. I spent many hours to try to find out the root cause and a possible work around. but I couldn't. Similar behaviour happens to my own project I changed the bottom to different values.

I also upload a youtube video to show the behaviour.

Additionally I left my ionic info:

Cordova CLI: 6.2.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.32
Ionic App Lib Version: 2.0.0-beta.18
ios-deploy version: Not installed
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v5.12.0
Xcode version: Xcode 7.3.1 Build version 7D1014

@stewwan

This comment has been minimized.

Show comment
Hide comment
@stewwan

stewwan Sep 3, 2016

same here

Your system information:

Cordova CLI: 6.3.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.37
Ionic App Lib Version: 2.0.0-beta.20
OS:
Node Version: v4.4.3

stewwan commented Sep 3, 2016

same here

Your system information:

Cordova CLI: 6.3.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.37
Ionic App Lib Version: 2.0.0-beta.20
OS:
Node Version: v4.4.3

@stewwan

This comment has been minimized.

Show comment
Hide comment
@stewwan

stewwan Sep 4, 2016

Conference App - Android 4.4.2 - samsung galaxy s4 mini

tabs doesn't appear

14218068_1208967615834129_410809317_n

but appears in detail

14159210_1208967542500803_1565410163_n

stewwan commented Sep 4, 2016

Conference App - Android 4.4.2 - samsung galaxy s4 mini

tabs doesn't appear

14218068_1208967615834129_410809317_n

but appears in detail

14159210_1208967542500803_1565410163_n

@RigoTheDev

This comment has been minimized.

Show comment
Hide comment
@RigoTheDev

RigoTheDev Sep 16, 2016

Any reason for why this isn't working? It's pretty weird.

RigoTheDev commented Sep 16, 2016

Any reason for why this isn't working? It's pretty weird.

@jgw96

This comment has been minimized.

Show comment
Hide comment
@jgw96

jgw96 Sep 17, 2016

Contributor

Happy to say that after testing of beta.12 today this issue seems to be fixed. Tabs are working perfectly on Android 4.4.2 and up. Thanks everyone for using Ionic!

Contributor

jgw96 commented Sep 17, 2016

Happy to say that after testing of beta.12 today this issue seems to be fixed. Tabs are working perfectly on Android 4.4.2 and up. Thanks everyone for using Ionic!

@jgw96 jgw96 closed this Sep 17, 2016

@AbuHani

This comment has been minimized.

Show comment
Hide comment
@AbuHani

AbuHani Oct 9, 2016

still have the same issue in the latest release v2.0.0-rc.0 ! when using tabs with side menu.

AbuHani commented Oct 9, 2016

still have the same issue in the latest release v2.0.0-rc.0 ! when using tabs with side menu.

@AbuHani

This comment has been minimized.

Show comment
Hide comment
@AbuHani

AbuHani Oct 9, 2016

i fix it by set z-index: -1;

ion-nav, ion-tab, ion-tabs {
z-index: -1;
}

AbuHani commented Oct 9, 2016

i fix it by set z-index: -1;

ion-nav, ion-tab, ion-tabs {
z-index: -1;
}
@johnofkorea

This comment has been minimized.

Show comment
Hide comment
@johnofkorea

johnofkorea Oct 10, 2016

@AbuHani Thank you so much!! You are my hero!!

I don't understand why setting z-index to -1, not 1 solves this problem.

However, I cannot thank you enough. Thank you so much!!!

johnofkorea commented Oct 10, 2016

@AbuHani Thank you so much!! You are my hero!!

I don't understand why setting z-index to -1, not 1 solves this problem.

However, I cannot thank you enough. Thank you so much!!!

@shamrozwarraich

This comment has been minimized.

Show comment
Hide comment
@shamrozwarraich

shamrozwarraich Oct 10, 2016

i which componets are file u add this @johnofkorea @AbuHani

ion-nav, ion-tab, ion-tabs {
z-index: -1;
}

shamrozwarraich commented Oct 10, 2016

i which componets are file u add this @johnofkorea @AbuHani

ion-nav, ion-tab, ion-tabs {
z-index: -1;
}
@johnofkorea

This comment has been minimized.

Show comment
Hide comment
@johnofkorea

johnofkorea Oct 10, 2016

@shamrozwarraich
In my case, app/theme/variables.scss didn't work. (which is weird, though..)
The right target is in the very first page the tabs shows.
Let's say tabs shows pageA, pageB, pageC, and pageD.
If the very first page the tabs shows is pageA,
then you can add this at the bottom of "page-a.scss"

Or, to make things safe, you can add this to the bottom of all the scss files you find. :-)
Good luck, @shamrozwarraich !

johnofkorea commented Oct 10, 2016

@shamrozwarraich
In my case, app/theme/variables.scss didn't work. (which is weird, though..)
The right target is in the very first page the tabs shows.
Let's say tabs shows pageA, pageB, pageC, and pageD.
If the very first page the tabs shows is pageA,
then you can add this at the bottom of "page-a.scss"

Or, to make things safe, you can add this to the bottom of all the scss files you find. :-)
Good luck, @shamrozwarraich !

@pskhodad

This comment has been minimized.

Show comment
Hide comment
@pskhodad

pskhodad Oct 21, 2016

This seems to be regression due to e4bbcc6
Reverting the change there renders the tabs just fine.
Since issue(#7154) that commit was fixing was specific to iOS and this issue is specific to Android 4.4, we need to have solution which addresses issues on both.

pskhodad commented Oct 21, 2016

This seems to be regression due to e4bbcc6
Reverting the change there renders the tabs just fine.
Since issue(#7154) that commit was fixing was specific to iOS and this issue is specific to Android 4.4, we need to have solution which addresses issues on both.

@pskhodad

This comment has been minimized.

Show comment
Hide comment
@pskhodad

pskhodad Oct 21, 2016

can this issue be re-opened to get proper fix.

pskhodad commented Oct 21, 2016

can this issue be re-opened to get proper fix.

@dumparun

This comment has been minimized.

Show comment
Hide comment
@dumparun

dumparun Oct 24, 2016

Appreciate a fix for this please. I do have the same problem. +1

dumparun commented Oct 24, 2016

Appreciate a fix for this please. I do have the same problem. +1

@manucorporat manucorporat reopened this Oct 24, 2016

@manucorporat manucorporat self-assigned this Oct 24, 2016

@brandyscarney brandyscarney modified the milestone: 2.0.0-rc.2 Nov 4, 2016

@thendokhae

This comment has been minimized.

Show comment
Hide comment
@thendokhae

thendokhae Nov 29, 2016

@shamrozwarraich

your solution worked for me as well, thanks

thendokhae commented Nov 29, 2016

@shamrozwarraich

your solution worked for me as well, thanks

@priyeshn

This comment has been minimized.

Show comment
Hide comment
@priyeshn

priyeshn Nov 29, 2016

it did not work for me.. Which scss file we need to put in this code

priyeshn commented Nov 29, 2016

it did not work for me.. Which scss file we need to put in this code

@pbreuss

This comment has been minimized.

Show comment
Hide comment
@pbreuss

pbreuss Dec 1, 2016

I added

ion-nav, ion-tab, ion-tabs {
z-index: -1;
}

to the file src/app/app.scss and it worked right away: tabs are showing!

Tested on:
Android 4.4.4 (Sony Xperia)

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.13
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: OS X El Capitan
Node Version: v4.6.0
Xcode version: Xcode 8.1 Build version 8B62

pbreuss commented Dec 1, 2016

I added

ion-nav, ion-tab, ion-tabs {
z-index: -1;
}

to the file src/app/app.scss and it worked right away: tabs are showing!

Tested on:
Android 4.4.4 (Sony Xperia)

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.13
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: OS X El Capitan
Node Version: v4.6.0
Xcode version: Xcode 8.1 Build version 8B62

@jgw96

This comment has been minimized.

Show comment
Hide comment
@jgw96

jgw96 Dec 29, 2016

Contributor

Hello all! Does this still happen in rc4 ?

Contributor

jgw96 commented Dec 29, 2016

Hello all! Does this still happen in rc4 ?

@cesarandreslopez

This comment has been minimized.

Show comment
Hide comment
@cesarandreslopez

cesarandreslopez Jan 4, 2017

Just checked rc4 in Kitkat and seems to work ok from my side.

cesarandreslopez commented Jan 4, 2017

Just checked rc4 in Kitkat and seems to work ok from my side.

@pbreuss

This comment has been minimized.

Show comment
Hide comment
@pbreuss

pbreuss Jan 9, 2017

I had this issue as well on my old Android 4.4.4 test device, and now I tested it again with RC4 and the problem does not seem to happen anymore. So no fix is needed to display the tabs on Android 4.4.4.

Here is my platform:
Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.4
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.9
Ionic App Scripts Version: 0.0.47
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: OS X El Capitan
Node Version: v6.9.4
Xcode version: Xcode 8.2.1 Build version 8C1002

PS: Ionic is wonderful!

pbreuss commented Jan 9, 2017

I had this issue as well on my old Android 4.4.4 test device, and now I tested it again with RC4 and the problem does not seem to happen anymore. So no fix is needed to display the tabs on Android 4.4.4.

Here is my platform:
Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.4
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.9
Ionic App Scripts Version: 0.0.47
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: OS X El Capitan
Node Version: v6.9.4
Xcode version: Xcode 8.2.1 Build version 8C1002

PS: Ionic is wonderful!

@jgw96

This comment has been minimized.

Show comment
Hide comment
@jgw96

jgw96 Jan 19, 2017

Contributor

Hello all! Since this seems to be fixed now (you guys cannot repro and i cannot repro) I am going to close this issue for now. Thanks for using Ionic! (:

Contributor

jgw96 commented Jan 19, 2017

Hello all! Since this seems to be fixed now (you guys cannot repro and i cannot repro) I am going to close this issue for now. Thanks for using Ionic! (:

@jgw96 jgw96 closed this Jan 19, 2017

@wivancic

This comment has been minimized.

Show comment
Hide comment
@wivancic

wivancic Mar 16, 2017

I had one page where the tab wasn't showing on Android 4.4.4

This addition fixed the problem.
Was using Ionic Framework Version: 2.0.0-rc.2

ion-nav, ion-tab, ion-tabs {
z-index: -1;
}

wivancic commented Mar 16, 2017

I had one page where the tab wasn't showing on Android 4.4.4

This addition fixed the problem.
Was using Ionic Framework Version: 2.0.0-rc.2

ion-nav, ion-tab, ion-tabs {
z-index: -1;
}

@ionic-issue-bot

This comment has been minimized.

Show comment
Hide comment
@ionic-issue-bot

ionic-issue-bot bot Sep 3, 2018

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

ionic-issue-bot bot commented Sep 3, 2018

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

@ionic-issue-bot ionic-issue-bot bot locked and limited conversation to collaborators Sep 3, 2018

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.