复习reactnative....

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

export default class Test extends Component{

    render(){
        return(
            // <View style={styles.container}>
            //     HelloWorld
            //     <Text>hello,Jim!</Text>

            //     Props（属性）
            //     <Image source={require('../image/baidu.png')} style={{width: 600, height: 200}} />

            //     <Greeting name='Leslie' />
            //     <Greeting name='Harold-hua' />

            //     <Blink text='cs' />

            //     样式
            //     <Text style={styles.red}>red</Text>

            //     宽高
            //     <View style={{width:50,height:50,backgroundColor:'skyblue'}} />

            //     <View style={{flex:1}}>
            //          <View style={{flex:1,backgroundColor:'skyblue'}} />
            //          <View style={{flex:1,backgroundColor:'blue'}} />
            //          <View style={{flex:3,backgroundColor:'red'}} />
            //          <View style={{flex:2,backgroundColor:'#000'}} />
            //          <View style={{flex:1,backgroundColor:'skyblue'}} />
            //     </View>

            //     使用Flexbox布局
            //     <View style={{flex:1, flexDirection:'column', justifyContent:'space-between'}}>
            //          <View style={{width:50, height:50, backgroundColor:'red'}}></View>
            //          <View style={{width:50, height:50, backgroundColor:'blue'}}></View>
            //     </View>

            //     <View style={{flex:1, flexDirection:'column', justifyContent:'space-between',alignItems:'center'}}>
            //          <View style={{width:50, height:50, backgroundColor:'red'}}></View>
            //          <View style={{width:50, height:50, backgroundColor:'blue'}}></View>
            //     </View>

            //     <View style={{flex:1, flexDirection:'column', justifyContent:'space-between',alignItems:'center'}}>
            //          <View style={{width:50, height:50, backgroundColor:'red'}}></View>
            //          <View style={{width:50, height:50, backgroundColor:'blue'}}></View>
            //     </View>
            //     <PizzaTranslator />

            //     使用滚动视图
            //     <IScrolledDownAndWhatHappenedNextShockedMe />

            //     使用长列表1
            //     <FlatListBasics />
            //     使用长列表2
            //     <SectionListBasics />

            // </View>

            <View style={styles.container}>

            </View>
        );
    }
}

//State（状态）
// class Greeting extends Component{
//     render(){
//         return(
//             <Text>Hello,{this.props.name}!</Text>
//         );
//     }
// }

// class Blink extends Component{
//     constructor(shuxing){
//         super(shuxing);
//         this.state = {
//             showText: true
//         };
//         setInterval(
//             () => {
//                 this.setState(funName => {
//                     return{
//                         showText: !funName.showText
//                     };
//                 });
//             }, 1000
//         );
//     }
//     render(){
//         let display = this.state.showText ? this.props.text:' ';
//         return(
//             <Text>{display}</Text>
//         );
//     }
    // constructor(props){
    //     super(props);
    //     this.state = {
    //         showText: true
    //     };
    //     setInterval(() =>{
    //         this.setState(previousStatess => {
    //             return {
    //                 showText: !previousState.showText
    //             };
    //         });
    //     }, 1000);
    // }
    // render(){
    //     let display = this.state.showText ? this.props.text:' ';
    //     return(
    //         <Text>{display}</Text>
    //     );
    // }
// }

//处理文本输入
// class PizzaTranslator extends Component{
//     constructor(props){
//         super(props);
//         this.state={
//             text:''
//         };
//     }
//     render(){
//         return(
//             <View style={{padding: 10}}>
//                 <TextInput
//                     style={{height:40}}
//                     placeholder="提示"
//                     onChangeText={(text)=>this.setState({text})}
//                 />
//                 <Text style={{padding:10, fontSize:42}}>
//                     {this.state.text.split(' ').map((word)=>word&& '