Android中的六大布局


继承关系图:


布局XML文件中常用属性:
android:layout_width 宽度 
android:layout_height 高度

可能的取值为match_parent,wrap_content或者固定的像素值。
android:orientation 方向
可能的取值为 horizontal水平 vertical 垂直
android:gravity
用来确定View中的控件在View中的停靠位置。 
android:layout_gravity
用来确定View在其父控件中的停靠位置
android:padding
padding是控件中的内容相对控件的边缘的边距.
android:layout_margin
layout_margin是控件边缘相对父空间的边距

android:baselineAligned 

该属性设置为false,将会阻止该布局管理器与它的子元素的基线对齐

android:divider

设置垂直布局时两个组件之间的分隔条

一.LinearLayout线性布局

水平方向:

<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"
    tools:context=".MainActivity" >

    <TextView android:layout_width="wrap_content"
              android:layout_height="match_parent"
              android:text="row1"
              android:layout_weight="1"
              android:background="#0000FF"/>
    
    <TextView android:layout_width="wrap_content"
              android:layout_height="match_parent"
              android:text="row2"
              android:layout_weight="1"
              android:background="#00FF00"/>
    
    <TextView android:layout_width="wrap_content"
              android:layout_height="match_parent"
              android:text="row3"
              android:layout_weight="1"
              android:background="#FF0000"/>

</LinearLayout>

输出结果:




垂直方向:

<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"
    tools:context=".MainActivity" >

    <TextView android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:text="row1"
              android:layout_weight="1"
              android:background="#0000FF"/>
    
    <TextView android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:text="row2"
              android:layout_weight="1"
              android:background="#00FF00"/>
    
    <TextView android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:text="row3"
              android:layout_weight="1"
              android:background="#FF0000"/>

</LinearLayout>

输出结果:



二.FrameLayout单帧布局

<FrameLayout 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"
    tools:context=".MainActivity" >
    
    <TextView android:layout_width="80dp"
              android:layout_height="80dp"
              android:text="row3"
              android:background="#FF0000"/>
    
     <TextView android:layout_width="60dp"
              android:layout_height="60dp"
              android:text="row2"
              android:background="#00FF00"/>
    
      <TextView android:layout_width="40dp"
              android:layout_height="40dp"
              android:text="row1"
              android:background="#0000FF"/>

</FrameLayout>

输出结果:


三.RelativeLayout相对布局

android:layout_centerInParent
定义组件在父容器中间

android:layout_centerVertical

定义组件在父容器垂直居中

android:layout_centerHorizontal

定义组件在父容器水平居中

android:layout_alignParentBottom

定义组件与父容器下对齐

(上对齐,左对齐,右对齐略)
android:layout_above
定义在组件的上方
android:layout_below
定义在组件的下方
android:layout_toLeftOf
定义在组件的左边
android:layout_toRightOf
定义在组件的右边 

android:layout_alignTop
本元素的上边缘和某元素的的上边缘对齐
(下对齐,右对齐,左对齐略 ...)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:orientation="vertical"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	>
<!-- 定义该组件位于父容器中间 -->	
<TextView 
	android:id="@+id/view01"
	android:layout_width="wrap_content" 
	android:layout_height="wrap_content" 
	android:background="@drawable/leaf"
	android:layout_centerInParent="true"
	/>
<!-- 定义该组件位于view01组件的上方 -->
<TextView 
	android:id="@+id/view02"
	android:layout_width="wrap_content" 
	android:layout_height="wrap_content" 
	android:background="@drawable/leaf"
	android:layout_above="@id/view01"
	android:layout_alignLeft="@id/view01"
	/>
<!-- 定义该组件位于view01组件的下方 -->
<TextView 
	android:id="@+id/view03"
	android:layout_width="wrap_content" 
	android:layout_height="wrap_content" 
	android:background="@drawable/leaf"
	android:layout_below="@id/view01"
	android:layout_alignLeft="@id/view01"
	/>
<!-- 定义该组件位于view01组件的左边 -->
<TextView 
	android:id="@+id/view04"
	android:layout_width="wrap_content" 
	android:layout_height="wrap_content" 
	android:background="@drawable/leaf"
	android:layout_toLeftOf="@id/view01"
	android:layout_alignTop="@id/view01"
	/>
<!-- 定义该组件位于view01组件的右边 -->
<TextView 
	android:id="@+id/view05"
	android:layout_width="wrap_content" 
	android:layout_height="wrap_content" 
	android:background="@drawable/leaf"
	android:layout_toRightOf="@id/view01"
	android:layout_alignTop="@id/view01"
	/>		
</RelativeLayout>

输出结果:



四.TableLayout表格布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:orientation="vertical"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	>
<!-- 定义第一个表格布局,指定第2列允许收缩,第3列允许拉伸 -->
<TableLayout android:id="@+id/TableLayout01" 
	android:layout_width="fill_parent" 
	android:layout_height="wrap_content"
	android:shrinkColumns="1"
	android:stretchColumns="2"
>
<!-- 直接添加按钮,它自己会占一行 -->
<Button android:id="@+id/ok1" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="独自一行的按钮"
	/>
<!-- 添加一个表格行 -->
<TableRow>
<!-- 为该表格行添加3个按钮 -->
<Button android:id="@+id/ok2" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="普通按钮"
	/> 	
<Button android:id="@+id/ok3" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="收缩的按钮"
	/> 
<Button android:id="@+id/ok4" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="拉伸的按钮"
	/>
</TableRow>	
</TableLayout>
<!-- 定义第二个表格布局 ,指定第二列隐藏-->
<TableLayout android:id="@+id/TableLayout01" 
	android:layout_width="fill_parent" 
	android:layout_height="wrap_content"
	android:collapseColumns="1"
>
<!-- 直接添加按钮,它自己会占一行 -->
<Button android:id="@+id/ok5" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text=" 独自一行的按钮 "
	/>
<!--定义一个表格行-->
<TableRow>
<!-- 为该表格行添加3个按钮 -->
<Button android:id="@+id/ok6" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="普通按钮1"
	/> 	
<Button android:id="@+id/ok7" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="被隐藏的按钮"
	/> 
<Button android:id="@+id/ok8" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="普通按钮 3"
	/>
</TableRow>	
</TableLayout>
<!-- 定义第三个表格布局 ,指定第2、3两列可以被拉伸-->
<TableLayout android:id="@+id/TableLayout01" 
	android:layout_width="fill_parent" 
	android:layout_height="wrap_content"
	android:stretchColumns="1,2"
>
<!-- 直接添加按钮,它自己会占一行 -->
<Button android:id="@+id/ok9" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="独自一行的按钮"
	/>
<!--定义一个表格行-->
<TableRow>
<!-- 为该表格行添加3个按钮 -->
<Button android:id="@+id/ok10" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="普通按钮"
	/> 	
<Button android:id="@+id/ok11" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="拉伸的按钮"
	/> 
<Button android:id="@+id/ok12" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="拉伸的按钮"
	/>
</TableRow>	
<!--定义一个表格行-->
<TableRow>
<!-- 为该表格行添加2个按钮 -->
<Button android:id="@+id/ok13" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="普通按钮"
	/> 	
<Button android:id="@+id/ok14" 
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="拉伸的按钮"
	/>
</TableRow>	
</TableLayout>
</LinearLayout>

输出结果:



五.GridLayout九宫格布局(Android4.0加入)

android:rowCount
定义总行数
android:columnCount
定义总列数

用一个计算器界面的例子来演示:

<?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="50sp"
	android:layout_marginLeft="4px"
	android:layout_marginRight="4px"
	android:padding="5px"
	android:layout_gravity="right"
	android:background="#eee"
	android:textColor="#000"
	android:text="0"/>
<!-- 定义一个横跨4列的按钮 -->
<Button 
    android:layout_width="match_parent"
	android:layout_height="wrap_content" 
	android:layout_columnSpan="4"
	android:text="清除"/>
</GridLayout>

package com.light.study.android;

import android.app.Activity;
import android.os.Bundle;
import android.view.Gravity;
import android.widget.Button;
import android.widget.GridLayout;

public class MainActivity extends Activity {
	GridLayout gridLayout;
	// 定义16个按钮的文本
	String[] chars = new String[]
		{
			"7" , "8" , "9" , "÷",
			"4" , "5" , "6" , "×",
			"1" , "2" , "3" , "-",
			"." , "0" , "=" , "+"
		};
	@Override
	public void onCreate(Bundle savedInstanceState)
	{
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		gridLayout = (GridLayout) findViewById(R.id.root);

		for(int i = 0 ; i < chars.length ; i++)
		{
			Button bn = new Button(this);
			bn.setText(chars[i]);
			// 设置该按钮的字体大小
			bn.setTextSize(40);
			// 指定该组件所在的行
			GridLayout.Spec rowSpec = GridLayout.spec(i / 4 + 2);
			// 指定该组件所在列
			GridLayout.Spec columnSpec = GridLayout.spec(i % 4);
			GridLayout.LayoutParams params = new GridLayout.LayoutParams(
					rowSpec , columnSpec);
			// 指定该组件占满父容器
			params.setGravity(Gravity.FILL);		
			gridLayout.addView(bn , params);
		}
	}

}

输出结果:



  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: Android 六宫格布局是指将界面分为六个等大小的方格,每个方格可以放置不同的控件或者视图。这种布局方式在Android应用的界面设计经常使用,可以使界面看起来整齐、美观,并且提供了较高的灵活性。 实现六宫格布局的方法有很多种,其比较简单的方式是使用GridLayout布局管理器。GridLayout可以将子视图按照行和列的方式进行排列,因此非常适合用于六宫格的界面设计。 在XML布局文件,我们可以通过设置GridLayout的属性来实现六宫格布局。首先,我们需要将GridLayout设置为6行1列,表示界面将被分为六个水平方向的等高行;然后,我们可以在每个格子添加其他的控件或者视图。通过设置每个格子的权重、行列位置等属性,可以实现不同的布局效果,例如让某些格子占据更多的空间或者选择合适的控件来填充格子。 另外,我们还可以通过Java代码来实现六宫格布局。可以使用GridLayoutManager或者自定义布局管理器继承自RecyclerView.LayoutManager来实现。这种方式可以更加灵活地控制子视图的排列方式,可以根据自己的需求定制不同的布局效果。 总之,Android六宫格布局是一种常见且实用的界面布局方式,可以通过使用GridLayout或者自定义布局管理器来实现。这种布局方式可以使界面整齐、美观,并且提供了较高的灵活性,适合用于不同类型的Android应用界面设计。 ### 回答2: 安卓的六宫格布局是一种常见的应用界面布局方式,它将屏幕分割为2行3列的六个等大的格子,每个格子可以放置不同的应用模块或者功能模块。 此布局通常用于主屏幕或者应用程序的菜单界面,以提供快速访问和导航。每个格子可以自定义放置不同的应用图标、小部件或者快捷方式,以满足用户的个性化需求。 六宫格布局的优势在于简单直观,用户可以一目了然地找到和使用所需的应用或者功能。同时,由于每个格子的尺寸相同,不同的应用图标或者模块之间的界面一致性很高,提升了用户界面的美观度和易用性。 此外,六宫格布局还可以根据用户的喜好进行调整和定制。用户可以自由地拖动和排列格子的位置,以适应个人喜好和使用习惯。这种灵活性使得用户可以根据自己的需求将常用的应用设置为更加方便的位置,提高了操作效率。 总的来说,安卓的六宫格布局提供了一种简单直观且易于个性化的界面布局方式,使得用户可以快速访问和导航不同的应用或者功能模块。它为用户提供了良好的用户体验和操作效率,受到广大安卓用户的喜爱。 ### 回答3: 六宫格布局是一种常见的Android布局方式,适用于需要将界面划分为6个等宽、等高的方格的情况。 在Android,可以通过使用GridLayout布局管理器来实现六宫格布局。首先,在XML布局文件定义一个GridLayout容器,并设置相关属性,如行数、列数、间距等。然后,在GridLayout添加6个子视图,即代表六个方格的控件。 可以将六宫格布局分为两步骤:定义和设置属性与添加子视图。 在定义和设置属性方面,可以通过设置GridLayout的属性来实现六宫格布局的效果。比如,设置行数和列数为2,即可将布局分为2行3列的六个方格。可以使用layout_rowSpan和layout_columnSpan属性来设置某个子视图占据多个行或列的大小。也可以使用layout_gravity属性调整子视图在方格的位置。 在添加子视图方面,可以使用GridLayout的addView方法来将子视图添加到布局。可以使用LayoutInflater来实例化子视图,并为子视图设置相关属性。可以通过设置子视图的宽度和高度为0dp,以实现平均分配布局。 总结起来,通过使用GridLayout布局管理器,可实现六宫格布局,将界面划分为6个等宽、等高的方格。根据需要,可以通过设置各个子视图的属性和位置,来实现不同的布局效果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值