新的博客新技术ReactNative

上代码了
/**

• Sample React Native App
• https://github.com/facebook/react-native
  */
  'use strict';
  import React, {
  AppRegistry,
  Component,
  StyleSheet,
  Text,
  View,
  TouchableOpacity,
  } from 'react-native';
  class AwesomeProject extends Component {
  //构造
  constructor(props)
  {
  super(props);
  // 初始状态
  this.state = {states:1};

  }
  customPressHandler = () =>
  {
  //自定义方法,使用属性来定义
  alert('你按下了按钮,当前的状态是'+this.state.states);

  };
  render() {

  return (

  Welcome to React Native 郝建明!

  </Text>
  
  <Text style={styles.instructions}>
    To get started, edit index.ios.js
  </Text>
  <Text style={styles.instructions}>
    Press Cmd+R to reload,{'\n'}
    Cmd+D or shake for dev menu
  </Text>
  
  <TouchableOpacity style={styles.button}
  onPress = {this.customPressHandler}
  >
  <Text style={styles.buttonText}>确定</Text>
  </TouchableOpacity>
  

  );
  }
  }

const styles = StyleSheet.create({
button:
{
// 按钮的高度
height:40,
//按钮的宽度
width:100,
//按钮的圆角
borderRadius:20,
//按钮的背景颜色
backgroundColor:'green',
justifyContent:'center',
overflow:'hidden'

},

buttonText:{

textAlign:'center',
color:'white'

},
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCF0'
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5
},
});

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