首先介绍常用布局类
- FrameLayout 最简单的布局管理器。
这个布局管理类有几个特性:
- 添加组件默认在左上角的。
- 如果添加多个组件会叠加到一起,并且都在左上角。(可以通过一gravity属性改变叠加情况)
- 后添加的组件在上层。
- LinearLayout LinearLayout通过垂直方向和水平方面进行布局的,LinearLayout允许每一个视图都有一个weight属性。
- RelativeLayout RelativeLayout是相对于其他的组件和屏幕边缘布局的管理类。
- GridLayout GridLayout是Android4.0引入的概念,网格的布局方式,及其灵活,可以减少嵌套布局方式。
1.定义布局
定义一个简单的XML布局
<?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:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <Button android:text="xxx" android:layout_width="match_parent" android:layout_height="wrap_content"/> </LinearLayout>
定义了一个线性布局方式,方向是垂直方向的(通过android:orientation="vertical"属性控制)
这里有三个常量我们将进行详细讲解fill_parent,match_parent,wrap_content。
- fill_parent 填满父类的View,Fragment,Activity的空间。
- wrap_content 把视图大小设置为显示内容的最小尺寸。
- match_parent 从Android 2.2开始fill_parent改名为match_parent。
用java代码实现布局
LinearLayout layout = new LinearLayout(this); layout.setOrientation(LinearLayout.VERTICAL); Button button = new Button(this); button.setText("xxx"); int height = LinearLayout.LayoutParams.MATCH_PARENT; int weight = LinearLayout.LayoutParams.WRAP_CONTENT; layout.addView(button, new LinearLayout.LayoutParams(height, weight)); setContentView(layout);
这个代码也比较简单,不做详细介绍了。
2.使用布局创建和设备无关的UI
1.LinearLayout(线性布局)
线性布局是最简单的布局之一,简单但是缺少了灵活性。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent"> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="xx1" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="xx2" />
<!--被嵌套的垂直LinearLayout布局--> <LinearLayout android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="xx3"/> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="xx4"/> </LinearLayout> </LinearLayout>
效果下如图,这里有嵌套布局,一个水平布局的LinearLayout里面嵌套了一个竖直的LinearLayout布局方式。
2.RelativeLayout(相对布局)
RelativeLayout布局非常的灵活,主要针对边框和其他组件进行布局。
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:id="@+id/buttonBar" android:layout_alignParentBottom="true" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <Button android:text="xx1" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <Button android:text="xx2" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </LinearLayout> <Button android:text="xx3" android:layout_above="@+id/buttonBar" android:layout_alignParentLeft="true" android:layout_width="wrap_content" android:layout_height="wrap_content"> </Button> </RelativeLayout>
效果图如下
讲几个属性,这个属性对相对布局非常重要
- android:layout_centerHrizontal 水平居中
- android:layout_centerVertical 竖直居中
- android:layout_centerInparent 相对于父类完全居中
- android:layout_alignParentBottom 贴紧父元素的下边缘
- android:layout_alignParentLeft 贴紧父元素的左边缘
- android:layout_alignParentRight 贴紧父元素的右边缘
- android:layout_alignParentTop 贴紧父元素的上边缘
- android:layout_alignWithParentIfMissing 如果对应的兄弟元素找不到的话就以父元素做参照物
来个小的总结
android:layout_centerInparent 相当于layout_centerHrizontal和layout_centerVertical一起用是一个效果,如果同时设置android:layout_alignParentBottom和android:layout_alignParentTop会把控件拉长和父类一样,同样道理android:layout_alignParentLeft和android:layout_alignParentRight也一样拉长控件。
- android:layout_below 在某元素的下方
- android:layout_above 在某元素的的上方
- android:layout_toLeftOf 在某元素的左边
- android:layout_toRightOf 在某元素的右边
来个小总结
如果同时设置了android:layout_below和android:layout_above并且id指向的是同一个控件,这是控件会消失不见。如果同时设置了android:layout_below和android:layout_above指定不同的控件会把控件拉长。
- android:layout_alignTop 本元素的上边缘和某元素的的上边缘对齐
- android:layout_alignLeft 本元素的左边缘和某元素的的左边缘对齐
- android:layout_alignBottom 本元素的下边缘和某元素的的下边缘对齐
- android:layout_alignRight 本元素的右边缘和某元素的的右边缘对齐
来个小总结
同样这样的布局方式也会有拉长的情况。
- android:layout_marginBottom 离某元素底边缘的距离
- android:layout_marginLeft 离某元素左边缘的距离
- android:layout_marginRight 离某元素右边缘的距离
- android:layout_marginTop 离某元素上边缘的距离
3.GridLayout(网格布局)
网格布局在Android3.0(API level 11)导入,是所有布局管理器中最灵活的一种。
<?xml version="1.0" encoding="utf-8"?> <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:alignmentMode="alignMargins" android:orientation="horizontal" android:columnOrderPreserved="true" android:rowCount="3" android:rowOrderPreserved="true" android:columnCount="4"> <Button android:id="@+id/xx1" android:text="1" /> <Button android:text="2" android:layout_column="0" android:layout_row="2"/> <Button android:text="3" android:layout_rowSpan="3" android:layout_gravity="fill"/> <Button android:text="4"/> <Button android:text="5"/> <Button android:text="6"/> <Button android:text="7"/> <Button android:text="8"/> <Button android:text="9"/> <Button android:text="10"/> </GridLayout>
GridLayout下的属性
- android:orientation 在GridLayout的根目录下,有两个属性horizontal和vertical顾名思义就是水平和竖直布局。
- android:rowCount 网格的行数
- android:columnCount 网格的列数
包含控件属性
- android:layout_columnSpan 水平合并单元格
- android:layout_rowSpan 竖直合并单元格
- android:layout_gravity 有很多属性:fill,bottom 等等。
作者 Young-Ken(微博)
审阅者 Cindy-Leee(微博)转载请注明 http://www.cnblogs.com/youngKen/p/4831953.html