android - 内部带有 ImageView 的 TableLayout

Question

我是android新手，还在学习。我正在尝试使我的活动布局类似于下图。

我想像下面一样使用 TableLayout

<?xml version="1.0" encoding="utf-8"?>
<TableLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/table_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TableRow
        android:id="@+id/row_1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="4dp"
        android:background="#ed8404">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:adjustViewBounds="true"
            android:gravity="center"
            android:scaleType="fitCenter"
            android:src="@drawable/image1" />
    </TableRow>


    <TableRow
        android:id="@+id/row_2"
        android:weightSum="2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="2dp">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginRight="2dp"
            android:layout_weight="1"
            android:gravity="center"
            android:adjustViewBounds="true"
            android:scaleType="fitCenter"
            android:src="@drawable/image1"/>

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:scaleType="fitCenter"
            android:adjustViewBounds="true"
            android:src="@drawable/image1" />

    </TableRow>


    <TableRow
        android:id="@+id/row_3"
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:layout_marginTop="4dp"
        android:background="#ed8404">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:adjustViewBounds="true"
            android:src="@drawable/image1"/>
    </TableRow>

    <TableRow
        android:layout_weight="1"
        android:id="@+id/row_4"
        android:weightSum="2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="2dp">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginRight="2dp"
            android:layout_weight="1"
            android:gravity="center"
            android:adjustViewBounds="true"
            android:scaleType="fitCenter"
            android:src="@drawable/image1"/>

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:scaleType="fitCenter"
            android:adjustViewBounds="true"
            android:src="@drawable/image1" />

    </TableRow>
</TableLayout>

但我无法在所有图像上固定适当的高度。它看起来像这张图片。

让我知道是否有人可以帮助我解决问题。我希望所有图像都适合查看并具有相同的高度。非常感谢。

标签： androidandroid-layout

Answer 1

当您的元素多于屏幕无法容纳时，您必须使用RecyclerView（使用不同ViewHolder的 s）。

如果您有固定数量的元素，您可以使用它LinearLayout来降低嵌套级别：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/table_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:background="#F0F"
        android:gravity="center"
        android:scaleType="fitCenter" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:adjustViewBounds="true"
            android:background="#0FF"
            android:gravity="center"
            android:scaleType="fitCenter" />

        <ImageView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:adjustViewBounds="true"
            android:background="#FF0"
            android:gravity="center"
            android:scaleType="fitCenter" />

    </LinearLayout>

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:background="#00F"
        android:gravity="center"
        android:scaleType="fitCenter" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:adjustViewBounds="true"
            android:background="#0F0"
            android:gravity="center"
            android:scaleType="fitCenter" />

        <ImageView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:adjustViewBounds="true"
            android:background="#F00"
            android:gravity="center"
            android:scaleType="fitCenter" />

    </LinearLayout>

</LinearLayout>

您可以期待输出：