Android 文本对齐未在react native中自动调整

正如您在listview中看到的，每个子描述的a应该有一个长字符串，整个文本只是不断向右移动，而不是正确地将其自身与蓝色背景上的描述对齐

我觉得奇怪的是，当它在listview的行上呈现时，它的工作方式不一样

你的见解将欢迎我如何解决这个问题的造型

下面是renderRow组件的一个片段

render（）{
var数据=this.props.data；
var commentor=data.user\u id；
var username=\ u0.chain（this.props.userList）
.过滤器（功能（项目）{
return item.id==commentor
})
.first（）
.pick（'用户名'）
.value（）.username；
返回(
{username}
{data.comment}
);
}

问题来自于在文本中添加

图像

元素

我怀疑您的

flexDirection:'row'

在您的

容器

样式中，在这种情况下，文本将继续向右，而不是像

flexDirection:'column'

那样包装

编辑

我最初给出的答案并不是处理这种情况的最佳方法

正确的方法是使用样式中的

flexDirection:“column”

将文本组件包装在

视图中。这样，所有内容都将使用FlexBox，文本将正确换行

在这种情况下：

<View style={styles.inner_container}>
  <Text style={{fontWeight: '500', fontSize: 13}}>{username}</Text>
  <View style={{flexDirection: 'column'}}>
    <Text style={{flex: 1, fontWeight: '300', fontSize: 14, marginTop: 5}}>
      {data.comment}
    </Text>
  </View>
</View>

请注意，我正在使用
imageSize
设置图像的大小以及文本的边距。
谢谢，我添加了一个视图来包装描述，并将其样式设置为flexDirection:“column”，还为其添加了flex:1，但是您的解决方案不能保证文本不会被绝对的
化身隐藏。。！我在我的项目中遇到了这个问题，却找不到解决办法！如果元素不是图像，而是可变宽度，则该解决方案不可行text@Marc你说得对。我修改了我的答案，以便更好地解决这个问题。
var imageSize = 50;

var styles = StyleSheet.create ({
    avatar: {
        position: 'absolute',
        width: imageSize,
        height: imageSize
    },
    container: {
        flexDirection: 'column',
        padding: 10
    },
    inner_container: {
        marginLeft: imageSize,
        paddingLeft: 15
    },
});