我在 ios 的设备上运行了创建的这个项目 ... 屏幕上显示的文字是 index.ios.js 文件里定义的一个 React 组件 .. 先用编辑器打开这个文件 .. 它里面就是一些 JavaScript 代码，混合了 ES5 还有 ES6 的标准 ..

最开始导入了 react-native .. 给它个名字是 React .. 下面又用了 ES6 里的解构的方法，导出了来自 React 的一些东西 … 这样你就可以在这个文件里使用这些东西提供了功能了 ..

下面这个 MovieTalk 是一个 React 组件，用的是 ES5 的方法创建的这个组件 .. 我们也可以使用 ES6 的标准去改造一下它 .. 组件里返回的东西里面，用了一些组件，这些就是在上面导入的那些东西 ...

比如这里用了一个 View 组件，或者叫 View 标签 .. 它相当于是一个容器 .. 上面用了一个 style 属性 .. 它可以给这个容器添加点样式 .. 具体的样式用的是 styles.container .. 这个样式是在下面创建的 ..

用的是 StyleSheet 的 create 这个方法 ..

样式里面用了一些样式属性 .. 这个样式里，大大部分属性都是 Flexbox .. 关于 Flexbox 你可以参考宁皓网的 Flexbox 相关的课程。

比如这个 alignItems 可以控制项目位置 .. 现在是 center ，也就是居中，我们可以把它改成 flex-start .. 靠左边显示 .. 保存一下文件 .. 模拟器会自动刷新，显示修改之后的结果 .. 你也可以使用快捷键 command + R 去手工的刷新一下 ...

回到编辑器 .. 恢复成原来的 center .. 我们可以再修改一下这个容器的背景颜色 .. 改成 #eae7ff .. 然后再改一下 instructions 里面的 color 的颜色 … 这个 instructions 是在上面的 Text 标签上使用的样式 … 把这个 color 属性的值 #6435c9 …

然后再给 welcome 这个样式添加一个 color 属性 .. 它的值跟 instructions 里面的 color 的值是一样 ..

保存 … 你会看到修改之后的结果 .. 在这个界面上显示的文字就是在 MovieTalk 这个组件里面要返回的一些东西 ..

这些文字的周围都有一个 Text … 上面也用到了 style 属性，为文字添加了一些样式 .. 修改一下这个标题 … ninghao.net ..

保存 ... 屏幕上会显示修改之后的结果 …