我想要一个视图，该视图的宽度响应于其容器宽度，同时保持其宽高比。我不想硬编码宽度或高度，但要保持其动态和响应性，以便可以在多种情况下将其作为可重用的组件进行重用。
我希望它的工作原理类似于以下代码：
<View style={{
alignSelf: 'stretch',
aspectRatio: 1.5
}} />
它应该填充容器的宽度，并根据其宽度动态设置其自身的高度。
在flexbox的react-native中这可能吗？
正如Hendy Irawan所评论的那样，React Native将aspectRatio属性添加到StyleSheet。
https://facebook.github.io/react-native/docs/layout-props.html#aspectratio
从文档中：
AspectRatio ?:数字
长宽比控制节点的未定义尺寸的大小。宽高比是非标准属性，仅在本地本机而不是CSS中可用。
在设置了宽/高长宽比的节点上控制未设置尺寸的大小在设置了伸缩基础长宽比的节点上（如果未设置）控制横轴上节点的大小在具有测量功能长宽比的节点上有效就像测量功能测量弹性基础一样，如果未设置纵横比，则考虑最小/最大尺寸时，具有弹性伸缩/长宽比的节点将控制横轴上节点的大小
因此，以下应工作：
const styles = StyleSheet.create({
view: {
aspectRatio: 1.5,
}
});
// later in render()
<View style={styles.view} />
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句