我是本机反应的新手。构建一个Hello World应用程序,以使自己对react-native有所了解。在屏幕上,我想要一个文本框,在其下方有一个按钮,在该按钮下有一个文本区域,它将占据屏幕的其余部分。我不确定该怎么做。
答案 0 :(得分:2)
您必须了解Flex Box才能根据需要设置布局。
使用弹性框的布局
组件可以使用flexbox指定其子级的布局 算法。 Flexbox旨在在以下位置提供一致的布局 不同的屏幕尺寸。
您通常会结合使用
flexDirection
,alignItems
, 和justifyContent
以获得正确的布局。弹性方向
将flexDirection添加到组件的样式确定主要 其布局的轴。孩子们应该横向组织吗 (行)或垂直(列)?默认值为列。
合理化内容
将justifyContent添加到组件的样式将确定 沿主轴分布的儿童。孩子应该 分布在开始,中心,末端还是均匀分布? 可用选项包括弹性开始,居中,弹性结束,空格, 间隔和空间均匀。
对齐项目
将alignItems添加到组件的样式可以确定的对齐方式 沿辅助轴的子级(如果主轴为行,则 第二个是列,反之亦然)。孩子应该对齐吗 在开始,居中,结束还是拉长来填充?可用的 选项包括弹性开始,居中,弹性结束和拉伸。
请检查此链接以了解flexbox: