2

I have encountered a problem porting my app from iOS to android. I have built a minimal bug case with which it can be reproduced.

My app is very simple and consists of one component:

const Main = () => (
  <View>
    <View style= {styles.green}>
      <View style={styles.blue}/>
    </View>
  </View>
)

export default Main;

const styles = StyleSheet.create({
  green: {
    height:200,
    marginTop: 200,
    backgroundColor: 'green',
  },
  blue:{
    position:'absolute',
    height: 100,
    width: 100,
    top: -50,
    backgroundColor: 'blue',
  },
})

But strangely this component renders differently on iOS and Android

iOS

render ios

Android

render android

I would like it to render like on iOS on both devices. You can check code on this repo https://github.com/42void/ReactNativeBug to easily reproduce it.

Thank you!

Community
  • 1
  • 1
user2015762
  • 488
  • 3
  • 12

1 Answers1

2

In Android overflow property defaults to 'hidden' and cannot be changed.

From 0.23 known issues, apparently isn't fixed yet.

CôteViande
  • 664
  • 1
  • 6
  • 21