Pritish
Pritish

Reputation: 1368

How to put two components at right and left of the screen

I need to put two components at two ends of the screen. Following is my code.

<View style = {{flexDirection:"row"}}>
    <Text>cancel</Text>
    <Text style={{justifyContent:"flex-end",alignItems:"flex-end"}}>cancel</Text>

The two buttons are near to each other and I want to push the second button to the extreme right end of the screen without margin, how to do it by properties? It is not working currently. Thank you.

Upvotes: 0

Views: 243

Answers (1)

Ron Astle Lobo
Ron Astle Lobo

Reputation: 1314

You need to do something like this

<View style={{flex:1,flexDirection:"row",justifyContent:"space-between"}}>
    <View style={{flex:0.5}}>
        <Text>Cancel 1</Text>
    </View>
    <View style={{flex:0.5,alignItems:"flex-end"}}> 
        <Text>Cancel 2</Text>
    </View>
</View>

Upvotes: 2

Related Questions