用React Native做一个填字游戏（3）——背景音乐

游戏都需要有点背景音乐，在RN里播放音乐，可以使用第三方插件react-native-sound，使用的方法也简单。

npm install react-native-sound --save
react-native link react-native-sound

将音乐文件加入到项目中，Android的要将文件放入android/app/src/main/res/raw/内；iOS的用Xcode打开项目的ios文件夹，在根目录下点右键->Add Files to ["xxx"]，选择要加入的文件。
加好音乐文件后就能在代码里使用插件来播放音乐了，代码片段如下，完整代码见Board.js

import Sound from 'react-native-sound';

const music = new Sound('background.mp3', Sound.MAIN_BUNDLE, (error) => {
  // 加载成功回调
  if (error) {
    console.log('failed to load the sound', error);
    return;
  }
  music.setVolume(0.8); // 设置音量
  music.setNumberOfLoops(-1); // 无限循环

  music.play((success) => { // 播放完成后回调
    if (success) {
      console.log('successfully finished playing');
    } else {
      console.log('playback failed due to audio decoding errors.' + success);
    }
  });
  this.setState({ backgroundMusic: music, loadingMusic: false });
}

另外不要忘记在程序退出时释放资源

  componentWillUnmount() {
    const { backgroundMusic } = this.state;
    backgroundMusic.stop();
    backgroundMusic.release();
  }

这里还有一个问题，这背景音乐即使在用户已经切换到其它程序或按Home键后仍然在播放，这显然是不对的。在下一篇在讲如何监听App的状态。