2017-09-06 67 views
1

我有一個視圖內的視圖。我正在嘗試垂直居中顯示子視圖。 下面是示例代碼:反應原生:垂直居中查看視圖內

   <View style={globalStyle.text}> 
       <Text style={[globalStyle.name]}> 
        {name} 
       </Text> 
       <View style={globalStyle.timeContainer}> 
       <Image style={globalStyle.tinyIcon} source={require('./Thumbnails/time-tiny.png')}/> 
       <Text style={globalStyle.audio_count}> 
        {this.state.audioTime[rowID]} 
       </Text> 
       </View> 
       </View> 

在有單獨的文本垂直居中子內容justifyContent: 'center'工作正常。但是,當涉及一個小孩View它不起作用。我怎樣才能做到這一點?

下面是一個相同的圖片:我試圖使白框內的文本垂直居中對齊。 enter image description here

+0

你需要與你的意思更清晰解決的問題。繪圖可以是有用的,CSS是必須的。 – LGSon

+0

@LGSon更新了問題。基本上,問題是垂直居中視圖的所有內容。 –

+1

通常,對於行方向上的flex項目,您可以使用'alignItems:'center'' – LGSon

回答

0

通過增加一個封閉View

   <View style={globalStyle.text}> 
       <View> 
       <Text style={[globalStyle.name]}> 
        {name} 
       </Text> 
       <View style={globalStyle.timeContainer}> 
       <Image style={globalStyle.tinyIcon} source={require('./Thumbnails/time-tiny.png')}/> 
       <Text style={globalStyle.audio_count}> 
        {this.state.audioTime[rowID]} 
       </Text> 
       </View> 
       </View> 
       </View>