Skip to content Skip to sidebar Skip to footer

Align Two Children Differently In React Native

I'd like to have a header with a back button to the left and a text/title in the center of the header. Like this:

Solution 1:

Here we go:

<Viewstyle={{width:devicewidth,flexDirection:'row',height:40,top:0,position:'absolute'}}><TouchableOpacitystyle={{left:0,position:'absolute',alignItems:'flex-start'}}><Textstyle={styles.topbarButton}>{" <"}</Text></TouchableOpacity><Viewstyle={{justifyContent:'center'}}><Textstyle={styles.topbarText}>Title</Text></View></View>

The above code will print back button at the top left and text at the center. Flex direction is used to indicate view to print in a row direction.

Post a Comment for "Align Two Children Differently In React Native"