登录界面

今天用线性布局和相对布局做了一个简单的手机登录界面，熟悉一下布局的属性，学会具体的使用。下面直接上代码：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_fourth"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.activitytest.FourthActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#00f"
        >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"

            android:src="@drawable/back"
            android:layout_marginRight="318dp"
            android:layout_marginEnd="318dp"
            android:layout_alignParentTop="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true" />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="小米登录界面"
            android:textColor="#FFF"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"

            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="注册"
            android:layout_alignParentRight="true"/>

    </RelativeLayout>
   <LinearLayout
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:orientation="vertical"
       android:layout_marginTop="60dp">

       <LinearLayout
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginLeft="20dp"
           android:layout_marginRight="20dp">
           <TextView
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:text="账号"/>
           <EditText
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:hint="请输入你的账号"/>
       </LinearLayout>

       <LinearLayout
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginLeft="20dp"
           android:layout_marginRight="20dp">
          <TextView
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text="密码"/>

           <EditText
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:password="true"
               android:hint="请输入你的密码"/>
       </LinearLayout>
   </LinearLayout>

   <Button
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:text="登录"
       android:layout_marginTop="70dp"
       android:layout_marginLeft="20dp"
       android:layout_marginRight="20dp"/>

</LinearLayout>

大家看一下效果图：

因为我刚开始学习，做的不算太好，目的是学习使用布局的属性。
下面我具体的分析一下：

首先我们这个界面分为三部分，第一部分是标题栏，第二部分是账号和密码，第三部分是登录按钮。下面我们逐一分析：

1. 标题栏

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#00f"
        >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"

            android:src="@drawable/back"
            android:layout_marginRight="318dp"
            android:layout_marginEnd="318dp"
            android:layout_alignParentTop="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true" />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="小米登录界面"
            android:textColor="#FFF"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"

            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="注册"
            android:layout_alignParentRight="true"/>

   <RelativeLayout

标题栏用的是相对布局，首先先建一个<RelativeLayout …<RelativeLayout 这个总的相对布局里面放三个模块，返回建，小米登录界面和注册按钮。返回键是一个图片， android:src="@drawable/back" 用这个代码来指定用哪张图片，然后用layout_margin属性来调节图片的位置。小米登录界面是一个文本框，用android:layout_centerHorizontal="true"来指定水平居中和
android:layout_centerVertical="true"指定垂直居中。注册按钮的就用 android:layout_alignParentRight="true”这个相对布局属性：在父体的右边。
2. 账号和密码

<LinearLayout
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:orientation="vertical"
       android:layout_marginTop="60dp">

       <LinearLayout
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginLeft="20dp"
           android:layout_marginRight="20dp">
           <TextView
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:text="账号"/>
           <EditText
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:hint="请输入你的账号"/>
       </LinearLayout>

       <LinearLayout
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginLeft="20dp"
           android:layout_marginRight="20dp">
          <TextView
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text="密码"/>

           <EditText
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:password="true"
               android:hint="请输入你的密码"/>
       </LinearLayout>
   </LinearLayout>

这个是用一个大的线性布局来包含两个小的线性布局，在两个小的的线性布局里面写具体的内容。
3. 登录按钮

<Button
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:text="登录"
       android:layout_marginTop="70dp"
       android:layout_marginLeft="20dp"
       android:layout_marginRight="20dp"/>

登录按钮的布局就是用具体的数值来布局。