CrosswordPuzzle
游戏的背景是一层渐变色，如果使用图片来实现要P图，而且图片是要占的空间的，对APP来说静态资源越少越好，可以有效减少APP的体积。这里可以使用React Native官方提供的react-native-linear-gradient插件来实现背景渐变色。
安装步骤
在工程的根目录下安装插件
npm install react-native-linear-gradient --save
安装完成后将插件链接到工程中
react-native link
然后就能在代码里使用这个插件了
使用插件
在上一篇文章里的页面代码做点修改，将最外层的View改为使用LinearGradient，其余代码不用修改
import LinearGradient from 'react-native-linear-gradient';
<LinearGradient style={styles.container} colors={['#006e7c', '#57c7d1', '#8fd9d2', '#eebfa1']}>
<View style={styles.board}>
{ grids }
</View>
<View style={[styles.note]}>
{
selectedGrid && <Note
horizontalNote={selectedGrid.horizontalNote}
verticalNote={selectedGrid.verticalNote}
horizonActive={selectState.horizontal}
/>
}
</View>
<BottomLayout
style={styles.bottomLayout}
handleInput={this._handleInput}
onHintClick={this._onHintClick}
/>
</LinearGradient>
这样仅用了三行代码就实现了一个渐变色背景，够简单的吧
填坑记
执行react-native link后，在模拟器里刷新界面是会出错的，这时需要在命令行里执行react-native run-android来重新编译程序，把新加入的包也编译进来才能继续运行。
如果重新编译后还是出现红屏错误，就试下把node_modules文件夹删掉，执行npm install来安装所有包，然后在执行react-native run-andorid重新运行
