SJIE

Another Programmer

© 2021. All rights reserved.

Android Activity布局(layout)介绍

03 Oct 2013

LinearLayout

LinearLayout——线性布局，顾名思义，LinearLayout中的组件按照线性排列，每一个组件都位于前一个组件的后面。LinearLayout又可以分为水平线性布局和垂直线性布局。

垂直线性布局

在垂直线性布局中，组件从上至下依次排列。可以使用android:layout_weight属性来控制组件占据空间的比例：当layout_width或layout_height设置为0dp的时候，数值越高占据的比例越大；当layout_width或layout_height设置为match_parent时，数值越高占据的比例越小。

alt none

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:text="TextView 1" />

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="TextView 2" />

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="TextView 3" />

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="TextView 4" />

水平线性布局

水平线性布局中的组件按照水平方向平铺排列,组件所占空间的比例跟layout_weight的值成正比。

alt none

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="TV 1" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:text="TV 2" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TV 3" />

&lt/LinearLayout>

RelativeLayout

RelativeLayout——相对布局。在相对布局中，组件的位置关系是相对的，我们可以用下面的几个属性来控制组件之间的相对关系：

属性名 相对位置
layout_toLeftOf 位于指定组件的左侧
layout_toRightOf 位于指定组件的右侧
layout_above 位于指定组件的上方
layout_below 位于指定组件的下方
layout_alignParentLeft 与父组件左对齐
layout_alignParentRight 与父组件右对齐
layout_alignParentTop 与父组件上对齐
layout_alignParentBottom 与父组件下对齐
layout_centerInParent 与父组件居中对齐
layout_centerHorizontal 垂直居中
layout_centerVertica 水平居中

alt none

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <Button
        android:id="@+id/tv1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#ff00ffff"
        android:gravity="center"
        android:text="1" />

    <Button
        android:id="@+id/tv2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_below="@+id/tv1"
        android:background="#ffffff00"
        android:gravity="center"
        android:text="2" />

    <Button
        android:id="@+id/tv3"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_below="@+id/tv2"
        android:background="#ffff00ff"
        android:gravity="center"
        android:text="3" />

    <Button
        android:id="@+id/tv4"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_below="@+id/tv2"
        android:layout_toRightOf="@+id/tv3"
        android:background="#ffff0000"
        android:gravity="center"
        android:text="4" />

</RelativeLayout>

FrameLayout

FrameLayout——帧布局。帧布局中的所有组件都放在布局的左上角，所有组件会层叠在一起。下面的例子展示的是一个相机应用，这个应用的布局中有一个按钮和一个文本框飘浮在一个SurfaceView之上，这样我们既可以做到全屏预览相机画面，又可以把拍照按钮和一些信息显示在预览画面之上。

alt none

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <FrameLayout
        android:id="@+id/FL"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <SurfaceView
            android:id="@+id/CV"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" />

        <LinearLayout
            android:id="@+id/LL"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/TV"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="10"
                android:textSize="100dip" />

            <Button
                android:id="@+id/BT"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Take Picture" />
        </LinearLayout>
    </FrameLayout>

</LinearLayout>

Related Posts