React Native - 使用Vibration API实现设备振动

有时程序中需要实现这样的功能,当有重要的消息提醒时,我们会发出声音告知用户。而如果用户关闭了声音,那么就可以改用振动来提醒用户。

使用 React Native 提供的 Vibration API,我们可以很方便地让移动设备发生振动效果

点击界面上的“点击震动”按钮,设备会出现1秒钟的震动效果。

(注意:需要使用真机调试,模拟器没有效果)

样例代码

import React from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    Vibration
} from 'react-native';
 
 
//默认应用的容器组件
export default class ShakeMode extends React.Component {

    static navigationOptions = ({ navigation }) => {
        const { navigate } = navigation;
        return {
            title: '震动手机'
        };
    };

   //渲染
    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.item} onPress={this.vibration.bind(this)}>点击震动</Text>
            </View>
        );
    }
 
    //点击震动
    vibration() {
        Vibration.vibrate();
    }
}
 
//样式定义
const styles = StyleSheet.create({
    container:{
        flex: 1,
        marginTop:25
    },
    item:{
        margin:15,
        height:30,
        borderWidth:1,
        padding:6,
        borderColor:'#ddd',
        textAlign:'center'
    },
});