ImageView 上 Button 的 GridLayout

Question

我试图在屏幕上显示的是图像和覆盖图像并使用户能够点击按钮并慢慢显示按钮后面图像的按钮。按钮完全不出现的问题，根本看不出来。除此之外，我需要 x * x 个能够均匀覆盖整个图像的按钮。

<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/cat">

<GridLayout
    android:id="@+id/GridLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnCount="4"
    android:rowCount="4">
    <Button
        android:id="@+id/first"
        android:textSize="20sp"
        android:layout_width="55dp"
        android:layout_height="55dp"
        android:text="W"
        android:textAlignment="center"
        android:background="@drawable/signalsquare"
        />


</GridLayout>

此图像用于演示目的（抱歉按钮不对称）

起初用户看到图片上布满了按钮，然后每次点击每个按钮都会显示图片的另一小部分

Answer 1

<ImageView
        android:id="@+id/imageView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/questions" />

    <LinearLayout
        android:id="@+id/GridLayout1"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="@+id/imageView3"
        app:layout_constraintEnd_toEndOf="@+id/imageView3"
        app:layout_constraintStart_toStartOf="@+id/imageView3"
        app:layout_constraintTop_toTopOf="@+id/imageView3">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="horizontal">
            <Button
                android:id="@+id/q"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/w"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/e"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/r"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal"
            android:layout_weight="1">
            <Button
                android:id="@+id/q"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/w"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/e"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/r"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal"
            android:layout_weight="1">
            <Button
                android:id="@+id/q"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/w"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/e"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/r"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal"
            android:layout_weight="1">
            <Button
                android:id="@+id/q"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/w"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/e"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
            <Button
                android:id="@+id/r"
                android:textSize="20sp"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="W"
                android:layout_weight="1"
                android:textAlignment="center"
                android:background="@drawable/button_design"
                />
        </LinearLayout>
    </LinearLayout>

ImageView 上 Button 的 GridLayout

GridLayout of Button on ImageView

android

grid-layout