事件

2017-11-19  本文已影响9人  基本密码宋
/**
 * 事件
 */

import React, { Component } from 'react';
import {
    Platform,
    StyleSheet,
    Text,
    View,
    Image,
    TextInput,
    TouchableOpacity,

} from 'react-native';

var Dimensions =require('Dimensions');
var {width, height}=Dimensions.get('window');





export default class TouchComment extends Component<{}> {

    constructor(props) {
        super(props)
        this.state={
            //给初始的state
            title:'初始值'
        }
    }
    
    onEventMethod(event){
        this.setState({
            title:event
        })
    }

    render() {
        return (
            <View style={styles.container}>
                {/*TouchableOpacity 是点击后的一个透明度的设置
                  可以在里面设置各种的方法属性。
                  onPress
                  onPressIn
                  onPressOut
                  onLongPress
                  */}
                <TouchableOpacity activeOpacity={0.4}
                  onPress={()=>this.onEventMethod('点击')}
                  onPressIn={()=>this.onEventMethod('按下了')}
                  onPressOut={()=>this.onEventMethod('抬起')}
                  onLongPress={()=>this.onEventMethod('长按了')}
                >
                    <Text style={{backgroundColor: 'red', padding: 20}}>点击事件</Text>
                </TouchableOpacity>
                <Text>
                    {this.state.title}
                </Text>
            </View>
        );
    }

}



const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#dddddd',
        alignItems:'center',
        justifyContent:'center',
        paddingTop:10
    },

});

上一篇 下一篇

猜你喜欢

热点阅读