Android 布局之GridLayout


1 GridLayout简介

GridLayout是Android4.0新提供的网格矩阵形式的布局控件。

GridLayout的继承关系如下:
java.lang.Object
  --> android.view.View
    --> android.view.ViewGroup
      --> android.widget.GridLayout

GridLayout包含的属性如下

android:alignmentMode
属性说明:当设置alignMargins,使视图的外边界之间进行校准。可以取以下值:
alignBounds -- 对齐子视图边界。
alignMargins -- 对齐子视图边距。

android:columnCount
属性说明:GridLayout的最大列数

android:rowCount
属性说明:GridLayout的最大行数

android:columnOrderPreserved
属性说明: 当设置为true,使列边界显示的顺序和列索引的顺序相同。默认是true。

android:orientation
属性说明:GridLayout中子元素的布局方向。有以下取值:
horizontal -- 水平布局。
vertical -- 竖直布局。

android:rowOrderPreserved
属性说明: 当设置为true,使行边界显示的顺序和行索引的顺序相同。默认是true。

android:useDefaultMargins
属性说明: 当设置ture,当没有指定视图的布局参数时,告诉GridLayout使用默认的边距。默认值是false。

这些是GridLayout布局本身的属性。


2 GridLayout子元素属性

上面描述的 GridLayout 的属性,是 GridLayout 布局本身的属性;下面 GridLayout 布局中的元素所支持的属性。GridLayout 布局中的元素的属性,定义在 GridLayout.LayoutParams 中。取值如下:

2.1 android:layout_column

属性说明: 显示该空间的列。例如,android:layout_column="0",表示在第1列显示该控件;android:layout_column="1",表示在第2列显示该控件。

layout文件示例,

<?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:orientation="horizontal"
android:rowCount="2"
android:columnCount="3" >
  <Button
android:id="@+id/one"
android:layout_column="1"
android:text="1"/>
  <Button
android:id="@+id/two"
android:layout_column="0"
android:text="2"/>
   <Button
android:id="@+id/three"
android:text="3"/>
  <Button
android:id="@+id/devide"
android:text="/"/> </GridLayout>

对应的显示效果图

layout文件说明
android:orientation="horizontal" -- GridLayout中控件的布局方向是水平布局。
android:rowCount="2"               -- GridLayout最大的行数为2行。
android:columnCount="3"          -- GridLayout最大的列数为3列。
android:layout_column="1"        -- 定义控件one的位于第2列。
android:layout_column="0"        -- 定义该控two件的位于第1列。

2.2 android:layout_columnSpan

属性说明: 该控件所占的列数。例如,android:layout_columnSpan="2",表示该控件占2列。

layout文件示例

<?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:orientation="horizontal"
android:rowCount="2"
android:columnCount="3" >
  <Button
android:id="@+id/one"
android:layout_column="0"
android:layout_columnSpan="2"
android:text="1"/>
  <Button
android:id="@+id/two"
android:text="2"/>
   <Button
android:id="@+id/three"
android:text="3"/>
  <Button
android:id="@+id/devide"
android:text="/"/> </GridLayout>

对应的显示效果图

layout文件说明

数字"1"实际上占据的空间大小是2列,但是第2列显示为空白。若要第2列不显示空白,需要设置 android:layout_gravity属性,参考下例。

2.3 android:layout_row

属性说明: 该控件所在行。例如,android:layout_row="0",表示在第1行显示该控件;android:layout_row="1",表示在第2行显示该控件。它和 android:layout_column类似。

2.4 android:layout_rowSpan

属性说明: 该控件所占的行数。例如,android:layout_rowSpan="2",表示该控件占2行。它和 android:layout_columnSpan类似。

2.5 android:layout_gravity

属性说明

该控件的布局方式。可以取以下值:
  top                      -- 控件置于容器顶部,不改变控件的大小。
  bottom                -- 控件置于容器底部,不改变控件的大小。
  left                     -- 控件置于容器左边,不改变控件的大小。
  right                   -- 控件置于容器右边,不改变控件的大小。
  center_vertical     -- 控件置于容器竖直方向中间,不改变控件的大小。
  fill_vertical          -- 如果需要,则往竖直方向延伸该控件。
  center_horizontal -- 控件置于容器水平方向中间,不改变控件的大小。
  fill_horizontal      -- 如果需要,则往水平方向延伸该控件。
  center                -- 控件置于容器中间,不改变控件的大小。
  fill                     -- 如果需要,则往水平、竖直方向延伸该控件。
  clip_vertical        -- 垂直剪切,剪切的方向基于该控件的top/bottom布局属性。若该控件的gravity是竖直的:若它的gravity是top的话,则剪切该控件的底部;若该控件的gravity是bottom的,则剪切该控件的顶部。
  clip_horizontal     -- 水平剪切,剪切的方向基于该控件的left/right布局属性。若该控件的gravity是水平的:若它的gravity是left的话,则剪切该控件的右边;若该控件的gravity是  right的,则剪切该控件的左边。
  start                  -- 控件置于容器的起始处,不改变控件的大小。
  end                   -- 控件置于容器的结束处,不改变控件的大小。

对应函数: setGravity(int)

layout文件示例:

<?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:orientation="horizontal"
android:rowCount="2"
android:columnCount="3" >
  <Button
android:id="@+id/one"
android:layout_column="0"
android:layout_columnSpan="2"
android:layout_gravity="fill"
android:text="1"/>
  <Button
android:id="@+id/two"
android:text="2"/>
   <Button
android:id="@+id/three"
android:text="3"/>
  <Button
android:id="@+id/devide"
android:text="/"/> </GridLayout>

对应的显示效果图


3 应用示例

定义一个简单的计算器界面,包含“0-9、.、+、-、*、/、=、”。用GridLayout实现。

layout文件

<?xml version="1.0" encoding="utf-8"?>
<!-- GridLayout: 5行 4列 水平布局 -->
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:rowCount="5"
android:columnCount="4" >
  <Button
android:id="@+id/one"
android:text="1"/>
  <Button
android:id="@+id/two"
android:text="2"/>
   <Button
android:id="@+id/three"
android:text="3"/>
  <Button
android:id="@+id/devide"
android:text="/"/>
  <Button
android:id="@+id/four"
android:text="4"/>
  <Button
android:id="@+id/five"
android:text="5"/>
  <Button
android:id="@+id/six"
android:text="6"/>
  <Button
android:id="@+id/multiply"
android:text="×"/>
  <Button
android:id="@+id/seven"
android:text="7"/>
  <Button
android:id="@+id/eight"
android:text="8"/>
  <Button
android:id="@+id/nine"
android:text="9"/>
<Button
android:id="@+id/minus"
android:text="-"/>
<Button
android:id="@+id/zero"
android:layout_columnSpan="2"
android:layout_gravity="fill"
android:text="0"/>
  <Button
android:id="@+id/point"
android:text="."/>
<Button
android:id="@+id/plus"
android:layout_rowSpan="2"
android:layout_gravity="fill"
android:text="+"/>
<Button
android:id="@+id/equal"
android:layout_columnSpan="3"
android:layout_gravity="fill"
android:text="="/>
</GridLayout>

点击下载:源代码

效果图:

Android 布局之GridLayout的更多相关文章

  1. Android 布局之GridLayout(转载)

    转载:http://www.cnblogs.com/skywang12345/p/3154150.html 1 GridLayout简介 GridLayout是Android4.0新提供的网格矩阵形式 ...

  2. Android精通:TableLayout布局,GridLayout网格布局,FrameLayout帧布局,AbsoluteLayout绝对布局,RelativeLayout相对布局

    在Android中提供了几个常用布局: LinearLayout线性布局 RelativeLayout相对布局 FrameLayout帧布局 AbsoluteLayout绝对布局 TableLayou ...

  3. Android布局_网格布局GirdLayout

    自Android4.0版本后新增的GirdLayout网格布局(API 14) <?xml version="1.0" encoding="utf-8"? ...

  4. [置顶] Android布局管理器 - 详细解析布局实现

    布局管理器都是以ViewGroup为基类派生出来的; 使用布局管理器可以适配不同手机屏幕的分辨率,尺寸大小; 布局管理器之间的继承关系 : 在上面的UML图中可以看出, 绝对布局 帧布局 网格布局 相 ...

  5. Android 布局 ViewGroup

    布局 res/layout 命名规则(全部小写) activity_ fragment_ item_ 基础组件 com.android.widget包下 父类View view:屏幕上一块矩阵区域 能 ...

  6. Android 布局管理器

    为了更好地管理Android应用程序的用户界面组件,Android它提供了一个布局管理.通过使用布局管理,Android具有良好的平台无关的图形用户界面应用程序. 平时,推荐布局管理器来管理分布式组件 ...

  7. Android布局解析,图文(转)

    LinearLayout:相当于Java GUI中的FlowLayout(流式布局),就是说一个组件后边跟一个,挨着靠,一个组件把一行占满了,就靠到下一行. linearlayoutdemo.xml ...

  8. Android布局管理详解(1)—— LinearLayout 线性布局

    Android的布局方式共有6种,分别是LinearLayout(线性布局).TableLayout(表格布局).FrameLayout(帧布局).RelativeLayout(相对布局).GridL ...

  9. android布局Relative和gridLayout-android学习之旅(十六)

    Relative布局简介 相对布局的组件是由兄弟组件和父组价决定的,因此这种布局被称为相对布局. 属性设置介绍 RelativeLayout.Layoutparam中只能设置为true和false的属 ...

随机推荐

  1. 今日例子border

    border这个属性在页面上的使用率还是很高,例如我们需要理解的盒模型就需要对border有个 比较深的理解,如果你会盒模型,但对border没有深的理解,那只能说你只是知道盒模型,而 不是懂得盒模型 ...

  2. JS_Ajax基础

    一:Ajax ajax 的全称是Asynchronous(异步) JavaScript and XML 在不刷新页面的情况下从服务器获取,提交数据的一种数据交互方式; 二:Ajax使用步骤概括 //1 ...

  3. php对csv文件的读取,写入,输出下载操作

    在实际工作中,很多时候需要把网站上的一些数据下载到CSV文件里,方便以后查看. 亦或者是用CSV进行一些批量的上传工作. 这个时候我们就需要对CSV进行读写操作. 1.CSV的读取操作 <?ph ...

  4. tomcat7需要进行升级,因为有漏洞,而且安装包没有做过优化处理

    http://www.open-open.com/lib/view/open1401931407228.html http://www.cnblogs.com/ggjucheng/archive/20 ...

  5. 初始zookeeper与集群搭建实例

    zookeeper是什么 Zookeeper,一种分布式应用的协作服务,是Google的Chubby一个开源的实现,是Hadoop的分布式协调服务,它包含一个简单的原语集,应用于分布式应用的协作服务, ...

  6. 8 个最优秀的 Android Studio 插件

    Android Studio是目前Google官方设计的用于原生Android应用程序开发的IDE.基于JetBrains的IntelliJ IDEA,这是Google I/O 2013第一个宣布的作 ...

  7. [Javascript] Functor Basic Intro

    Well, this stuff will be a little bit strange if you deal with it first time. Container Object: Just ...

  8. C# Use Pop3Client to read gmail

    host = "pop.gmail.com" user = "xxxxx@gmail.com" password = "xxxx" port ...

  9. PHP操作MongoDB学习(转)

    1  mongodb启动时,设置启动项 C:\>mongodb\bin\mongod --config C:\mongodb.conf 其中mongodb.conf为:    dbpath = ...

  10. C# winForm 窗体闪烁问题

    在构造函数里加上以下代码: this.DoubleBuffered = true;//设置本窗体            SetStyle(ControlStyles.UserPaint, true); ...