how to set absolute position to top view, not parent in react native-CodePudding

I want to a view positioned absolutely to root view. For example, if there are 3 views, GrandFatherView, FatherView, ChildView. I want ChildView to be positioned absolutely to GrandFatherView without changing FatherView style.

<View> // GrandFatherView
  <View style={{marginTop: 100}}> // FatherView
    <View style={{position:'absolute', left: 0, top: 0, right: 0, height: 10}}> // ChildView
      {{ some contents}}
    </View>
  </View>
</View>

So I want ChildView to be at top, but it shows in top 100 as it's inside FatherView I don't want to change FatherView position for this.

Is this impossible without changing hierarchy? Please help!

Thanks

CodePudding user response：

If we have a margin with the value of x which in your example 100, then set -x for top value .

like this:

<View> // GrandFatherView
  <View style={{marginTop: 100}}> // FatherView
    <View style={{position:'absolute', left: 0, top: -100, right: 0, height: 10}}> // ChildView
      {{ some contents}}
    </View>
  </View>
</View>

CodePudding user response：

<View style={{position:'relative'}}/> // GrandFatherView