Question

我遇到GridLayout问题。在下面的布局中，phone_image和voip_image重叠，我不想要它们。 phone_image在第0列，voip_image在第2列。

Github上的SSCCE https://github.com/emnrd-ito/LayoutDemo

<HorizontalScrollView
    android:id="@+id/container_scroll_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <GridLayout xmlns:mapbox="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/individual_gridlayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:alignmentMode="alignBounds"
        android:columnCount="4"
        android:columnOrderPreserved="false"
        android:rowCount="7">

        <ImageView
            android:id="@+id/division_logo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_columnSpan="3"
            android:layout_margin="10dp"
            android:layout_row="0"
            android:layout_rowSpan="3"
            android:background="@null"
            android:layout_gravity="center_horizontal"
            android:src="@mipmap/ic_launcher" />

        <TextView
            android:id="@+id/employee_name"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_column="3"
            android:layout_margin="10dp"
            android:layout_row="0"
            android:text="Nobody Lastname"
            tools:text="name" />

        <TextView
            android:id="@+id/division"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="3"
            android:layout_margin="10dp"
            android:layout_row="1"
            android:text="My Division"
            tools:text="division" />

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="3"
            android:layout_margin="10dp"
            android:layout_row="2"
            android:text="My Title"
            tools:text="position" />

        <TextView
            android:id="@+id/address"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="3"
            android:layout_margin="10dp"
            android:layout_row="3"
            android:text="123 Sesame St."
            tools:text="address" />

        <TextView
            android:id="@+id/city_state"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="3"
            android:layout_margin="10dp"
            android:layout_row="4"
            android:text="mycity, mystate"
            tools:text="city,state" />

        <TextView
            android:id="@+id/phone_number"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="3"
            android:layout_margin="10dp"
            android:layout_row="5"
            android:text="(555) 555-5555"
            tools:text="phone" />

        <TextView
            android:id="@+id/email"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:layout_columnSpan="3"
            android:layout_margin="10dp"
            android:layout_row="6"
            android:text="someone@somewhere.com"
            tools:text="email" />


        <ImageButton
            android:id="@+id/directions_image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_row="4"
            android:background="@null"
            android:src="@drawable/ic_directions_enabled" />

        <ImageButton
            android:id="@+id/phone_image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_row="5"
            android:background="@null"
            android:src="@drawable/ic_phone_enabled" />

        <ImageButton
            android:id="@+id/voip_image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="2"
            android:layout_row="5"
            android:background="@null"
            android:src="@drawable/ic_voip_enabled" />

        <ImageButton
            android:id="@+id/email_image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_row="6"
            android:background="@null"
            android:src="@drawable/ic_email_enabled" />

    </GridLayout>
</HorizontalScrollView>

编辑：
我尝试使用Space，如此：

<android.support.v4.widget.Space
 android:layout_width="match_parent"
 android:layout_height="0dp"
 android:layout_weight="1"
 android:layout_column="1"
 android:layout_row="5"/>

似乎插入约1/2列，而使用空白图像插入整列。可能会在Space组件中播放参数。

Answer 1

您可以尝试向android:maxWidth和voipImage phoneImage提供ImageButton属性，如下所示：

<ImageButton
    android:id="@+id/phone_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_column="0"
    android:layout_row="5"
    android:maxWidth="96dp"
    android:background="@null"
    android:src="@drawable/ic_phone_enabled" />

<ImageButton
    android:id="@+id/voip_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_column="2"
    android:layout_row="5"
    android:maxWidth="96dp"
    android:background="@null"
    android:src="@drawable/ic_voip_enabled" />

<强>更新

以上更改不是必需的。我认为，要解决您的问题，您只需更改layout_column的{{1}}属性即可：

voip_image

希望这可以提供帮助

Answer 2

一种解决方案是创建一个空白图像并将其放在drawable文件夹中。然后用它来占用布局中的空间，如下所示：

<ImageButton
    android:id="@+id/phone_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_column="0"
    android:layout_row="5"
    android:background="@null"
    android:src="@drawable/ic_phone_enabled" />

<ImageButton
    android:id="@+id/blank_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_column="1"
    android:layout_row="5"
    android:background="@null"
    android:src="@drawable/ic_blank" />

<ImageButton
    android:id="@+id/voip_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_column="2"
    android:layout_row="5"
    android:background="@null"
    android:src="@drawable/ic_voip_enabled" />

ImageButtons在GridLayout中重叠，但并不想要这样

2 个答案: