Android布局

Android布局

一.LinearLayout布局（线性布局）

有两种排列方法：

1.从左到右

android:orientation=”horizontal”

代码如下：

<?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="horizontal"
    tools:context="com.example.lenovo.androidapplication.MainActivity">

   <TextView
       android:layout_width="200dp"
       android:layout_height="50dp"
       android:text="Hello！"
       android:textSize="25dp"
       android:textColor="#ed450f"
       android:gravity="center"
       android:id="@+id/main_name_tv"/>
    <TextView
        android:layout_width="200dp"
        android:layout_height="50dp"
        android:text="你好！"
        android:textSize="25dp"
        android:textColor="#ed450f"
        android:gravity="center"
        android:id="@+id/main_pwd_tv"/>

</LinearLayout>

效果如图

2.从上到下

android:orientation=”vertical”

代码如下：

<?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="com.example.lenovo.androidapplication.MainActivity">

   <TextView
       android:layout_width="match_parent"
       android:layout_height="50dp"
       android:text="Hello！"
       android:textSize="25dp"
       android:textColor="#ed450f"
       android:gravity="center"
       android:id="@+id/main_name_tv"/>
    <TextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:text="你好！"
        android:textSize="25dp"
        android:textColor="#ed450f"
        android:gravity="center"
        android:id="@+id/main_pwd_tv"/>

</LinearLayout>

效果如图

二.RelativeLayout布局（相对布局）

有三种类型的属性：

1.属性值是true或false，例如：

android:layout_centerHrizontal 水平居中

android:layout_centerVertical 垂直居中

android:layout_centerInparent 相对于父元素完全居中。

android:layout_alignParentBottom 位于父元素的下边缘

android:layout_alignParentTop 位于父元素的上边缘

android:layout_alignParentLeft 位于父元素的左边缘

android:layout_alignParentRight 位于父元素的右边缘

代码如下

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"

    tools:context="com.example.lenovo.androidapplication.MainActivity">

   <TextView
       android:layout_width="match_parent"
       android:layout_height="50dp"
       android:text="Hello！"
       android:textSize="25dp"
       android:textColor="#ed450f"
       android:gravity="center"
       android:layout_centerVertical="true"
       android:id="@+id/main_name_tv"/>


</RelativeLayout>

效果如图

2.属性值是“@id/*”，例如：

android:layout_below 在某元素的下方

android:layout_above 在某元素的上方

andorid:layout_toRightOf 在某元素的右方

android:layout_toLeftOf 在某元素的左方

android:layout_alignBottom 和某元素下方对齐

android:layout_alignTop 和某元素上方对齐

android:layout_alignRight 和某元素右方对齐

android:layout_alignLeft 和某元素左方对齐

代码如下

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    tools:context="com.example.lenovo.androidapplication.MainActivity">

   <TextView
       android:layout_width="match_parent"
       android:layout_height="50dp"
       android:text="Hello！"
       android:textSize="25dp"
       android:textColor="#ed450f"
       android:gravity="center"
       android:id="@+id/main_name_tv"/>
    <TextView
        android:layout_below="@id/main_name_tv"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:text="你好！"
        android:textSize="25dp"
        android:textColor="#ed450f"
        android:gravity="center"
        android:id="@+id/main_pwd_tv"/>

</RelativeLayout>

效果如图

3.属性值是数值 例如：

android:layout_marginLeft 离某元素左边缘的距离

android:layout_marginRight 离某元素右边缘的距离

android:layout_marginTop 离某元素上边缘的距离

android:layout_marginBottom 离某元素下边缘的距离

代码如下

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    tools:context="com.example.lenovo.androidapplication.MainActivity">

   <TextView
       android:layout_width="100dp"
       android:layout_height="50dp"
       android:text="Hello！"
       android:textSize="25dp"
       android:textColor="#ed450f"
       android:gravity="center"
       android:id="@+id/main_name_tv"/>
    <TextView
        android:layout_marginLeft="200dp"
        android:layout_width="100dp"
        android:layout_height="50dp"
        android:text="你好！"
        android:textSize="25dp"
        android:textColor="#ed450f"
        android:gravity="center"
        android:id="@+id/main_pwd_tv"/>

</RelativeLayout>

效果如图

三.MyLayout布局(自定义ViewGroup)

自定义布局主要是重写两个方法：

1.onMeasure() 这个是写自定义容器的大小.

2.nLayout() 这个是写子元素的布局。

四.FrameLayout布局(帧布局）

这个布局的特点是从左上角开始，后面的会覆盖前面的控件。

五.TableLayout布局(表格布局)

它遵循着以下结构：

<TableLayout>
    <TableRow>
    <!-在这里填充第一行的元素->
    </TableRow>
    <TableRow>
    <!-在这里填充第二行的元素->
    </TableRow>    
</TableLayout>

还有两个重要属性：

1.写在TableLayout中的属性

android:stretchColumns 设置第几列为伸展(0表示第一列)

android:shrinkColumns 设置第几列为收缩

android:collapseColumns 设置第几列为隐藏

2.写在TableRow里的控件里的属性

android:layout_column 设置控件在第几列

android:layout_span 设置控件能跨多少列

六.AbsoluteLayout布局(绝对布局）

定义两个控件左上角坐标轴 ，即android:layout_x 和android:layout_y来控制位置。