使用 android 排列按钮：摆脱垂直 space

Question

我是 android 的新手。我主要从 LaTex 了解布局，但也从 Swing、SWT 和 javafx 了解布局。

作为练习，我尝试了一个非常简单的计算器布局，它基本上归结为具有一组按钮。

无论我尝试什么，按钮行之间仍然保持垂直距离。

我已经更改了行的背景颜色以查看不需要的 space 属于谁。

截图：

代码(xml):

<androidx.constraintlayout.widget.ConstraintLayout 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=".MainActivity">

    <TableLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="1dp"
        app:layout_constraintTop_toTopOf="parent"
        tools:layout_editor_absoluteX="-28dp">

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="1dp"
            android:background="#00ff00">

            <ImageButton
                android:id="@+id/imageButton1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="1dp"
            android:background="@color/black">

            <ImageButton
                android:id="@+id/imageButton11"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton12"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton13"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton14"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton15"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="0dp"
                android:layout_marginLeft="0dp"
                android:layout_marginTop="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </TableLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

我想去掉明显属于 table 行的按钮上方和下方的绿色和黑色 space。

我该怎么做，除了魔术词之外，我还想了解什么地方出了问题以及为什么出错。

在我使用 table 布局之前，我尝试过使用嵌套水平布局的垂直布局，结果大致相同。

Answer 1

您只需使用 android:padding="0dp" 将每个 ImageButton 的填充设置为 0，因为似乎 ImageButton 默认样式具有此填充。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".MainActivity">

    <TableLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#00ff00">

            <ImageButton
                android:id="@+id/imageButton1"
                android:layout_width="wrap_content"
                android:padding="0dp"
                android:layout_height="wrap_content"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton2"
                android:layout_width="wrap_content"
                android:padding="0dp"
                android:layout_height="wrap_content"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton5"
                android:layout_width="wrap_content"
                android:padding="0dp"
                android:layout_height="wrap_content"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/black">

            <ImageButton
                android:id="@+id/imageButton11"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton12"
                android:layout_width="wrap_content"
                android:padding="0dp"
                android:layout_height="wrap_content"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton13"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton14"
                android:layout_width="wrap_content"
                android:padding="0dp"
                android:layout_height="wrap_content"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />

            <ImageButton
                android:id="@+id/imageButton15"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="0dp"
                android:src="@drawable/img_a"
                tools:srcCompat="@tools:sample/avatars" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </TableLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

使用 android 排列按钮：摆脱垂直 space

Arranging buttons with android: get rid of vertical space

android

android-layout

android-tablelayout

android-imagebutton