GridLayout和行/列跨度

121

在Android开发者博客文章介绍GridLayout节目的跨度如何影响自动索引分配这个图：

自动索引分配

我正在尝试实际使用实现GridLayout。这是我到目前为止的内容：

<android.support.v7.widget.GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res/com.commonsware.android.gridlayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    app:orientation="horizontal"
    app:columnCount="8">

    <Button
        app:layout_columnSpan="2"
        app:layout_rowSpan="2"
        android:layout_gravity="fill_horizontal"
        android:text="@string/string_1"/>

  <Button
    app:layout_columnSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="@string/string_2"/>

  <Button
    app:layout_rowSpan="4"
    android:text="@string/string_3"/>

  <Button
    app:layout_columnSpan="3"
    app:layout_rowSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="@string/string_4"/>

  <Button
    app:layout_columnSpan="3"
    android:layout_gravity="fill_horizontal"
    android:text="@string/string_5"/>

  <Button
    app:layout_columnSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="@string/string_6"/>

  <android.support.v7.widget.Space
    app:layout_column="0"
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

</android.support.v7.widget.GridLayout>

我必须引入<Space>元素以确保每列具有最小宽度，否则，我将有一堆零宽度的列。

但是，即使有了它们，我也会得到：

样本GridLayout

值得注意的是：

  • 尽管如此android:layout_gravity="fill_horizontal"，我的具有列跨度的窗口小部件未填充跨度列

  • 尽管有这些android:layout_rowSpan值，但没有任何内容可以跨越行

任何人都可以使用来从博客文章中复制图表GridLayout吗？

谢谢！

android  android-gridlayout 
— 常用软件
source
178
我猜想你甚至都会问问题:)
— StackOverflowed 2012年

Answers:

76

感觉很hacky，但是我设法通过添加超出所需的额外的行和列来获得正确的外观。然后，我在额外的列中用每行定义一个高度的空格填充，并在额外的行中用每行定义一个宽度的空格填充。为了获得更大的灵活性，我认为可以在代码中设置这些Space大小以提供类似于权重的内容。我试图添加屏幕截图，但是我没有必要的声誉。

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnCount="9"
android:orientation="horizontal"
android:rowCount="8" >

<Button
    android:layout_columnSpan="2"
    android:layout_gravity="fill"
    android:layout_rowSpan="2"
    android:text="1" />

<Button
    android:layout_columnSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="2" />

<Button
    android:layout_gravity="fill_vertical"
    android:layout_rowSpan="4"
    android:text="3" />

<Button
    android:layout_columnSpan="3"
    android:layout_gravity="fill"
    android:layout_rowSpan="2"
    android:text="4" />

<Button
    android:layout_columnSpan="3"
    android:layout_gravity="fill_horizontal"
    android:text="5" />

<Button
    android:layout_columnSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="6" />

<Space
    android:layout_width="36dp"
    android:layout_column="0"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="1"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="2"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="3"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="4"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="5"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="6"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="7"
    android:layout_row="7" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="0" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="1" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="2" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="3" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="4" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="5" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="6" />

</GridLayout>

屏幕截图

— 克图尼
source
7
好吧，恕我直言，与迄今为止提供的其他解决方案相比，它的hacky越来越少-至少在这里，硬性尺寸是其中的Space要素。我为以后的读者添加了屏幕截图。谢谢！
— CommonsWare，2012年
为什么rowCount设置为8？我们需要4行（最大的行的大小rowSpan）加上额外的一行，Space因此应该是5行。我缺少什么？
— curioustechizen
我只是回答了原始问题中图片的行数和列数（其本身来自Android开发博客文章）。然后，我在行数和列数上加1，以为外部边界空间腾出空间。它也应该只用5行就可以了。
— kturney
5
我发现此解决方案仅适用<Gridlayout>于<android.support.v7.widget.GridLayout>
— Didia
我如何动态设置row_span和column span ...它将起作用？
17 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <GridLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:columnCount="8"
        android:rowCount="7" >

        <TextView
            android:layout_width="50dip"
            android:layout_height="50dip"
            android:layout_columnSpan="2"
            android:layout_rowSpan="2"
            android:background="#a30000"
            android:gravity="center"
            android:text="1"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="50dip"
            android:layout_height="25dip"
            android:layout_columnSpan="2"
            android:layout_rowSpan="1"
            android:background="#0c00a3"
            android:gravity="center"
            android:text="2"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="25dip"
            android:layout_height="100dip"
            android:layout_columnSpan="1"
            android:layout_rowSpan="4"
            android:background="#00a313"
            android:gravity="center"
            android:text="3"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="75dip"
            android:layout_height="50dip"
            android:layout_columnSpan="3"
            android:layout_rowSpan="2"
            android:background="#a29100"
            android:gravity="center"
            android:text="4"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="75dip"
            android:layout_height="25dip"
            android:layout_columnSpan="3"
            android:layout_rowSpan="1"
            android:background="#a500ab"
            android:gravity="center"
            android:text="5"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="50dip"
            android:layout_height="25dip"
            android:layout_columnSpan="2"
            android:layout_rowSpan="1"
            android:background="#00a9ab"
            android:gravity="center"
            android:text="6"
            android:textColor="@android:color/white"
            android:textSize="20dip" />
    </GridLayout>

</RelativeLayout>

屏幕截图

— 处理程序
source
2
谢谢！有趣的是，如果我GridLayout从Android支持包切换到，布局会中断，这表明两者并不完全兼容。另外，我真的希望有一种方法可以解决此问题，而不会涉及小尺寸的硬接线。我会稍微介绍一下，看看还有什么其他答案（如果有），但是如果没有更好的答案，我会接受您的回答。再次感谢！
— CommonsWare，2012年
4
“如果我从Android支持包切换到GridLayout，布局就会中断” –实际上，这是我的错，没有使用backport的XML名称空间将所需的android:属性转换为app:。它与反向端口一起工作。
— CommonsWare，2012年
我找到了一种动态调整其中一些大小的方法，但是只有在相邻视图已经定义了列或行的整个宽度时才可以使用。我不认为它们的工作原理像权重一样，并根据定义的跨度平均分配空间。它并不完美，但是可以完美满足我当前项目中的需求。
— HandlerExploit 2012年
好吧，您的示例更像是AbsoluteLayout的方法与RelativeLayout的方法混合在一起，不是吗？这既不是动态的也不是可移植的。为什么为此需要精确的GridLayout？不管怎么说，GridLayout是残破的还是未完成的……
— Bondax
@Bondax此实现在高度，宽度，列宽和列跨度中明确定义了网格项。当为网格定义了不同的宽度（屏幕宽度）时，网格布局将使网格项在有限的空间内浮动。这是项目的要求，并且可以完美解决此问题。
— HandlerExploit 2013年
6

您必须在列上同时设置layout_gravity和layout_columntWeight

<android.support.v7.widget.GridLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView android:text="سوم شخص"
        app:layout_gravity="fill_horizontal"
        app:layout_columnWeight="1"
        />

    <TextView android:text="دوم شخص"
        app:layout_gravity="fill_horizontal"
        app:layout_columnWeight="1"
        />

    <TextView android:text="اول شخص"
        app:layout_gravity="fill_horizontal"
        app:layout_columnWeight="1"
        />
 </android.support.v7.widget.GridLayout>
— 侯赛因·沙杜斯特（Hossein Shahdoost）
source
2

Android支持V7 GridLayout库通过适应重量原理使多余的空间分配变得容易。要拉伸列，请确保其中的组件定义了重量或重力。为防止色谱柱拉伸，请确保色谱柱中的一个组件未定义重量或重力。记住要为此库添加依赖项。在build.gradle中添加com.android.support:gridlayout-v7:25.0.1。

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:columnCount="2"
app:rowCount="2">

<TextView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="First"
    app:layout_columnWeight="1"
    app:layout_rowWeight="1" />

<TextView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="Second"
    app:layout_columnWeight="1"
    app:layout_rowWeight="1" />

<TextView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="Third"
    app:layout_columnWeight="1"
    app:layout_rowWeight="1" />

<TextView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"        
    app:layout_columnWeight="1"
    app:layout_rowWeight="1"
    android:text="fourth"/>

</android.support.v7.widget.GridLayout>
— Permita
source
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.