Skip to content
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

zIndex works in iOS but not working in Android (even after 0.48.2) #15994

Closed
ketn opened this issue Sep 18, 2017 · 2 comments
Closed

zIndex works in iOS but not working in Android (even after 0.48.2) #15994

ketn opened this issue Sep 18, 2017 · 2 comments
Assignees
Labels
Issue: Author Provided Repro This issue can be reproduced in Snack or an attached project. Resolution: Locked This issue was locked by the bot.

Comments

@ketn
Copy link

ketn commented Sep 18, 2017

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

  1. react-native -v:
    react-native-cli: 2.0.1
    react-native: 0.48.2
  2. node -v:
    v6.3.0
  3. npm -v:
    5.4.0
  4. yarn --version:
    1.0.1

Then, specify:

  • Target Platform: Android
  • Development Operating System: macOS Sierra
  • Build tools: -

Steps to Reproduce

(Write your steps here:)

  1. When you run the app, there are supposed to be two images that are not visible because zIndex is applied to them.
  2. If you delete the zIndex part from their style, the images would be visible.
  3. You can press both the images individually and drag them left and right.

Expected Behavior

First of all, the images should be visible. Second, when visible, those images can be pressed and dragged to left or right. As per the code, when I press on the left image and slide it to right, since its zIndex will increase, it should come above the right image when dragged right. Same will happen for the right image when dragged to the left side (i.e. this time right image would come above left image)

Actual Behavior

Due to some bug, even though, the above code works properly in iOS, in Android specifically, it gives this bug due to which images are not visible (just because they have zIndex assigned)

Also, I've gone through #15713 , #8968 and #15203
They state that the bug got fixed in 0.48 and 0.48.2 , but as you can see in the reproducible demo below, it still exists in 0.48.2.

Reproducible Demo

https://snack.expo.io/HkJ4M_T5W

Anyone has any idea what's wrong since this bug is still happening in 0.48.2 for Android (yet working for iOS)?

@janicduplessis janicduplessis self-assigned this Sep 22, 2017
@janicduplessis janicduplessis added Android Issue: Author Provided Repro This issue can be reproduced in Snack or an attached project. labels Sep 22, 2017
@Noitidart
Copy link

Hey I am using 0.49.3 @ketn and a fix landed. Try it again it might work, let us know.

@SourceCipher
Copy link

Same issue with zIndex.. Seems like they have no meaning to my components at all, no matter if I set zIndex of 1 component to 99 while the rest to 1 or none, nothing will happen. Even positioning to absolute will not help. Wasted too much time on this and still cant find a working way around

@facebook facebook locked as resolved and limited conversation to collaborators Oct 17, 2018
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Oct 17, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Issue: Author Provided Repro This issue can be reproduced in Snack or an attached project. Resolution: Locked This issue was locked by the bot.
Projects
None yet
Development

No branches or pull requests

5 participants