分类:C#、Android、VS2015;

创建日期:2016-02-10

一、简介

Android 4.0(API 14)开始提供的GridLayout布局使用虚细线将布局划分为行、列和单元格,也支持一个控件在行、列上都有交错排列。

GridLayout使用与LinearLayout类似的API,只不过是修改了一下相关的标签而已。

1、默认布局方式—先行后列

GridLayout默认按先行后列的方式依次显示,子元素默认按照wrap_content的方式显示。如果不希望子元素显式指定其所在的行列位置,此时只需要在GridLayout中仅指定列数(columnCount)即可,不需要指定所占的行数。

2、将布局改为先列后行

如果需要改变子元素默认的布局方式,比如改为先列后行,此时应该在GridLayout的开始标记内指定,而不是在子元素中指定。

要按先列后行的方式显示,且子元素也不需要指定其所在的行列位置,此时只需要在GridLayout中仅指定行数(rowCount)即可,不需要指定所占的列数。

3、平均分布各行内的单元格

如果希望平均分布各行内的单元格,而且希望其占满该行屏幕,只需要在每一行嵌入一个LinearLayout即可。

4、平均分布各行内的单元格且单元格之间分隔一定的外边距

设置子元素的margin即可。

5、Space、rowSpan、columnSpan

如果需要设置某控件跨越多行或多列,只需将该子控件的android:layout_rowSpan或者layout_columnSpan属性设置为数值,再设置其layout_gravity属性即可,前一个设置表明该控件跨越的行数或列数,后一个设置表明该控件填满所跨越的整行或整列。

要让子元素占据空白的单元格(比如以后再填充它),此时可以使用称为Space的子元素。

Space的另一个用途是用它指定行间距或者列间距。比如,对于一个4行3列的网格布局,如果希望第0行和第1行之间的间距是20dp,此时不需要对每个子元素都添加间距,只需要添加一个Space,将其columnSpan设置为3,然后一次性指定间距即可。

6、子元素显式指定其所在的单元格位置

如果希望某控件显示在固定的行或列,只需设置该控件的android:layout_row和android:layout_column属性即可,注意:行、列序号都是从0开始。

例如:

<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:rowCount="2"
android:columnCount="3"
android:useDefaultMargins="true"
android:background="#FFE4C4">
<TextView
android:text="元素0"
android:layout_row="0"
android:layout_column="0"
android:textSize="20dp" />
<TextView
android:text="元素1"
android:layout_row="0"
android:layout_column="1"
android:textSize="20dp" />
<TextView
android:text="元素2"
android:layout_row="0"
android:layout_column="2"
android:textSize="20dp" />
<TextView
android:text="元素3"
android:layout_row="1"
android:layout_column="0"
android:textSize="20dp" />
<TextView
android:text="元素4"
android:layout_row="1"
android:layout_column="1"
android:textSize="20dp" />
<TextView
android:text="元素5"
android:layout_row="1"
android:layout_column="2"
android:textSize="20dp" />
</GridLayout>

二、示例—Demo02GridLayout

1、设计界面

再次提醒一下,当控件太多时,或者对控件的属性不熟悉时,利用文档大纲选择某个控件,然后通过【属性】窗口设置其属性,是最简单和方便的办法。这种方式的最大优点就是能让你立即看到所选控件的属性设置的效果。

2、运行效果

3、添加Demo02GridLayout.axml文件

在layout文件夹下添加该文件。

<?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">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="(1)默认排列方式--先行后列"
android:layout_margin="5dp" />
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnCount="3"
android:useDefaultMargins="true"
android:background="#FFE4C4">
<TextView
android:text="元素0" />
<TextView
android:text="元素1" />
<TextView
android:text="元素2" />
<TextView
android:text="元素3" />
<TextView
android:text="元素4" />
<TextView
android:text="元素5" />
</GridLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="(2)指定排列方式--按先列后行排列"
android:layout_margin="5dp" />
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:useDefaultMargins="true"
android:rowCount="2"
android:background="#FFE4C4">
<TextView
android:text="元素0" />
<TextView
android:text="元素1" />
<TextView
android:text="元素2" />
<TextView
android:text="元素3" />
<TextView
android:text="元素4" />
<TextView
android:text="元素5" />
</GridLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="(3)横向平均分布"
android:layout_margin="5dp" />
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnCount="1"
android:background="#FFE4C4"
android:useDefaultMargins="true">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:text="元素0"
android:gravity="center_horizontal"
android:background="#aa0000"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff" />
<TextView
android:text="元素1"
android:gravity="center_horizontal"
android:background="#00aa00"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff" />
<TextView
android:text="元素2"
android:gravity="center_horizontal"
android:background="#0000aa"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:text="元素3"
android:gravity="center_horizontal"
android:background="#aa0000"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff" />
<TextView
android:text="元素4"
android:gravity="center_horizontal"
android:background="#00aa00"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff" />
<TextView
android:text="元素5"
android:gravity="center_horizontal"
android:background="#0000aa"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff" />
</LinearLayout>
</GridLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="(4)横向平均分布带自定义的间距"
android:layout_margin="5dp" />
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnCount="1"
android:background="#FFE4C4"
android:useDefaultMargins="true">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:text="元素0"
android:gravity="center_horizontal"
android:background="#aa0000"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff"
android:layout_marginRight="8dp" />
<TextView
android:text="元素1"
android:gravity="center_horizontal"
android:background="#00aa00"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff"
android:layout_marginRight="8dp" />
<TextView
android:text="元素2"
android:gravity="center_horizontal"
android:background="#0000aa"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:text="元素3"
android:gravity="center_horizontal"
android:background="#aa0000"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff"
android:layout_marginRight="8dp" />
<TextView
android:text="元素4"
android:gravity="center_horizontal"
android:background="#00aa00"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff"
android:layout_marginRight="8dp" />
<TextView
android:text="元素5"
android:gravity="center_horizontal"
android:background="#0000aa"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:textColor="#ffffff" />
</LinearLayout>
</GridLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="(5)Space、rowSpan、columnSpan的用法"
android:layout_margin="5dp" />
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnCount="5"
android:background="#FFE4C4"
android:useDefaultMargins="true">
<TextView
android:text="元素0"
android:layout_rowSpan="3"
android:background="#aa0000"
android:textColor="#ffffff"
android:gravity="fill_vertical"
android:layout_gravity="fill_vertical"
android:textSize="24dp" />
<TextView
android:text="元素1"
android:background="#aa0000"
android:textColor="#ffffff"
android:textSize="20dp" />
<Space />
<TextView
android:text="元素2"
android:background="#00aa00"
android:textColor="#ffffff"
android:textSize="20dp" />
<TextView
android:text="元素3"
android:layout_rowSpan="3"
android:background="#00aa00"
android:textColor="#ffffff"
android:gravity="fill_vertical"
android:layout_gravity="fill_vertical"
android:textSize="24dp" />
<TextView
android:text="元素4"
android:layout_columnSpan="3"
android:background="#0000aa"
android:textColor="#ffffff"
android:layout_gravity="fill_horizontal"
android:gravity="center_horizontal"
android:textSize="20dp" />
<TextView
android:text="元素5"
android:background="#aa0000"
android:textColor="#ffffff"
android:textSize="20dp" />
<TextView
android:text="元素6"
android:background="#00aa00"
android:textColor="#ffffff"
android:textSize="20dp" />
<TextView
android:text="元素7"
android:background="#0000aa"
android:textColor="#ffffff"
android:textSize="20dp" />
</GridLayout>
</LinearLayout>

4、添加Demo02GridLayout.cs文件

在SrcDemos文件夹下添加该文件。

using Android.App;
using Android.OS;
namespace ch07demos.SrcDemos
{
[Activity(Label = "Demo02GridLayout")]
public class Demo02GridLayout : Activity
{
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
SetContentView(Resource.Layout.Demo02GridLayout);
}
}
}

运行观察效果。

【Android】7.3 GridLayout(网格布局)的更多相关文章

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

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

  2. Android零基础入门第32节:新推出的GridLayout网格布局

    原文:Android零基础入门第32节:新推出的GridLayout网格布局 本期主要学习的是网格布局是Android 4.0新增的布局,和前面所学的TableLayout表格布局 有点类似,不过他有 ...

  3. Android之GridLayout网格布局

    1.相关属性 GridLayout网格布局是4.0之后引入的布局方式! android:columnCount="4" //设置列数(4列) android:rowCount=&q ...

  4. GridLayout(网格布局)

    常用属性: 排列对齐: ①设置组件的排列方式:  android:orientation=""     vertical(竖直,默认)或者horizontal(水平) ②设置组件的 ...

  5. android的布局-----GridLayout(网格布局)

    学习导图 (一)简介 网格布局由GridLayout所代表,在android4.0之后新增加的布局管理器,因此需要android4.0之后的版本中使用,如果在更早的平台使用该布局管理器,则需要导入相应 ...

  6. GridLayout网格布局

    网格布局特点: l  使容器中的各组件呈M行×N列的网格状分布. l  网格每列宽度相同,等于容器的宽度除以网格的列数. l  网格每行高度相同,等于容器的高度除以网格的行数. l  各组件的排列方式 ...

  7. Android——gridLayout(网格布局)

    <?xml version="1.0" encoding="utf-8"?> <GridLayout xmlns:android=" ...

  8. java 图形化小工具Abstract Window Toolit ;布局管理器FlowLayout流式布局;BorderLayout边界布局;GridLayout网格布局;CardLayou重叠卡片布局;BoxLayout方框布局;绝对定位

    1.FlowLayout流式布局管理器: FlowLayout布局管理器中,组件像水流一样向某方向流动(排列),遇到障碍(边界)就折回,重头开始排列 .在默认情况下,FlowLayout局管理器从左向 ...

  9. 浅谈GridLayout(网格布局)

    Android 4.0 布局-->GridLayout 网格布局 以行列单元格的形式展示内部控件排列,可以实现类似计算机键盘效果 ,也可以实现可自动变行的标签群效果 使用GridLayout , ...

  10. Android学习笔记④——页面的布局方式

    FrameLayout(帧布局) 这个布局的特点是简单的默认把每一个视图组件都放在边框内且放在左上角,即使添加多个视图组件,他们也都是重叠在左上角,新的视图会遮挡住旧的视图.可以根据gravity来改 ...

随机推荐

  1. ArcEngine开发各种几何错误代码

    E_GEOMETRY_AMBIGUOUSPARTTYPE - Static variable in interface com.esri.arcgis.geometry.esriGeometryErr ...

  2. Mac Oracle SqlDeveloper 快捷输入

    用惯了 plsql 的快捷输入,换了 Mac Oracle SqlDeveloper反倒是找不到了,翻出去找了几次终于找到 SqlDeveloper -- preferences -- 数据库(dat ...

  3. ThinkCMF X2.2.2多处SQL注入漏洞分析

       1.     漏洞描述 ThinkCMF是一款基于ThinkPHP+MySQL开发的中文内容管理框架,其中X系列基于ThinkPHP 3.2.3开发,最后更新到2.2.2版本.最近刚好在渗透测试 ...

  4. 很不错标签云js插件

    在蓝色看到有需要标签云的球形效果,我记得之前在网上见到过,印象比较深刻,就找出地址发给他了,接下来却还有人需要这个效果的JQuery插件,网上好像也有,但是我看现在这个就不错,就想想自己改成jquer ...

  5. 基于jquery的锚点滚动插件(百度百科效果) anchorScroll.js

    1.插进使用场景 请打开https://baike.baidu.com/item/%E6%97%A5%E6%9C%AC%E5%8A%A8%E7%94%BB#hotspotmining,查看百度百科页面 ...

  6. 〖Android〗/system/etc/event-log-tags

    一博客中,一段的注释的解释:[From: http://blog.csdn.net/hustpzb/article/details/8525324] /** * Access to the syste ...

  7. 小程序九:导航&地图&画布

    navigator 导航 属性名 类型 默认值 说明 url String   应用内的跳转链接 redirect Boolean false 是否关闭当前页面 hover-class String ...

  8. highstock使用案例(异步请求,懒加载)

    jsp中导入:<script src="<c:url value="/resources/js/highstock.js"></c:url> ...

  9. ContactsContract.Contacts之sort_key

    // 从Contacts表中找出所有联系人 Cursor cursor = context.getContentResolver().query(         ContactsContract.C ...

  10. What is the difference between J2EE and Spring

    来自于:https://www.quora.com/What-is-the-difference-between-J2EE-and-Spring Lot of people specially tho ...