React-native: TouchableHighlight & TouchableOpacity and child with `position: "absolute"`

[yelled3]

I'm encountering some weird behaviour when placing a child view with position: "absolute" inside an TouchableHighlight or TouchableOpacity.

• in TouchableOpacity the child disappears
• in TouchableHighlight the child disappears on touch

I assume it's something to do with the internal opacity overlay...

[d-vine]

After upgrading from 0.8.0 to 0.10.0 I encountered a similar problem with layouts that had been working before and now are broken. It seems that when wrapped in TouchableOpacity a view reference position for "absolute" is it's relative position in the layout. Also the flex attribute doesn't work properly any more.

My wild guess is that the new Animated.view has something to do with it.

[ide]

Try positioning the TouchableOpacity instead of the component inside of it. This is mentioned in the breaking changes section of the release notes.

[d-vine]

Oh man. Thanks. That is actually pretty hard to miss. This is what you get from skipping versions :)

[brentvatne]

@ide's solution is correct :)