FlexBox布局(RN官网所得)

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了FlexBox布局(RN官网所得)相关的知识,希望对你有一定的参考价值。

参考技术A 决定布局的主轴,默认(row)竖直轴。

在组件的style中指定justifyContent可以决定其子元素沿着主轴的排列方式。子元素是应该靠近主轴的起始端还是末尾段分布呢?亦或应该均匀分布?对应的这些可选项有:flex-start、center、flex-end、space-around以及space-between。

在组件的style中指定alignItems可以决定其子元素沿着次轴(与主轴垂直的轴,比如若主轴方向为row,则次轴方向为column)的排列方式。子元素是应该靠近次轴的起始端还是末尾段分布呢?亦或应该均匀分布?对应的这些可选项有:flex-start、center、flex-end以及stretch。

以上是关于FlexBox布局(RN官网所得)的主要内容,如果未能解决你的问题,请参考以下文章

FlexBox布局在RN中的基本用法

flexbox布局

React-Native之flexbox布局篇

React-Native之flexbox布局篇

React Native FlexBox布局

Grid for layout, Flexbox for components Grid 用于布局,Flexbox 用于组件