Android Studio:CardView 网格 + 内容无法在设备上以纵向模式正确显示

Android Studio: CardView grids +content not displaying correctly in portrait mode on Device

我在 Android Studio 3.5.3 上使用 androidx.cardview:cardview:1.0.0。 Android Studio 中我的 activity_main 布局的设计预览完美地显示了布局

然而,当我在我的设备(Huawei p30 lite)上测试它时,在纵向模式下设计完全乱七八糟,也没有显示任何内容

在我的设备上以横向模式查看布局时,它完美地显示了设计,如 Android Studio 预览中所示。

这是我在布局中的代码:

    <ScrollView xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/background"
    tools:context=".MainActivity">

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

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="20dp"
            android:layout_marginTop="40dp"
            android:layout_marginRight="20dp">

            <ImageView
                android:id="@+id/logo"
                android:layout_centerHorizontal="true"

                android:layout_width="90dp"
                android:layout_height="90dp"
                android:src="@drawable/circle"
                />
        </RelativeLayout>

        <GridLayout
            android:id="@+id/fam"
            android:layout_marginTop="40dp"
            android:columnCount="2"
            android:rowCount="3"
            android:alignmentMode="alignMargins"
            android:columnOrderPreserved="false"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <androidx.cardview.widget.CardView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_columnWeight="1"
                android:layout_rowWeight="1"
                app:cardElevation="60dp"
                app:cardCornerRadius="12dp"
                android:layout_margin="12dp"
                >
                <LinearLayout
                    android:orientation="vertical"
                    android:padding="16dp"
                    android:gravity="center"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">
                    <ImageView
                        android:src="@drawable/object"
                        android:layout_width="80dp"
                        android:layout_height="80dp">
                    </ImageView>

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="12dp"
                        android:fontFamily="casual"
                        android:text="Object Detection"
                        android:textColor="#000000"
                        android:textSize="18sp">
                    </TextView>
                </LinearLayout>
                  </androidx.cardview.widget.CardView>

                  **repeat the above cardview for the remaining 5 cards**
                  .
                  </GridLayout>
        </LinearLayout>
</ScrollView>

compilesdkversion为28,minsdkversion为23

我也试过在 AndroidManifest.xml 中将 android:screenOrientation 设置为 portrait,然后在我的设备上设置 运行,但还是不行。

如有任何帮助,我们将不胜感激!

您在 Android Studio 上的预览设备应该与您在 phone 上的精确分辨率相匹配。

您的华为设备分辨率为 1080 x 2312 像素。

检查您在 Android studio

中预览设备分辨率

喜欢这个 AS preview 或者您可以创建与您的设备相同的自定义分辨率 phone 来修复。

所以我设法解决了它。 在每个 <CardView> 内的 <LinearLayout> 中,我将 android:layout_widthandroid:layout_height 更改为 wrapcontent,现在它在纵向模式下显示一切正常。