react-nativere触摸组件TouchableNativeFeedback

学习交流：https://gitee.com/potato512/Learn_ReactNative

react-native学习交流QQ群：806870562

效果图

示例代码

import React,{ Component } from 'react';
import {
    StyleSheet,View,Text,Alert,TouchableNativeFeedback
} from 'react-native';
import TouchableHighlightPage from "./TouchableHighlightPage";

type Props = {};
export default class TouchableNativeFeedbackPage extends Component<Props> {
    render() {
        return(
            <View style={styles.viewContainer}>
                <Text style={styles.textStyle}>
                    TouchableNativeFeedbackPage组件用于封装视图，使其可以正确响应触摸操作（仅限Android平台）。在Android设备上，这个组件利用原生状态来渲染触摸的反馈。
                </Text>
                <TouchableNativeFeedback onPress={() => {
                    Alert.alert("确定按钮")
                }}>
                    <Text style={styles.touchStyle}>确定</Text>
                </TouchableNativeFeedback>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    viewContainer:{
        margin:20,backgroundColor:"#FFF8DC",},textStyle:{
        margin:10,backgroundColor:"#FFF5EE",color:"#FF6347",touchStyle:{
        margin:10,backgroundColor:"#6495ED",width:60,height:30,textAlign:"center",lineHeight:30,}
});

注意事项：

1、只能用于Android平台，iOS平台无效；

2、对组件TouchableNativeFeedback设置不了样式，只能对包含其中的其他组件设置样式。