React native 如何利用按钮之间的间距使并排按钮居中？

嗨，伙计们，我做了这两个按钮，我希望它们对中，有圆形的边缘，以及它们之间有一些间距。这是我目前的代码：

export default class SortingComponent extends Component {



render() {
    return (
        <ScrollView>
            <View>
                <Text style = {styles.heading}>
                    Find Clinics By:
                </Text>
            </View>
            <View style={{ flexDirection:"row" }}>
                <View style = {styles.buttonStyle}>
                    <Button 
                        title="Total Time"
                        onPress = {() => console.log("Sort by Total Time")}
                    >Total Time</Button>
                </View>
                <View style = {styles.buttonStyle}>
                    <Button
                        title="Travel Time"
                        onPress = {() => console.log("Sort by Travel Time")}
                    >Travel Time</Button>
                </View>
            </View>
        </ScrollView>
        
    )
}
}

const styles = StyleSheet.create({
  buttonStyle: {
    fontSize: 20,
    fontWeight: "bold",
    alignItems: "center",
  },
  heading: {
    fontSize: 35,
    fontWeight: "bold",
  }
});

导出默认类排序组件扩展组件{
render（）{
返回(
通过以下方式查找诊所：
log（“按总时间排序”）}
>总时间
console.log（“按行程时间排序”）}
>旅行时间
)
}
}
const styles=StyleSheet.create({
按钮样式：{
尺寸：20，
fontWeight：“粗体”，
对齐项目：“中心”，
},
标题：{
尺码：35，
fontWeight：“粗体”，
}
});

添加

调整内容：在视图中均匀放置“

”

<View style={{ flexDirection:"row", justify-content : 'space-evenly'}}>
   .....
</View>

.....

justify content:“均匀地分配空间”用于按钮容器。在您的视图中，它是滚动视图。