在自定义组件中设置文本时出错

Question

我正在UI屏幕上工作。

我正在将该屏幕从左数第一个。我只停留在一点。我做了很多。。

我需要在一个方向上对齐文本，还应该如何放置此背景图像，当我放置按钮时，这些内容在屏幕上不可见。

这是我设置视图的地方：

 <View style={styles.userInformations}>
 <View style={{ height: 195, width: "100%", backgroundColor: "#22C1B9", }}>
 <Text style={styles.headline}>Dance</Text>
 <View style={styles.headlines}>
 <Text >3754 TRACKS</Text>
 </View>

在这里，我给出了样式：

headline: {
    textAlign: 'center',
    fontWeight: 'bold',
    fontSize: 35,
    flex: 1,
    flexDirection: 'column',
marginTop:80,
    width: 200,
    height: 40,
    marginLeft:80,
    justifyContent: 'center', 
    alignItems: 'center',
},
headlines: {
  textAlign: 'center',
  fontWeight: 'bold',
  fontSize: 20,
  marginTop: 10,
  width: 200,
  height: 30,
  marginLeft:80,
  justifyContent: 'center', 
  alignItems: 'center',
},
searchBtnStyle: {
  marginTop: 15,
  backgroundColor: '#FFD701',
  borderColor: 'transparent',
  borderWidth: 0,
  borderRadius: 25,
  width: '80%',
  padding: 5
},