用已学布局和控件画一个登陆界面

学了一个星期的基本控件和简单布局了，今天自己动手画一个简单的登录界面。

在画的过程中发现了自己很多用法理解错误，在完成界面过程中将已学的控件和布局几乎都用了，让自己对控件和布局有了更进一步的理解。

1.首先用个线性布局，再在里面嵌套。

2.下图用到线性布局的水平布局，然后用到一个ImageView，一个TextView



XML：

 <LinearLayout

        android:layout_width="wrap_content"

        android:layout_height="45dp"

        android:background="@drawable/head"

        android:orientation="horizontal" >

        <ImageView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_gravity="center_vertical"

            android:layout_marginLeft="10dp"

            android:src="@drawable/back" >

        </ImageView>

        <TextView

            android:layout_width="0dp"

            android:layout_height="wrap_content"

            android:layout_gravity="center_vertical"

            android:layout_weight="1"

            android:gravity="center_horizontal"

            android:text="@string/dl"

            android:textColor="#FFFFFF"

            android:textSize="18sp" />

    </LinearLayout>

注意：各种水平布局、垂直布局还需注意。

3.图片

这个只需一个ImageView，再设置方向和间距就行了。

XML：

<ImageView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_gravity="center"

        android:layout_marginTop="20dp"

        android:layout_marginBottom="20dp"

        android:src="@drawable/login_head" >

    </ImageView>

4.两个线性布局，TextView、ImageView、View

XML：

<LinearLayout

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:orientation="horizontal" 

        android:layout_marginLeft="10dp"

        android:background="#FFFFFF">

        <ImageView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_gravity="center_vertical"

            android:src="@drawable/login_account" >

        </ImageView>

        <EditText

            android:layout_width="309dp"

            android:layout_height="45dp"

            android:background="@null"

            android:ems="10" 

            android:hint="请输入手机号/身份证">

        </EditText>

    </LinearLayout>

    <View 

        android:layout_width="fill_parent"

        android:layout_marginLeft="10dp"

        android:layout_marginRight="10dp"

        android:layout_height="1dp"

         android:background="#DCDCDC"   

        />

    <LinearLayout

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:orientation="horizontal" 

        android:layout_marginLeft="10dp"

        android:background="#FFFFFF">

        <ImageView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_gravity="center_vertical"

            android:src="@drawable/login_account" >

        </ImageView>

        <EditText

            android:layout_width="309dp"

            android:layout_height="45dp"

            android:background="@null"

            android:ems="10"

            android:hint="请输入登录密码" >

        </EditText>

    </LinearLayout>

5.线性布局，水平布局

XML：

<LinearLayout 

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:layout_marginLeft="10dp"

        android:layout_marginRight="10dp"

        android:layout_marginTop="20dp"

        android:layout_marginBottom="10dp"

        android:orientation="horizontal" 

        >

     <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="记住用户名"

            android:textColor="#000000"

            android:textSize="15sp" />   

     <TextView

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:gravity="right"

            android:text="忘记密码？"

            android:textColor="#48D1CC"

            android:textSize="15sp" />

        

    </LinearLayout>

6. 2个Button按钮

XML：

<Button

        android:layout_width="fill_parent"

        android:layout_marginTop="15dp"

        android:layout_marginBottom="15dp"

        android:layout_marginLeft="10dp"

        android:layout_marginRight="10dp"

        android:layout_height="45dp"

        android:text="登录"

        android:background="#00BFFF"

        ></Button>

    <Button

        android:layout_width="fill_parent"

        android:layout_marginLeft="10dp"

        android:layout_marginRight="10dp"

        android:layout_height="45dp"

        android:text="注册"

        android:background="#FFFFFF"

        ></Button>

最终完成界面：