Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6212

Add 2 buttons in the same line

$
0
0

How can I use Native Base buttons in a way that they both appear to be in the same line? Currently, the second button is on the right as it should be, but it appears a bit lower than the first button. How can I fix this?

<View style={scaledAvailableTripsStyles.buttonView}><Button          rounded          style={scaledAvailableTripsStyles.button}><Text style={scaledAvailableTripsStyles.text}>Button 1</Text></Button><View style={scaledAvailableTripsStyles.rightButtonView}><Button          rounded          style={scaledAvailableTripsStyles.buttonBlack}><Text style={scaledAvailableTripsStyles.text}>Button 2</Text></Button></View></View>

Styling:

button: {    width: moderateScale(170),    height: moderateScale(40),    backgroundColor: '#31C283',    justifyContent: 'center',  },  buttonBlack: {    width: moderateScale(170),    height: moderateScale(40),    backgroundColor: '#2E3331',    justifyContent: 'center',  },  text: {    fontSize: moderateScale(14, 0.7),  },  searchField: {    width: 300,  },  buttonView: {    paddingTop: 450,  },  rightButtonView: {    paddingLeft: 200,  }

Edit:Got this after adding flexDirection. How can I make some space between the two buttons?

enter image description here


Viewing all articles
Browse latest Browse all 6212

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>