import { Button } from 'react-native-elements';
import Icon from 'react-native-vector-icons/FontAwesome';
import React, { PureComponent } from 'react'
import {
    Platform,
    StyleSheet,
    Text,
    View,
    Alert,
    Image,
    TouchableOpacity,
    TouchableWithoutFeedback,
    TouchableNativeFeedback,
    TouchableHighlight,
    Switch,
    Pressable,
    ImageBackground,
    ScrollView
} from 'react-native';
export default class extends React.PureComponent {
    //默认的props
    static defaultProps = {
        param: null
    }
    state = {
        param: null
    }
    constructor(props) {
        super(props);
        //也可以这样设置默认state的
        //this.state={
        //stateParam:"",
        //}
        
    }

    render() {
        return (
            <ScrollView >
                <View style={[styles.container,{padding:20,height:400,justifyContent:"space-evenly",flexDirection:"column"}]}>
                <Button
                    title="Solid Button"
                    onPress={()=>{console.log(33333)}}
                />
                <Button
                    title="Outline button"
                    type="outline"
                />
                 <Button
                    title="Clear button"
                    type="clear"
                />
                 <Button
                    icon={
                        <Icon
                            name="arrow-right"
                            size={15}
                            color="white"
                        />
                    }
                    title="Button with 
                    icon component"
                />
                <Button
                    title="Loading button"
                    loading
                />
                  <Button
                    icon={{
                        name: "arrow-right",
                        size: 15,
                        color: "white"
                    }}
                    title="Button with icon object"
                />

                <Button
                    icon={
                        <Icon
                            name="arrow-right"
                            size={15}
                            color="white"
                        />
                    }
                    raised
                    iconRight
                    title="Button with right icon"
                />
               
                </View>
            </ScrollView>
        )
    }
}


const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
      backgroundColor: '#F5FCFF',
    }
});