前言
一个人至少要拥有一个梦想，有一个理由坚强。心若没有栖息的地方，到哪里都是流浪。
线性布局
线性布局由LinearLayout类来代表，它会将容器里的组件一个挨着一个地排列起来。
代码示例1
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="top|center_horizontal" >
<Button
android:id="@+id/bn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bn1"
/>
<Button
android:id="@+id/bn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bn2"
/>
<Button
android:id="@+id/bn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bn3"
/>
</LinearLayout>
效果1
Screenshot_20171017-140522.png
代码示例2
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="left|center_vertical" >
<Button
android:id="@+id/bn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bn1"
/>
<Button
android:id="@+id/bn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bn2"
/>
<Button
android:id="@+id/bn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bn3"
/>
</LinearLayout>
效果2
Screenshot_20171017-141513.png
提示
android:orientation属性,控制各组件横向排列和竖向排列。
android:gravity属性,控制它所包含的子元素的对齐方式。
android:layout_gravity属性,设置该子元素在父容器中的对齐方式。
表格布局
表格布局由TableLayout所代表，TableLayout继承了LinearLayout，因此它的本质依然是线性布局管理器。除此之外，表格布局是通过添加TableRow、其他组件来控制表格的行数和列数。
代码示例
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<!-- 定义第一个表格布局，指定第二列允许收缩，第三列允许拉伸 -->
<TableLayout android:id="@+id/tablelayout01"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:shrinkColumns="1"
android:stretchColumns="2">
<!-- 直接添加按钮，独自占一行 -->
<Button
android:id="@+id/bt1_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="独自占一行的按钮"
/>
<TableRow>
<Button
android:id="@+id/bt1_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="普通按钮"
/>
<Button
android:id="@+id/bt1_3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="收缩的按钮"
/>
<Button
android:id="@+id/bt1_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="拉伸的按钮"
/>
</TableRow>
</TableLayout>
<!-- 定义第二个表格布局，指定第二列隐藏 -->
<TableLayout android:id="@+id/tablelayout02"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:collapseColumns="1">
<!-- 直接添加按钮，独自占一行 -->
<Button
android:id="@+id/bt2_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="独自占一行的按钮"
/>
<TableRow>
<Button
android:id="@+id/bt2_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="普通按钮"
/>
<Button
android:id="@+id/bt2_3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="隐藏按钮"
/>
<Button
android:id="@+id/bt2_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="普通按钮"
/>
</TableRow>
</TableLayout>
<!-- 定义第三个表格布局，指定第二列和第三列被拉伸 -->
<TableLayout android:id="@+id/tablelayout03"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stretchColumns="1,2">
<!-- 直接添加按钮，独自占一行 -->
<Button
android:id="@+id/bt3_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="独自占一行的按钮"
/>
<TableRow>
<Button
android:id="@+id/bt3_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="普通按钮"
/>
<Button
android:id="@+id/bt3_3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="拉伸按钮"
/>
<Button
android:id="@+id/bt3_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="拉伸按钮"
/>
</TableRow>
</TableLayout>
</LinearLayout>
效果
Screenshot_20171017-143543.png
提示
android:stretchColumns属性,设置允许被拉伸的列的列序号。
android:shringkColumns属性,设置允许被收缩的列的列序号。
android:collapseColumns属性,设置需要被隐藏的列的列序号。
上述属性如果有多个列序号，直接用逗号隔开。
帧布局
帧布局由FrameLayout所代表，FrameLayout直接继承了ViewGroup组件。
代码示例
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- 依次定义6个TextView，先定义的TextView位于底层 -->
<TextView
android:id="@+id/view01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:width="320pt"
android:height="320pt"
android:background="#f00"
/>
<TextView
android:id="@+id/view02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:width="280pt"
android:height="280pt"
android:background="#0f0"
/>
<TextView
android:id="@+id/view03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:width="240pt"
android:height="240pt"
android:background="#00f"
/>
<TextView
android:id="@+id/view04"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:width="200pt"
android:height="200pt"
android:background="#ff0"
/>
<TextView
android:id="@+id/view05"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:width="160pt"
android:height="160pt"
android:background="#f0f"
/>
<TextView
android:id="@+id/view06"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:width="120pt"
android:height="120pt"
android:background="#0ff"
/>
</FrameLayout>
效果
Screenshot_20171017-150702.png
提示
帧布局的效果是把组件一个个地叠加在一起。
相对布局
相对布局由RelativeLayout所代表，相对布局容器内子组件的位置总是相对兄弟组件、父容器来决定的。
代码示例
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- 定义该组件位于父容器直中间 -->
<Button
android:id="@+id/bt0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="中心按钮"
android:layout_centerInParent="true"
/>
<!-- 定义该组件位于bt0组件的上方 -->
<Button
android:id="@+id/bt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="上方按钮"
android:layout_above="@id/bt0"
android:layout_alignLeft="@id/bt0"
/>
<!-- 定义该组件位于bt0组件的下方 -->
<Button
android:id="@+id/bt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="上方按钮"
android:layout_below="@id/bt0"
android:layout_alignLeft="@id/bt0"
/>
<!-- 定义该组件位于bt0组件的左侧 -->
<Button
android:id="@+id/bt3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="左侧按钮"
android:layout_toLeftOf="@id/bt0"
android:layout_alignTop="@id/bt0"
/>
<!-- 定义该组件位于bt0组件的右侧 -->
<Button
android:id="@+id/bt4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="右侧按钮"
android:layout_toRightOf="@id/bt0"
android:layout_alignTop="@id/bt0"
/>
</RelativeLayout>
效果
Screenshot_20171017-152728.png
提示
layout_above属性,控制该子组件位于给出ID组件的上方。
layout_below属性,控制该子组件位于给出ID组件的下方。
layout_toLeftOf属性,控制该子组件位于给出ID组件的左侧。
layout_toRightOf属性,控制该子组件位于给出ID组件的右侧。
layout_alignTop属性,控制该子组件与给出ID组件的上边界对齐。
layout_alignBottom属性,控制该子组件与给出ID组件下上边界对齐。
layout_alignLeft属性,控制该子组件与给出ID组件的左边界对齐
layout_alignRight属性,控制该子组件与给出ID组件的右边界对齐。
网格布局
网格布局由GridLayout所代表，它的作用类似于HTML中的table标签，它把整个容器划分成rows x columns个网格，每个网格可以放置一个组件。除此之外，也可以设置一个组件横跨多少列、纵跨多少行。
代码示例
MainActivity.java
public class MainActivity extends Activity {
GridLayout gridLayout;
//定义16个按钮文本
String[] chars = new String[]
{
"AC","+/-","%","÷",
"7","8","9","x",
"4","5","6","-",
"1","2","3","+",
"0","00",".","="
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.grid);
gridLayout = (GridLayout) findViewById(R.id.root);
for(int i = 0; i < chars.length; i++)
{
Button bt = new Button(this);
bt.setText(chars[i]);//设置按钮文本
bt.setTextSize(40);//设置按钮的文本大小
bt.setWidth(120);//设置按钮的宽度
bt.setHeight(110);//设置按钮的高度
//指定该按钮所在的行
GridLayout.Spec rowSpec = GridLayout.spec(i / 4 + 1);
//指定该按钮所在的列
GridLayout.Spec columnSpec = GridLayout.spec(i % 4);
GridLayout.LayoutParams params = new GridLayout.LayoutParams(rowSpec,columnSpec);
//指定该按钮占满父容器
params.setGravity(Gravity.FILL);
gridLayout.addView(bt,params);
}
}
}
grid.xml
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:rowCount="6"
android:columnCount="4"
android:id="@+id/root"
>
<!-- 定义一个横跨4列的文本框，并设置该文本框的前景色、背景色等属性 -->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_columnSpan="4"
android:textSize="100sp"
android:layout_marginLeft="2pt"
android:layout_marginRight="2pt"
android:padding="3pt"
android:gravity="right"
android:background="#eee"
android:textColor="#000"
android:text="0"
/>
</GridLayout>
效果
Screenshot_20171017-161435.png
