I am trying to position a Font Awesome icon in a React Native project using absolute positioning relative to the grandparent element, rather than its direct parent.
After some research, I came across the following information on this page: https://reactnative.dev/docs/layout-props#position
positionin React Native behaves similarly to regular CSS, with the default setting beingrelative, makingabsolutepositioning always relative to the parent element.
In the scenario I have provided, how can I position the icon relative to the grandparent TouchableOpacity instead of the parent View? Any help would be appreciated.
<TouchableOpacity
onPress={() => {}}
>
<View>
{/* Other markup here. */}
</View>
<View>
{/* Need to position this icon relative to TouchableOpacity, not View. */}
<FontAwesome name="heart" />
</View>
</TouchableOpacity>