如何在网格布局中显示网格线?

vmdwslir  于 2021-07-06  发布在  Java
关注(0)|答案(1)|浏览(411)

嗨,我正在开发一个应用程序。我使用网格布局将图像并排放置。我的问题是,我希望网格布局线在应用程序中可见。我试着给图片添加边框来实现这一点,但是在我的程序中,图片正在消失,所以不起作用。我该如何实现这一点?
我的代码在这里:

<androidx.gridlayout.widget.GridLayout
        android:id="@+id/gridLayout"
        android:layout_width="300dp"
        android:layout_height="363dp"
        android:clipToPadding="false"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="100dp"
            android:layout_height="120dp"
            android:onClick="increaseScore"
            app:layout_column="0"
            app:layout_row="0"
            app:srcCompat="@drawable/perry" />

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="100dp"
            android:layout_height="120dp"
            android:onClick="increaseScore"

            app:layout_column="1"
            app:layout_row="0"
            app:srcCompat="@drawable/perry" />

        <ImageView
            android:id="@+id/imageView3"
            android:layout_width="100dp"
            android:layout_height="120dp"
            android:onClick="increaseScore"

            app:layout_column="2"
            app:layout_row="0"
            app:srcCompat="@drawable/perry" />

        <ImageView
            android:id="@+id/imageView4"
            android:layout_width="100dp"
            android:layout_height="120dp"
            android:onClick="increaseScore"

            app:layout_column="0"
            app:layout_row="1"
            app:srcCompat="@drawable/perry" />

        <ImageView
            android:id="@+id/imageView5"
            android:layout_width="100dp"
            android:layout_height="120dp"
            android:onClick="increaseScore"

            app:layout_column="1"
            app:layout_row="1"
            app:srcCompat="@drawable/perry" />

        <ImageView
            android:id="@+id/imageView6"
            android:layout_width="100dp"
            android:layout_height="120dp"
            android:onClick="increaseScore"

            app:layout_column="2"
            app:layout_row="1"
            app:srcCompat="@drawable/perry" />

    </androidx.gridlayout.widget.GridLayout>

我希望图像之间的线条可见。

pgpifvop

pgpifvop1#

可以设置背景色( android:background )到 GridLayout 这和你的每个人都不一样 ImageView 的背景色,并设置 android:layout_margin 对每个 ImageView 用一个 dp 值,该值等于所需网格线的厚度。
将其应用于布局:

<?xml version="1.0" encoding="utf-8"?>
<androidx.gridlayout.widget.GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/gridLayout"
    android:layout_width="300dp"
    android:layout_height="363dp"
    android:background="#FFFFFF"
    android:clipToPadding="false"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="100dp"
        android:layout_height="120dp"
        android:layout_margin="2dp"
        android:background="#8CDD81"
        android:onClick="increaseScore"
        app:layout_column="0"
        app:layout_row="0"
        app:srcCompat="@drawable/perry" />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="100dp"
        android:layout_height="120dp"
        android:layout_margin="2dp"
        android:background="#8CDD81"
        android:onClick="increaseScore"

        app:layout_column="1"
        app:layout_row="0"
        app:srcCompat="@drawable/perry" />

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="100dp"
        android:layout_height="120dp"
        android:layout_margin="2dp"
        android:background="#8CDD81"
        android:onClick="increaseScore"
        app:layout_column="2"
        app:layout_row="0"
        app:srcCompat="@drawable/perry" />

    <ImageView
        android:id="@+id/imageView4"
        android:layout_width="100dp"
        android:layout_height="120dp"
        android:layout_margin="2dp"
        android:background="#8CDD81"
        android:onClick="increaseScore"
        app:layout_column="0"
        app:layout_row="1"
        app:srcCompat="@drawable/perry" />

    <ImageView
        android:id="@+id/imageView5"
        android:layout_width="100dp"
        android:layout_height="120dp"
        android:layout_margin="2dp"
        android:background="#8CDD81"
        android:onClick="increaseScore"
        app:layout_column="1"
        app:layout_row="1"
        app:srcCompat="@drawable/perry" />

    <ImageView
        android:id="@+id/imageView6"
        android:layout_width="100dp"
        android:layout_height="120dp"
        android:layout_margin="2dp"
        android:background="#8CDD81"
        android:onClick="increaseScore"
        app:layout_column="2"
        app:layout_row="1"
        app:srcCompat="@drawable/perry" />

</GridLayout>

这是消息来源

相关问题