输入框
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
TextInput
} from 'react-native';
export default class test2 extends Component {
render() {
return (
<View style={styles.container}>
<TextInput style={styles.inputStyle}
//value={'我是默认文字'}
keyboardType={'phone-pad'}
//多行显示
//multiline={true}
//密码 明文 多行的时候不适用
//password={true}
//占位文字
placeholder={'占位文字'}
clearButtonMode={'always'}
/>
</View>
);
}
}
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 (
<View style={styles.container} >
<TouchableOpacity
activeOpacity={0.5}
onPress={()=>this.activeEvent('点击')}
onPressIn={()=>this.activeEvent('按下')}
onPressOut={()=>this.activeEvent('抬起')}
onLongPress={()=>this.activeEvent('长按')}
>
<View style={styles.aaa}>
<Text> 常用事件</Text>
</View>
</TouchableOpacity>
<View>
<Text>{this.state.title}</Text>
</View>
</View>
);
},
activeEvent(event){
this.setState({
title:event
})
},
});