React Native学習----12ボタンセットTouchable Highlight使用

1423 ワード

公式文書:https://reactnative.cn/docs/touchablehighlight/#docsNav
コードコピーでコードが使えます.Touchable Highlight Demo.js
import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, Alert, Button,TouchableHighlight} from 'react-native';

/**
 *  Flexbox   
 *  https://reactnative.cn/docs/touchablehighlight/#docsNav
 */
export default class TouchableHighlightDemo extends Component {
    //    
    render() {
        return (
            
                 this.myOnclick()} underlayColor="#FFCC00">
                      
                

            

        );
    }

    myOnclick = () => {
        alert('     ');
    }
}

const styles = StyleSheet.create({
    root: {
        height: 200,
        backgroundColor: '#FFFFCC',
        flexDirection: 'row',
        justifyContent: 'center',
        alignItems: 'center',
    },
    //        
    textStyle: {
        backgroundColor: '#3399FF',
        fontSize: 15,

        //       , css   
        width: 90,
        lineHeight: 40,
        textAlign: 'center',
        borderRadius: 5,

    }

});




ソースコードのダウンロード:bkdemo 1----Touchable Highlight Demo.jshttps://download.csdn.net/download/zhaihaohao1/11022393