React Native各个控件笔记

输入框

 import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  TextInput
} from 'react-native';

export default class test2 extends Component {
  render() {
    return (
            
            
            
            
            );
  }
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
inputStyle: {
width:300,
height:80,
marginTop:30,
  //backgroundColor:'black',
borderWidth:1,
borderColor:'#e8e8e8'
},
  
});

AppRegistry.registerComponent('test2', () => test2);

TouchableOpacity
添加触摸，点击事件

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  AlertIOS,
  TouchableOpacity
} from 'react-native';

var test3 = React.createClass({
  getInitialState(){
    return{
    title:'不透明触摸'
    }
  },
  
  render() {
    return (
            
            this.activeEvent('点击')}
            onPressIn={()=>this.activeEvent('按下')}
            onPressOut={()=>this.activeEvent('抬起')}
            onLongPress={()=>this.activeEvent('长按')}
            >
            
             常用事件
            
            
            
            
            
            {this.state.title}
            
            
            
            
            
            
            );
  },
  
  activeEvent(event){
    this.setState({
    title:event
    })
  },  
  
});