Question

我在LinearLayout中有一个TableLayout，它是一个4x4网格。我希望每个单元格都是正方形，我希望根据屏幕大小（或者更确切地说分配给TableLayout的大小）来缩放大小。我总是希望屏幕上显示所有12个方块。基本上我希望每个ImageView的layout_height和layout_wight值是父值的1/4。现在我只是将它们设置为100dp。我需要对layout_weight值做些什么吗？

编辑：好的，所以对我所有layout_weight="1"个对象使用ImageView我可以将宽度全部变为可用空间的1/4，但现在它们的高度为0。如何才能使高度也是layout_weight？

的函数

这是我的XML：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.package.name.MainActivity">

    <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/tableLayout1"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <!-- 1st row -->
        <TableRow
            android:id="@+id/tableRow1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="5dip" >

            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorAccent"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorPrimary"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorAccent"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorPrimary"/>

        </TableRow>

        <!-- 2nd row -->
        <TableRow
            android:id="@+id/tableRow2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="5dip" >

            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorPrimary"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorAccent"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorPrimary"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorAccent"/>

        </TableRow>


        <!-- 3rd row -->
        <TableRow
            android:id="@+id/tableRow3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="5dip" >

            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorAccent"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorPrimary"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorAccent"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorPrimary"/>

        </TableRow>

        <!-- 4th row -->
        <TableRow
            android:id="@+id/tableRow4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="5dip" >

            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorPrimary"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorAccent"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorPrimary"/>
            <ImageView
                android:layout_height="100dp"
                android:layout_width="100dp"
                android:src="@color/colorAccent"/>

        </TableRow>

    </TableLayout>


</LinearLayout>

看起来像这样，最右边的列没有完全显示。我意识到这是因为我将它们都设置为100dp，但只是想知道我目前所处的位置：

Answer 1

您可以使用1android:stretchColumns="*"

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/tableLayout1"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:stretchColumns="*">
</TableLayout>

您可以使用LinearLayout。

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:id="@+id/tableLayout1"
              android:layout_width="match_parent"
              android:layout_height="wrap_content">

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorAccent"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorPrimary"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorAccent"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorPrimary"/>

</LinearLayout>

<!-- 2nd row -->
<LinearLayout
    android:id="@+id/tableRow2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"

        android:src="@color/colorPrimary"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorAccent"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorPrimary"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorAccent"/>

</LinearLayout>


<!-- 3rd row -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:id="@+id/tableLayout3"
              android:layout_width="match_parent"
              android:layout_height="wrap_content">

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorAccent"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorPrimary"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorAccent"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorPrimary"/>

</LinearLayout>

<!-- 4th row -->
<LinearLayout
    android:id="@+id/tableRow4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"

        android:src="@color/colorPrimary"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorAccent"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorPrimary"/>

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_weight="1"
        android:src="@color/colorAccent"/>
</LinearLayout>
</LinearLayout>

如何根据屏幕大小调整表格布局中的元素？

1 个答案: