Android课堂笔记——LinearLayout和RelativeLayout常用的两种布局方式

线性布局LinearLayout

线性布局是应用程序中最常用的布局方式，它提供了控件水平或者垂直排列的模型，同时我们可通过设置子控件的weight布局参数控制各个控件在布局中的相对大小。

xml布局文件中的配置

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

常用属性：

确定LinearLayout的方向：android:orientation=“属性” vertical: 表示垂直布局 horizontal: 表示水平布局 *注：垂直布局全部为垂直方向，水平布局全部为水平方向

垂直布局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity" > <TextView android:layout_width="50dp" android:layout_height="50dp" android:layout_marginRight="10dp" android:layout_marginBottom="10dp" android:background="#00ff00" /> <TextView android:layout_width="50dp" android:layout_height="50dp" android:layout_marginRight="10dp" android:layout_marginBottom="10dp" android:background="#00ff00" /> <TextView android:layout_width="50dp" android:layout_height="50dp" android:layout_marginRight="10dp" android:layout_marginBottom="10dp" android:background="#00ff00" /> </LinearLayout>

水平布局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity" > <TextView android:layout_width="50dp" android:layout_height="50dp" android:layout_marginRight="10dp" android:layout_marginBottom="10dp" android:background="#00ff00" /> <TextView android:layout_width="50dp" android:layout_height="50dp" android:layout_marginRight="10dp" android:layout_marginBottom="10dp" android:background="#00ff00" /> <TextView android:layout_width="50dp" android:layout_height="50dp" android:layout_marginRight="10dp" android:layout_marginBottom="10dp" android:background="#00ff00" /> </LinearLayout>

宽度和高度：

layout_width 代表此组件布局的宽度 fill_parent: 则会填满parent的宽度 wrap_content:则组件宽度会依照内容大小而调整 android:layout_height 代表此组件布局的高度 fill_parent: 则会填满parent的宽度 wrap_content:则组件宽度会依照内容大小而调整

margin外边框：

layout_margin 指定这个view距离上下左右的额外距离 android: layout_marginBottom 指定这个view距离下方的额外距离 android: layout_marginLeft 指定这个view距离左方的额外距离 android: layout_marginRight 指定这个view距离右方的额外距离 android: layout_marginTop 指定这个view距离上方的额外距离

相对布局RelativeLayout

相对布局的子控件会根据它们说设置的参照控件和参数进行相对布局。参照控件可以是父控件，也可以是其它子控件，但被参照的控件必须要在参照它的控件之前定义。

xml布局文件的配置

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

常用属性

android:layout_above 置于目标id组件的上方 android:layout_alignBaseline 置于与目标id组件同样的基线上 android:layout_alignBottom 让自己的下边界与目标id组件的下边界在同一个位置 android:layout_alignLeft 让自己的左边界与目标id组件的左边界在同一位置 android:layout_alignParentBottom 若为true，让自己的下边界与Parent的下边界同位置 android:layout_alignParentLeft 若为true，让自己的左边界与Parent的左边界同位置 android:layout_alignParentRight 若为true，让自己的右边界与Parent的右边界同位置 android:layout_alignParentTop 若为true，让自己的上边界与Parent的上边界同位置 android:layout_alignRight 让自己的右边界与目标id组件的右边界在同一位置 android:layout_toLeftOf/toRightOf 置于目标id组件的左方/右方 android:layout_alignTop 让自己的上边界与目标id组件的上边界在同一个位置 android:layout_alignWithParentIfMissing 若设为true，当参考的目标id不可用时，会以Parent为参考目标 android:layout_below 置于目标id组件的下方 android:layout_centerHorizontal 若为true，置于Parent水平位置的中心 android:layout_centerInParent 若为true，置于Parent水平以及垂直位置的中心 android:layout_centerVertical 若为true，置于Parent垂直位置的中心

两个布局方式是最为常用的布局方式，需要熟记并且熟用，下为两个布局方式混合使用的例子

<RelativeLayout 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:background="#323232" tools:context=".MainActivity" > <LinearLayout android:id="@+id/ll" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_centerInParent="true" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:orientation="vertical" > <RelativeLayout android:layout_width="match_parent" android:layout_height="50dp" android:layout_marginBottom="10dp" android:background="#FFFFFF" > <!-- 文本输入框 --> <!-- 控件一旦将背景设置成@null或透明颜色 --> <!-- hint：提示性信息 --> <EditText android:layout_width="match_parent" android:layout_height="30dp" android:layout_centerVertical="true" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="#00000000" android:hint="username or E-mail" android:singleLine="true" /> </RelativeLayout> <!-- App中用于装饰的线条，我们可以用View组件，没有任何实际意义 --> <View android:layout_width="match_parent" android:layout_height="0.5dp" android:background="#535353" /> <RelativeLayout android:layout_width="match_parent" android:layout_height="50dp" android:layout_marginBottom="10dp" android:background="#FFFFFF" > <!-- 文本输入框 --> <!-- 控件一旦将背景设置成@null或透明颜色 --> <!-- hint：提示性信息 --> <EditText android:layout_width="match_parent" android:layout_height="30dp" android:layout_centerVertical="true" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="#00000000" android:hint="·········" android:inputType="textPassword" android:singleLine="true" /> </RelativeLayout> </LinearLayout> <ImageView android:layout_width="250dp" android:layout_height="150dp" android:layout_above="@id/ll" android:layout_centerHorizontal="true" android:layout_marginBottom="80dp" android:src="@drawable/logo" /> <TextView android:layout_width="match_parent" android:layout_height="20dp" android:layout_above="@id/ll" android:layout_marginBottom="80dp" android:gravity="center" android:text="Sign in" android:textColor="#FFFFFF" /> <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/btn_r" android:layout_alignRight="@id/ll" android:layout_below="@id/ll" /> <ImageView android:layout_width="50dp" android:layout_height="50dp" android:layout_below="@id/ll" android:layout_centerHorizontal="true" android:layout_marginTop="130dp" android:src="@drawable/box" /> <TextView android:layout_width="200dp" android:layout_height="30dp" android:layout_below="@id/ll" android:layout_centerHorizontal="true" android:layout_marginTop="180dp" android:gravity="center" android:text="Forget Password?" android:textColor="#FFFFFF" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/btn_l" android:layout_alignBaseline="@+id/button1" android:layout_alignBottom="@+id/button1" android:layout_alignLeft="@+id/ll" /> </RelativeLayout> <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:drawable="@drawable/l"></item> </selector> <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:drawable="@drawable/r"></item> </selector>

*注： 其中两个按钮是两张图片，是使用selector资源文件定义