react-native仿qq登录界面布局

使用react-native中的TextInput、Text、Image三个组件，编写的一个简单的仿照qq登录的界面。
截图如下：

还挺像的哈，代码都写在了index.android.js这个文件中，图片保存在项目下img文件夹中。

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

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

export default class QQlogin extends Component {
    render() {
        return (
            
                
                
                
                
                
                    登录
                
                
                    
                        忘记密码？
                    
                    
                        新用户注册
                    
                
            
        );
    }
}

const styles = StyleSheet.create({
        container: {
            flex: 1,
            backgroundColor: '#F4F4F4',
        },
        name: {
            backgroundColor: '#FFF',
            height: 50,
            marginTop: 10,
            fontSize: 15,
        },
        password: {
            backgroundColor: '#FFF',
            height: 50,
            fontSize: 15,
        },
        login: {
            height: 40,
            marginLeft: 10,
            marginRight: 10,
            backgroundColor: '#1E90FF',
            marginTop: 15,
            alignItems: 'center',
            justifyContent: 'center',
            borderRadius: 5,
        },
    })
    ;

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