指定列跨度和行跨度时 GridLayout 的工作原理答案

【问题标题】：How GridLayout works when specifying the columnspan and rowspan指定列跨度和行跨度时 GridLayout 的工作原理
【发布时间】：2015-10-21 14:31:01
【问题描述】：

我在一个 Android 项目中为我的列表视图做了一个布局设计。是这样的；

我已经阅读并研究了其他 gridlayout 示例，并且我已经按照我的要求编写了这个 xml。

<?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:background="@drawable/card_background"
    android:columnCount="30"
    android:orientation="horizontal"
    android:rowCount="6"
    android:id="@+id/grid_layout_notification">

    <com.ei.dizitakip.android.CircledNetworkImageView
        android:id="@+id/fancy_notification_thumbnail"
        android:layout_columnSpan="5"
        android:layout_rowSpan="6"
        />

    <TextView
        android:layout_columnSpan="25"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:id="@+id/fancy_title"
        android:textColor="@color/color_primary_dark" />

    <ImageView
        android:layout_columnSpan="2"
        android:id="@+id/fancy_season_icon"
        android:src="@mipmap/season_icon"
        android:background="@android:color/transparent"
         />

    <TextView
        android:layout_columnSpan="10"
        android:id="@+id/fancy_status_text"
        android:gravity="center_vertical" />

    <ImageView
        android:layout_columnSpan="2"
        android:id="@+id/fancy_domain_icon"
        android:src="@mipmap/www_icon"
        android:background="@android:color/transparent"
        />

    <TextView
        android:layout_columnSpan="11"
        android:id="@+id/fancy_domain_text"
        android:gravity="center_vertical" />

</GridLayout>

您已经意识到代码与设计相差甚远。我对 GridLayouts 缺少什么？这是我第一次使用它，我对 LinearLayout 的 layout_weight 使用了相同的方法。非常感谢任何代码示例、方法或技术。

【问题讨论】：

指定您的问题。将您的布局视为表格。使用 columnspan 可以告诉布局视图元素应该显示多少列，使用 rowspan 可以定义视图应该在表中显示多少行。
其实我也是这么想的。但是，它不像我想的那样工作:)我不明白，也许网格的大小不相等。你能提供上面例子中的任何样本吗？
“它不起作用”是什么意思？基本上它有效。为了让设计与图片中的一样，您必须指定一些边距和填充，尤其是左侧图像应具有“android:layout_gravity="center""
嗯，它有效，但结果不是我想要的结果。左图覆盖了整个屏幕，其他元素不可见。几乎每个网格布局都使用 layout_gravity。其背后的逻辑是什么？

标签： android xml android-gridlayout

【解决方案1】：

您应该使用 android:layout_gravity 来指定网格的大小。这是来自 Android 开发者博客的示例

为了实现这个设计；

代码；

<?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 few steps:"
            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>

您还需要使用<Space> 标签来实现您的设计。

【讨论】：