gridlayout

最新推荐文章于 2024-05-17 14:20:48 发布

黄建299

最新推荐文章于 2024-05-17 14:20:48 发布

阅读量397

点赞数

文章标签： layout 布局 gridlayout 界面

本文链接：https://blog.csdn.net/hjj4610123/article/details/37763937

版权

在android4.0版本之前，如果想要达到网格布局的效果，首先可以考虑使用最常见的LinearLayout布局，但是这样的排布会产生如下几点问题：

1、不能同时在X，Y轴方向上进行控件的对齐。

2、当多层布局嵌套时会有性能问题。

3、不能稳定地支持一些支持自由编辑布局的工具。

其次考虑使用表格布局TabelLayout，这种方式会把包含的元素以行和列的形式进行排列，每行为一个TableRow对象，也可以是一个View 对象，而在TableRow中还可以继续添加其他的控件，每添加一个子控件就成为一列。但是使用这种布局可能会出现不能将控件占据多个行或列的问题，而且渲染速度也不能得到很好的保证。

android4.0以上版本出现的GridLayout布局解决了以上问题。GridLayout布局使用虚细线将布局划分为行、列和单元格，也支持一个控件在行、列上都有交错排列。而GridLayout使用的其实是跟LinearLayout类似的API，只不过是修改了一下相关的标签而已，所以对于开发者来说，掌握GridLayout还是很容易的事情。GridLayout的布局策略简单分为以下三个部分：

首先它与LinearLayout布局一样，也分为水平和垂直两种方式，默认是水平布局，一个控件挨着一个控件从左到右依次排列，但是通过指定android:columnCount设置列数的属性后，控件会自动换行进行排列。另一方面，对于GridLayout布局中的子控件，默认按照wrap_content的方式设置其显示，这只需要在GridLayout布局中显式声明即可。

其次，若要指定某控件显示在固定的行或列，只需设置该子控件的android:layout_row和android:layout_column属性即可，但是需要注意：android:layout_row=”0”表示从第一行开始，android:layout_column=”0”表示从第一列开始，这与编程语言中一维数组的赋值情况类似。

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

利用GridLayout布局编写的简易计算器代码如下（注意：仅限于android4.0及以上的版本）：

[html] view plain copy

<?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="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>

最终实现的界面如下所示：

<?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:useDefaultMargins="true"
        android:alignmentMode="alignBounds"
        android:columnOrderPreserved="false"
        android:columnCount="4"
        >
    <TextView
            android:text="Email setup"
            android:textSize="32dip"
            android:layout_columnSpan="4"
            android:layout_gravity="center_horizontal"
            />
    <TextView
            android:text="You can configure email in just a fewsteps:"
            android:textSize="16dip"
            android:layout_columnSpan="4"
            android:layout_gravity="left"
            />
    <TextView
            android:text="Email address:"
            android:layout_gravity="right"
            />
    <EditText
            android:ems="10"
            />
    <TextView
            android:text="Password:"
            android:layout_column="0"
            android:layout_gravity="right"
            />
    <EditText
            android:ems="8"
            />
    <Space
            android:layout_row="4"
            android:layout_column="0"
            android:layout_columnSpan="3"
            android:layout_gravity="fill"
            />
    <Button
            android:text="Next"
            android:layout_row="5"
            android:layout_column="3"
            />
</GridLayout>

　　在上面的代码中，要注意的是在GridLayout 布局中，已经不需要使用WRAP_CONTENT和MATCH_PARENT等属性了。要注意的是，在上面的代码中，并没有显式地说明哪个控件摆放在什么单元格，每一个控件其实是使用了layout_columnSpan及rowSpan或columnSpan去指定其相关的位置和宽度。如在上述代码中，首先用

　　android:columnCount="4"指定了有4列，列的编号注意从左到右，第一列是0，如此类推。行的编号从上到下，序号也是从0开始。比如上图界面中的最下方的按钮，使用

　　android;layout_row=”5”及android:layout_column=’3”指定了其按钮的位置位于第6行第4列。

　　而space是Android 4.0中新增的一个控件，它实际上可以用来分隔不同的控件，其中形成一个空白的区域。这个例子中，同样通过android:layout_row及android:layout_column指定了其起始位置。

　　下面再看一个例子，代码如下：

    <?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="wrap_content"
    android:columnCount="4"
    android:rowCount="4" >
    <TextView
        android:text="1,1" />
    <TextView
        android:text="1,2" />
    <TextView
        android:text="1,3" />
    <TextView
        android:text="1,4" />
    <TextView
        android:text="2,1" />
    <TextView
        android:text="2,2" />
    <TextView
        android:text="2,3" />
    <TextView
        android:text="2,4" />
    <TextView
        android:text="3,1" />
    <TextView
        android:text="3,2" />
    <TextView
        android:text="3,3 longer" />
    <TextView
        android:text="3,4" />
    <TextView
        android:text="4,1" />
    <TextView
        android:text="4,2" />
    <TextView
        android:text="4,3" />
    <TextView
        android:text="4,4" />
</GridLayout>

　　运行结果如下图所示：

　　可以看到，在gridlayout中，默认的布局是水平方向的，即将控件从左到右，从上到下进行排列，比如上图中的文本“1，2”即放置在第1行第2列中，如此类推。可以看到，其中的文本“3，3”的位置是拉伸了没跟其他控件对齐，要实现控件间的对齐，可以通过

　　设置android:layout_gravity=”fill_horizontal”，代码如下：

     <?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="wrap_content"
    android:columnCount="4"
    android:rowCount="4" >
    .
    .
    .
    <TextView
        android:layout_gravity="fill_horizontal"
        android:text="1,3" />
    .
    .
    .
    <TextView
        android:layout_gravity="fill_horizontal"
        android:text="2,3" />
    .
    .
    .
    <TextView
        android:layout_gravity="fill_horizontal"
        android:text="3,3 longer" />
    .
    .
    .
    <TextView
        android:layout_gravity="fill_horizontal"
        android:text="4,3" />
</GridLayout>

　　运行结果如下图：

　　如果需要使用垂直的布局，可以设定android:orientation="vertical"，如下代码：

　　运行结果如下图：

　　可以看到,这次的控件排列顺序是先从上到下排列,比如“1，2”文本框位于“1，1”的下方，如此类推。要注意一点时，如果在 gridviewlayout布局中，显式指定某一个控件位于哪一行哪一列(通过使用layout_row或者layout_column),要注意其后的布局的控件则会跟随着位置移动，比如如下的代码：

　　运行效果如下图：

　　可以看到，由于文本控件“1，3”被设置成android:layout_row="1"，所以该控件被移动到第2行(注意layout_row的序号从0开始)，而其他各控件的位置也相对偏移了。

　　接下来，我们看下其中的layout_gravity属性和gravity属性。例子如下代码：

　　再运行，可以看到运行结果如下：

　　可以看到，这次文本控件通过使用android:layout_gravity=”fill”,成功地伸展充满了被包含的父控件。如果要让文字“1，3”放置在单元格的正中央的话，可以再通过如下代码设置;

　　android:layout_gravity="fill"

　　android:gravity="center"

　　android:layout_rowSpan="2"

　　android:text="1,3"/>

　　运行后如下图：

　　可以看到，要让文字居中，只需要设置 android:gravity="center"属性即可。

　　最后，我们来看下一个例子，在这个例子中，分别用LinearLayout和GridLayout布局，实现了同样的功能，代码如下：

　　运行后，结果如下图：

　　在这个例子中，可以看到，gridlayout比较简单方便，效率也高，性能比普通的Linearlayout要好，因为 Linearlayout有时要涉及到多层的嵌套，影响渲染性能。

　　小结

　　在本文中，简要介绍了在Android 4.0中新增的Gridviewlayout布局的基本使用知识和技巧。Gridviewlayout布局由于其简单易用的特点，因此建议开发者在设计布局时，优先考虑使用，避免使用多层嵌套的布局。目前该布局只能在4.0中使用，据说不久的将来将会在补充支持包中能增加让低版本的Android SDK支持gridviewlayout布局的功能。

黄建299

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
gridlayout

在android4.0版本之前，如果想要达到网格布局的效果，首先可以考虑使用最常见的LinearLayout布局，但是这样的排布会产生如下几点问题： 1、不能同时在X，Y轴方向上进行控件的对齐。2、当多层布局嵌套时会有性能问题。3、不能稳定地支持一些支持自由编辑布局的工具。其次考虑使用表格布局TabelLayout，这种方式会把包含的元素以行和列的形式进行排
复制链接

扫一扫