前言

在實際的項目開發(fā)過程中，經(jīng)常遇到一類需求，就是在ScrollView或是ListView中添加不固定高度的列表或?qū)m格視圖，如果直接添加ListView或是GridView，則會出現(xiàn)視圖展示不全的問題，常用兩種方式來解決：
1、重寫ListView或是GridView的onMeasure方法，實現(xiàn)一個根據(jù)數(shù)據(jù)動態(tài)變化的固定高組件
2、自定義組件，實現(xiàn)能夠根據(jù)數(shù)據(jù)動態(tài)組裝的列表或?qū)m格功能

從android4.0開始系統(tǒng)提供了一個組件GridLayout來實現(xiàn)類似的功能。

使用

xml文件中的定義

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:columnCount="3"
    android:orientation="horizontal"
    android:rowCount="1">
    <Button
        android:id="@+id/one"
        android:text="1-1"/>
    <Button
        android:id="@+id/two"
        android:text="1-2"/>
    <Button
        android:id="@+id/three"
        android:text="1-3"/>
</GridLayout>

android:columnCount="3"設(shè)置有幾列
android:rowCount="1"設(shè)置有幾行
android:orientation="horizontal"設(shè)置布局方向為水平布局
效果：

Paste_Image.png

如果設(shè)置為垂直方向布局android:orientation="vertical"

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:columnCount="1"
    android:orientation="vertical"
    android:rowCount="3">
    <Button
        android:id="@+id/one"
        android:text="1-1"/>
    <Button
        android:id="@+id/two"
        android:text="1-2"/>
    <Button
        android:id="@+id/three"
        android:text="1-3"/>
</GridLayout>

效果：

Paste_Image.png

如果希望一個組件占用多列可以設(shè)置android:layout_columnSpan，并設(shè)置android:layout_gravity="fill"

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:columnCount="3"
    android:orientation="horizontal">
    <Button
        android:id="@+id/one"
        android:text="1-1"
        />
    <Button
        android:id="@+id/two"
        android:text="1-2"/>
    <Button
        android:id="@+id/three"
        android:text="1-3"/>
    <Button
        android:layout_columnSpan="2"
        android:layout_gravity="fill"
        android:text="2-1"
        />
    <Button
        android:text="2-2"/>
</GridLayout>

效果：

Paste_Image.png

還可以通過設(shè)置android:layout_column，android:layout_row設(shè)置子組件的位置，

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:columnCount="2">
    <Button
        android:id="@+id/two"
        android:text="1-2"/>
    <Button
        android:id="@+id/three"
        android:text="1-3"/>
    <Button
        android:id="@+id/one"
        android:text="1-1"
       android:layout_column="1"
        android:layout_row="2"
        />
</GridLayout>

Paste_Image.png

如果希望每一行的子組件等分布局，可以使用android:layout_columnWeight="1"，android:layout_rowWeight="1"，
但是只支持sdk>=21的系統(tǒng)版本。
要在小于21版本的系統(tǒng)中使用需要使用支持包中的GridLayout，
compile 'com.android.support:gridlayout-v7:23.3.0'

<android.support.v7.widget.GridLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content" 
   app:orientation="horizontal"
    app:columnCount="3"    >
    <Button
        android:id="@+id/two"
        android:text="1-2" 
       app:layout_columnWeight="1"
        android:layout_width="wrap_content"/>
    <Button
        android:id="@+id/three"
        android:text="1-3"
        app:layout_columnWeight="1" 
       android:layout_width="wrap_content"/>
    <Button
        android:id="@+id/one"
        android:text="1-1" 
       app:layout_columnWeight="1"
        android:layout_width="wrap_content"        />
</android.support.v7.widget.GridLayout>

Paste_Image.png

結(jié)束語

GridLayout使用過程中經(jīng)常會出現(xiàn)GridLayout設(shè)置的屬性與子組件設(shè)置屬性沖突導(dǎo)致展示效果與預(yù)期不符，甚至出現(xiàn)加載異常的問題，還需要在實踐中慢慢體會。