如何使用React Native检测屏幕解锁?

时间:2017-07-14 18:37:13

标签: react-native

当用户打开手机时,有谁知道我可以检测到的方式?据我所知,android.intent.USER_PRESENT是在设备解锁时播放的(例如输入了正确的密码),但是,我不知道如何使用React native来检测广播。有没有人有解决方案?

1 个答案:

答案 0 :(得分:5)

查看AppState API in FB(Face Book)

FB上有3个状态,共有5个状态。我只在FB中看到3但其他2可能会或可能不会被支持。

Active - 应用程序正在前台运行

background - 该应用在后台运行。用户在另一个应用程序或主屏幕上。

inactive - 这是在前景和前景之间转换时发生的状态。背景,以及在不活动期间,例如进入多任务处理视图或来电时

查看苹果Docs了解更多相关信息。

当手机进入锁屏时,你将不得不测试什么状态。我不能告诉你什么状态使用,因为我从来没有测试过api。

从下面的代码中可以看出,测试是在条件语句中完成的

 if (this.state.appState.match(/inactive|background/) && nextAppState === 'active') 

我在这里以facebook为例,但在change附加componentDidMount事件列表器并在ComponentWillUnmount中删除,代码将运行到该状态。

import React, {Component} from 'react'
import {AppState, Text} from 'react-native'

class AppStateExample extends Component {

  state = {
    appState: AppState.currentState
  }

  componentDidMount() {
    AppState.addEventListener('change', this._handleAppStateChange);
  }

  componentWillUnmount() {
    AppState.removeEventListener('change', this._handleAppStateChange);
  }

  _handleAppStateChange = (nextAppState) => {
    if (this.state.appState.match(/inactive|background/) && nextAppState === 'active') {
      console.log('App has come to the foreground!')
    }
    this.setState({appState: nextAppState});
  }

  render() {
    return (
      <Text>Current state is: {this.state.appState}</Text>
    );
  }

}