关于底部浮动定位position:'absolute'使用结合ScrollView and TextInput

在android下，苹果没有测试。底部浮动，输入选择浮动，键盘往上推送

/**

* Create by lutn on 2018-08-27

*

*/

import React,{Component} from 'react';

import {View, TextInput, Text,StyleSheet,ScrollView,StatusBar,Dimensions} from 'react-native';
let height = Dimensions.get('window').height;//手机屏幕高度
let width = Dimensions.get('window').width; //手机屏幕宽度
export default class StarRating extends Component {

    constructor(props) {
        super(props);
        this.state = {
            text:'',
        }
    }
    render(){
        return(
            <View style={{flex:1,height:height,backgroundColor:'#fff'}}>
                <View style={[{height:StatusBar.currentHeight,backgroundColor:'#fff'}]}></View>{/**android头部空出来*/}
                <ScrollView style={{height:height-StatusBar}} showsVerticalScrollIndicator={false} >
                    <View style={{paddingHorizontal:14,
                            borderColor:'#f5f5f5',borderBottomWidth:1,flexDirection:'row',alignItems:'center'}}>
                        <Text style={{color:'#333'}}>关键字：</Text>
                            <TextInput
                            style={[{marginLeft:20,width:550,color:'#999',fontSize:14}]}
                            underlineColorAndroid='transparent'
                            placeholder ='请输入'
                            placeholderTextColor = '#666'
                            selectionColor='rgba(0,255,255,0.5)'
                            autoFocus={false}
                            editable={true}
                            returnKeyType = 'go'
                            clearButtonMode='while-editing'
                            value = {this.state.text}
                            onChangeText={(text) => {
                            this.setState({
                                text:text
                                })
                            }}
                        />

                    </View>
                <Text>我的宝！</Text>
            </ScrollView>

            <View style={{position:'absolute',bottom:0,backgroundColor:'#f0f',
                width:width,height:50,borderTopColor:'#E5E5E5',borderTopWidth:1,
                flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
                <View><Text style={{color:'#fff'}}>底部</Text></View>
            </View>
        </View>)
        }
    }

const styles = StyleSheet.create({

});