React Native Align自伸缩端未按预期工作
非常简单的一个方法是，在左边对齐一些文本，在右边对齐一些文本。为此，我认为我应该使用flexbox和以下代码：
return (
<TouchableOpacity disabled={isLoading}>
<View style={styles.container}>
<View style={styles.venueImageContainer}>
{isLoading ? (
<Loader />
) : (
<Image style={styles.venueImage} source={ { uri: getImage()} } />
)}
</View>
<View style={{flexDirection: 'row', backgroundColor: 'red'}}>
<View style={{alignSelf: 'flex-start', backgroundColor: 'blue'}}>
<Text style={styles.venueName}>{venue.name}</Text>
</View>
<View style={{alignSelf: 'flex-end', backgroundColor: 'green'}}>
<Text style={styles.personCount}>Test</Text>
</View>
</View>
</View>
</TouchableOpacity>)
通过样式引用的唯一样式是文本颜色和大小。所以没有什么可以干扰柔性布局。
因此，父容器获得全宽度，但子容器不会通过flex-start或flex-end对齐。
我是新手，所以请对我宽容一些。。。
干杯，伙计们：）
共有3个答案
您的解决方案不起作用，因为CSS属性align self用于横轴，而alignSelf的工作方式相同，因此它不能用于水平对齐（此处为主轴）。
- 第一个解决方案：使用
理由内容：空格之间它非常适合您的情况：
<View style={{ flexDirection: 'row', backgroundColor: 'red', justifyContent: 'space-between' }}>
<View style={{backgroundColor: 'blue' }}>
<Text>Left</Text>
</View>
<View style={{backgroundColor: 'green' }}>
<Text>Right</Text>
</View>
</View>
<View style={{ flexDirection: 'row', backgroundColor: 'red' }}>
<View style={{ backgroundColor: 'blue' }}>
<Text>Left</Text>
</View>
<View style={{flex: 1}}></View>
<View style={{ backgroundColor: 'green' }}>
<Text>Right</Text>
</View>
</View>
也许它意味着red视图的末尾，它位于green视图本身的末尾。在红色的视图上放一个，如下所示：
return (
<TouchableOpacity disabled={isLoading}>
<View style={styles.container}>
<View style={styles.venueImageContainer}>
{isLoading ? (
<Loader />
) : (
<Image style={styles.venueImage} source={ { uri: getImage()} } />
)}
</View>
<View style={{flexDirection: 'row', backgroundColor: 'red', alignSelf: 'stretch'}}>
<View style={{alignSelf: 'flex-start', backgroundColor: 'blue'}}>
<Text style={styles.venueName}>{venue.name}</Text>
</View>
<View style={{alignSelf: 'flex-end', backgroundColor: 'green'}}>
<Text style={styles.personCount}>Test</Text>
</View>
</View>
</View>
</TouchableOpacity>)
或者，您可以在绿色视图中使用位置：'绝对值来使用一些固定值来更改它的位置，如下所示：
return (
<TouchableOpacity disabled={isLoading}>
<View style={styles.container}>
<View style={styles.venueImageContainer}>
{isLoading ? (
<Loader />
) : (
<Image style={styles.venueImage} source={ { uri: getImage()} } />
)}
</View>
<View style={{flexDirection: 'row', backgroundColor: 'red'}}>
<View style={{alignSelf: 'flex-start', backgroundColor: 'blue'}}>
<Text style={styles.venueName}>{venue.name}</Text>
</View>
<View style={{backgroundColor: 'green', position: 'absolute', right: 10}}>
<Text style={styles.personCount}>Test</Text>
</View>
</View>
</View>
</TouchableOpacity>)
更改right： 10值以匹配您的需求。
或者在红色视图上放置一个理由Content：'space-中间'，如下所示：
return (
<TouchableOpacity disabled={isLoading}>
<View style={styles.container}>
<View style={styles.venueImageContainer}>
{isLoading ? (
<Loader />
) : (
<Image style={styles.venueImage} source={ { uri: getImage()} } />
)}
</View>
<View style={{flexDirection: 'row', backgroundColor: 'red', justifyContent: 'space-between'}}>
<View style={{alignSelf: 'flex-start', backgroundColor: 'blue'}}>
<Text style={styles.venueName}>{venue.name}</Text>
</View>
<View style={{alignSelf: 'flex-end', backgroundColor: 'green'}}>
<Text style={styles.personCount}>Test</Text>
</View>
</View>
</View>
</TouchableOpacity>)
但是如果你想在红色视图中有两个以上的视图，其中一个会在中间，所以我不认为你会想要那个。
（我不知道为什么你的红色视野一直延伸到视野的尽头，但我认为不应该，我可能错了）
您是否尝试过在之间使用空格？
<View style={{flexDirection:'row', justifyContent:'space-between', backgroundColor:'red'}}>
-
我正在使用spring Roo并希望访问Controller类中的一个bean，该类在ApplicationContext.xml中具有以下配置： 配置类本身是： 在我的Controller中，我认为一个简单的Autowired注释应该可以完成这项工作 在启动过程中，spring在setSkipWeeks方法中打印消息。不幸的是，每当我在控制器中调用config.getSkipWeeks（）时，它
-
当我运行以下程序时，它只打印 然而，从Java 8的equalsIgnoreCase文档中我们发现： 如果以下至少一项为真，则两个字符c1和c2被视为相同的忽略情况: •对每个字符应用java.lang.character.ToUpperCase（char）方法会产生相同的结果 所以我的问题是为什么这个程序不打印 在这两种操作中，都使用了大写字符。
-
我试图使用来传输我根据前面的问题设置的自定义标头。 我在文件中读到... 我的属性包括：
-
我正在和selenium一起工作，刮一些数据。 有一个按钮在页面上，我正在点击说“Custom_Cols”。这个按钮为我打开了一个窗口，我可以在那里选择我的列。 我的问题是为什么新窗口上的元素不可见，即使我正在等待元素的可见。补充一下，我已经尝试增加延迟时间，但我还是会偶尔出现这个错误。 我的密码在这里
-
我正在使用Grails 2.0.1中的springsecurity插件。我的角色层次结构和其他s2属性如下所示。