Question

我想制作如下所示的网格布局： enter image description here

并且这样做我的布局就像这样。

<GridLayout
    android:id="@+id/glColumns"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/tvIntro" 
    android:layout_marginRight="43dp"
    android:layout_marginTop="3dp"
    android:columnCount="4"
    android:rowCount="6"
    android:layout_toRightOf="@+id/tvLink1"
     >

    <LinearLayout
        android:id="@+id/rlColumn1"
        android:layout_width="wrap_content"
        android:layout_marginRight="3dp"
        android:orientation="vertical"
        android:background="@color/button_bg"
        android:layout_row="0"
        android:layout_column="0"
        android:layout_rowSpan="3"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/tvPassengerInt"
            style="@style/subInfoInt"
            android:text="@string/passenger_int" />

        <TextView
            android:id="@+id/tvPassengerText"
            style="@style/subInfo"
            android:text="@string/passenger" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/rlColumn2"
        android:layout_height="wrap_content"
        android:layout_row="0"
        android:layout_column="1"
        android:layout_columnSpan="2"
        android:layout_rowSpan="3"
        android:layout_marginRight="3dp"
        android:background="@color/button_bg"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/tvPassengerInts"
            style="@style/subInfoInt"
            android:layout_width="match_parent"
            android:text="@string/passenger_int" />

        <TextView
            android:id="@+id/tvPassengerTexts"
            style="@style/subInfo"
            android:layout_width="match_parent"
            android:text="@string/passenger" />

    </LinearLayout>

    <LinearLayout
        android:id="@+id/rlColumn3"
        android:layout_width="wrap_content"
        android:layout_marginRight="3dp"
        android:orientation="vertical"
        android:layout_rowSpan="2"
        android:background="@color/button_bg"
        android:layout_row="0"
        android:layout_column="3"

        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/tvPassengerInt2s"
            style="@style/subInfoInt"
            android:text="71,000" />

        <TextView
            android:id="@+id/tvPassengerText2s"
            style="@style/subInfo"
            android:text="STRUCTURES" />
    </LinearLayout>


    <!-- ========================================================== -->

    <LinearLayout
        android:layout_marginTop="3dp"
        android:id="@+id/rlColumn11"
        android:layout_width="wrap_content"
        android:layout_marginRight="3dp"
        android:orientation="vertical"
        android:background="@color/button_bg"
        android:layout_row="3"
        android:layout_column="0"
        android:layout_rowSpan="3"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/tvPassengerInt11"
            style="@style/subInfoInt"
            android:text="@string/passenger_int" />

        <TextView
            android:id="@+id/tvPassengerText1"
            style="@style/subInfo"
            android:text="@string/passenger" />
    </LinearLayout>

    <LinearLayout
        android:layout_marginTop="3dp"
        android:id="@+id/rlColumn21"
        android:layout_width="wrap_content"
        android:layout_marginRight="3dp"
        android:orientation="vertical"
        android:layout_row="3"
        android:layout_column="1"
        android:layout_rowSpan="3"
        android:background="@color/button_bg"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/tvPassengerInts1"
            style="@style/subInfoInt"
            android:text="@string/passenger_int" />

        <TextView
            android:id="@+id/tvPassengerTexts1"
            style="@style/subInfo"
            android:text="@string/passenger" />
    </LinearLayout>

    <LinearLayout
        android:layout_marginTop="3dp"
        android:id="@+id/rlColumn211"
        android:layout_width="wrap_content"
        android:layout_marginRight="3dp"
        android:orientation="vertical"
        android:layout_row="3"
        android:layout_column="2"
        android:layout_rowSpan="3"
        android:background="@color/button_bg"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/tvPassengerIntss1"
            style="@style/subInfoInt"
            android:text="@string/passenger_int" />

        <TextView
            android:id="@+id/tvPassengerTextss1"
            style="@style/subInfo"
            android:text="@string/passenger" />
    </LinearLayout>

    <LinearLayout
        android:layout_marginTop="3dp"
        android:id="@+id/rlColumn31"
        android:layout_width="wrap_content"
        android:layout_marginRight="3dp"
        android:layout_row="2"
        android:layout_column="3"
        android:layout_rowSpan="2"
        android:orientation="vertical"
        android:background="@color/button_bg"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/tvPassengerInt2s1"
            style="@style/subInfoInt"
            android:text="170" />

        <TextView
            android:id="@+id/tvPassengerText2s1"
            style="@style/subInfo"
            android:text="CITIES" />
    </LinearLayout>

    <!-- ========================================================== -->

    <LinearLayout
        android:layout_marginTop="3dp"
        android:id="@+id/rlColumn311"
        android:layout_width="wrap_content"
        android:layout_marginRight="3dp"
        android:layout_row="4"
        android:layout_column="3"
        android:layout_rowSpan="2"
        android:orientation="vertical"
        android:background="@color/button_bg"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/tvPassengerInt2s1s"
            style="@style/subInfoInt"
            android:text="30" />

        <TextView
            android:id="@+id/tvPassengerText2s1s"
            style="@style/subInfo"
            android:text="YEARS EXPERIENCE" />
    </LinearLayout>

</GridLayout>

我得到了所需的输出但不完美。图中提到了错误。输出如下： enter image description here

空间管理不当，行和列跨度也不合适

我是如何尝试这样做的::::

enter image description here

Answer 1

请检查链接。这些是用于创建自定义网格视图的外部库

https://github.com/maurycyw/StaggeredGridViewDemo

https://github.com/etsy/AndroidStaggeredGrid

https://github.com/jacobmoncur/QuiltViewLibrary

在Android中完美的GridLayout

1 个答案: