React Native 实施了 CSS 里的 Flexbox 作为它的主要布局功能。下面先去添加点东西，然后再看一下怎么样去使用 Flexbox 布局。

去掉这个 View 里面的 Text … 然后在它里面再去嵌套一些东西 .. 一个 View 元素，里面包装一下 Text .. Text 里的内容就是一些数字 .. 添加三组这样的东西 ..

在这三个 View 的上面再去添加点样式 .. 按住 command ，选中这几个编辑点 ..

先添加一个 style 属性 .. 等于，一组大括号 … 我想在它们上面应用多个样式 .. 所以可以把它们放到一个数组里 … 先添加一个 styles.item .. 一会儿再去定义这个 item 的样式 .. 逗号分隔一下 .. 再添加一个 styles.itemOne .. 第二个 View 上面添加一个 itemTwo .. 第三个 View 上面用一个 itemThree ..

在这三个 View 里的 Text 的上面也添加一个样式 .. styles 等于 花括号 .. 样式是 styles.itemText …

下面再去定义几个样式 .. 去掉这个 title 样式 ... 然后再先去掉 container 里的多余的样式 .. 把 paddingTop 的值改成 .. 23 .. 暂时也用不到 title 里的样式 ...

去给每个项目的包装添加一个样式 … 名字是 item .. 它的值是一个对象 ... 注意后面要用逗号分隔一下 ... 然后给它添加一个背景颜色 backgroundColor … 设置成白色 .. 添加一个边框 … 边框的宽度，borderWidth ，是 1 .. 再设置一下边框的颜色 .. borderColor … '#6435c9’, 添加一个外边距 … 设置成 6 ..

backgroundColor: '#fff',
borderWidth: 1,
borderColor: '#6435c9',
margin: 6,

再添加一个 .. itemOne … itemTwo … 还有 itemThree .. 这些暂时先让它们是一个空白的样式 .. 然后再添加一个 itemText .. 用 fontSize 设置一下字号 .. 33 .. 修改一下字体 … fontFamily .. 设置成 Helvetica Neue .. 修改文字的重量 .. fontWeight .. 它的值设置成 200 .. 再设置一下文字的颜色 ，用一个 color 属性 .. 它的值设置成 color: '#6435c9’, 最后再添加一个 30 的内边距 …

fontSize: 33,
fontFamily: 'Helvetica Neue',
fontWeight: '200',
color: '#6435c9',
padding: 30,