AndroidStdio LinearLayout 线性布局写一个登录界面

AndroidStdio LinearLayout 线性布局写一个登录界面

先看效果图：

这个登录界面采用垂直方向的线性布局，主体分为三个部分：上面的图片区，中间的表单区，下面的链接区。图片区包含一个ImageView；表单区包含用户名文本框，用户名输入框，密码文本框，密码输入框以及登录按钮；链接区包含忘记密码和注册新用户。完整代码会贴在下面，接下来先简单说一下LinearLayout线性布局。

概览

LinearLayout 线性布局有两种，分别是水平线性布局和垂直线性布局，LinearLayout属性中android:orientation为设置线性布局当其="vertical"时，为 垂直线性布局，当其="horizontal"时，为水平线性布局，不管是水平还是垂直线性布局一行（列）只能放置一个控件。

layout_gravity和gravity

android:gravity用于设置子组件的对齐方式

left 左
right 右
center 中间
bottom 底部
center_vertical 竖直居中
center_horizontal 水平居中
center_horizontal | right 可以组合搭配

layout_gravity用于设置子组件相对于LinearLayout的位置

可取值与gravity类似，不过如果方向设为horizontal(水平),只有top,bottom,center_vertical和center有效；如果方向设为vertical，只有left,right,center_horizontal和center有效

layout_weight权重

它的作用是让子组件按一定比例来占有父布局剩余的空间

计算方法为：本组件的高度=本组件原有高度+父布局剩余空间所占比例高度

layout_margin和padding

layout_margin：子组件和父组件之间的距离，单位通常常用dp

layout_marginTop
layout_marginBottom
layout_marginLeft
layout_marginRight

padding:用在父组件上，设置父组件和子组件之间的留白

paddingTop
paddingBottm
paddingLeft
paddingRight

登录界面代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".LoginActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="292dp"
        android:background="@color/colorLogin"
        android:orientation="vertical"
       >

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="match_parent"
            android:layout_height="283dp"
            app:srcCompat="@drawable/login" />
    </LinearLayout>

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

        <TextView
            android:id="@+id/textView"
            android:layout_width="match_parent"
            android:layout_height="35dp"
            android:text="用户名" />

        <EditText
            android:id="@+id/name"
            android:layout_width="match_parent"
            android:layout_height="55dp"
            android:ems="10"
            android:inputType="textPersonName"
            android:text="" />

        <TextView
            android:id="@+id/textView2"
            android:layout_width="match_parent"
            android:layout_height="35dp"
            android:text="密码" />

        <EditText
            android:id="@+id/password"
            android:layout_width="match_parent"
            android:layout_height="55dp"
            android:ems="10"
            android:inputType="textPassword" />

        <Button
            android:id="@+id/login"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorLogin"
            android:layout_marginTop="20dp"
            android:text="登录" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="30dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="140dp"
            android:textColor="@color/colorPrimary"
            android:text="忘记密码" />

        <TextView
            android:id="@+id/textView8"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"

            android:text="" />

        <TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="140dp"
            android:text="注册新用户"
            android:textColor="@color/colorPrimary" />
    </LinearLayout>


</LinearLayout>
t_marginRight="140dp"
            android:text="注册新用户"
            android:textColor="@color/colorPrimary" />
    </LinearLayout>


</LinearLayout>