android - GridLayout cardview 走出屏幕 Android

Question

我正在尝试使用 GridLayout、CardView 和 LinearLayout 制作一个应用程序，因此在模拟器上一切正常，但是当我在真实设备上测试我的应用程序时，卡片视图超出了屏幕我已经在不同的设备上对其进行了测试，但问题仍然存在请帮助！

这就是它在模拟器中的样子

这是它在真实设备上的外观

XML 代码

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/logo_img"
        android:src="@drawable/logo"
        android:layout_gravity="center"
        android:layout_width="250dp"
        android:layout_height="wrap_content"/>

    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center_horizontal"
        android:layout_margin="5dp"
        android:alignmentMode="alignMargins"
        android:columnCount="2"
        android:columnOrderPreserved="false"
        android:rowCount="4">

        <androidx.cardview.widget.CardView
            android:id="@+id/view1"
            android:layout_width="170dp"
            android:layout_height="170dp"
            android:layout_margin="15dp"
            app:cardBackgroundColor="#DE773C"
            app:cardCornerRadius="12dp"
            app:cardElevation="5dp">

            <Button
                android:id="@+id/btn1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@android:color/transparent" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="80dp"
                    android:layout_height="80dp"
                    android:layout_marginTop="10dp"
                    android:src="@drawable/img1" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="10dp"
                    android:text="TEST"
                    android:textAlignment="center"
                    android:textColor="#272932"
                    android:textSize="25sp"
                    android:textStyle="bold" />

            </LinearLayout>

        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:id="@+id/view2"
            android:layout_width="170dp"
            android:layout_height="170dp"
            android:layout_margin="15dp"
            app:cardBackgroundColor="#DE773C"
            app:cardCornerRadius="12dp"
            app:cardElevation="5dp">

            <Button
                android:id="@+id/btn2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@android:color/transparent" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="80dp"
                    android:layout_height="80dp"
                    android:layout_marginTop="10dp"
                    android:src="@drawable/img2" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="10dp"
                    android:text="TEST"
                    android:textAlignment="center"
                    android:textColor="#272932"
                    android:textSize="25sp"
                    android:textStyle="bold" />

            </LinearLayout>

        </androidx.cardview.widget.CardView>

    </GridLayout>

 </LinearLayout>
</ScrollView>

标签： androidandroid-studioandroid-layoutandroid-cardviewandroid-gridlayout

Answer 1

如果您希望所有设备中两个 CardViews 的宽度相同，请尝试在您的 GridLayout 中添加以下内容

添加android:columnCount="2"和android:orientation="horizontal"到GridLayout

添加android:layout_width="0dp" 和android:layout_columnWeight="1"到 CardViews

示例代码：

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center_horizontal"
    android:layout_margin="5dp"
    android:alignmentMode="alignMargins"
    android:columnCount="2"
    android:orientation="horizontal"
    android:columnOrderPreserved="false"
    android:rowCount="4">

    <androidx.cardview.widget.CardView
        android:id="@+id/view1"
        android:layout_width="0dp"
        android:layout_columnWeight="1"
        android:layout_height="170dp"
        android:layout_margin="15dp"
        app:cardBackgroundColor="#DE773C"
        app:cardCornerRadius="12dp"
        app:cardElevation="5dp">

        <Button
            android:id="@+id/btn1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@android:color/transparent" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:layout_width="80dp"
                android:layout_height="80dp"
                android:layout_marginTop="10dp"
                android:src="@drawable/img1" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginTop="10dp"
                android:text="TEST"
                android:textAlignment="center"
                android:textColor="#272932"
                android:textSize="25sp"
                android:textStyle="bold" />

        </LinearLayout>

    </androidx.cardview.widget.CardView>

    <androidx.cardview.widget.CardView
        android:id="@+id/view2"
        android:layout_width="0dp"
        android:layout_columnWeight="1"
        android:layout_height="170dp"
        android:layout_margin="15dp"
        app:cardBackgroundColor="#DE773C"
        app:cardCornerRadius="12dp"
        app:cardElevation="5dp">

        <Button
            android:id="@+id/btn2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@android:color/transparent" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:layout_width="80dp"
                android:layout_height="80dp"
                android:layout_marginTop="10dp"
                android:src="@drawable/img2" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginTop="10dp"
                android:text="TEST"
                android:textAlignment="center"
                android:textColor="#272932"
                android:textSize="25sp"
                android:textStyle="bold" />

        </LinearLayout>

    </androidx.cardview.widget.CardView>
</GridLayout>