layout - Reactive Native: place view bellow another centered view -
i used lot using android relative layouts:
+-----------+ | |<- parent view | | | +-----+ | | | | <--- centered | | | | child view | +-----+ | | [xxx] <---- view positioned | | bellow centered +-----------+ child view is possible achieve same in react-native?
i did similar today this:
<view style={{ flex: 1 }}> <view style={{ height: 350, backgroundcolor: "blue" }}> <view style={{ backgroundcolor: "red", height: 100, width: 100, position: "absolute", top: "50%", left: "50%", marginleft: -50, // half width of child margintop: -50 // half height of child }}> <text>hello...</text> </view> <view style={{ backgroundcolor: "green", height: 30, width: 100, position: "absolute", top: "50%", left: "50%", marginleft: -50, // half width of child margintop: 70 // controls how far down center child }}> <text>...world</text> </view> </view> this require know size of elements inside parent can correctly set marginleft , margintop values on children.
Comments
Post a Comment