在卡片视图中排列小部件

Posted

技术标签:

【中文标题】在卡片视图中排列小部件【英文标题】:arranging widgets in cardview 【发布时间】:2021-05-24 22:23:56 【问题描述】:

我在卡片视图中放置了小部件,但随着屏幕尺寸的变化,小部件的位置也会发生变化。我如何确保小部件适合所有屏幕尺寸。我已经使用了 android:screenOrientation="nosensor" 但小部件仍然因屏幕尺寸的变化而错位。请帮忙解决。它是否也支持平板手机?

    <androidx.cardview.widget.CardView
        android:id="@+id/cardview"
        android:layout_
        android:layout_
        android:layout_gravity="center"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        app:cardCornerRadius="10dp"
        app:cardElevation="10dp">

            <RelativeLayout
                android:id="@+id/relative1"
                android:layout_
                android:layout_>
    
                    <ImageView
                        android:id="@+id/imageView7"
                        android:layout_
                        android:layout_
                        android:layout_marginLeft="@dimen/_6sdp"
                        android:layout_marginTop="@dimen/_6sdp"
                        android:layout_marginBottom="@dimen/_6sdp"
                        app:srcCompat="@drawable/card_house" />
    
                    <TextView
                        android:id="@+id/textView15"
                        android:layout_
                        android:layout_
                        android:layout_below="@id/imageView7"
                        android:layout_marginLeft="@dimen/_8ssp"
                        android:layout_marginBottom="@dimen/_4sdp"
                        android:fontFamily="@font/poppins_regular"
                        android:padding="@dimen/_3ssp"
                        android:text="1346sqft"
                        android:textColor="@color/black"
                        android:textSize="@dimen/_10ssp" />
    
                    <TextView
                        android:id="@+id/textView21"
                        android:layout_
                        android:layout_
                        android:layout_below="@id/textView15"
                        android:layout_marginLeft="@dimen/_8ssp"
                        android:fontFamily="@font/poppins_regular"
                        android:padding="@dimen/_3ssp"
                        android:text="AGRICULTURE"
                        android:textColor="@color/black"
                        android:textSize="@dimen/_8ssp" />
    
                    <TextView
                        android:id="@+id/cardname"
                        android:layout_
                        android:layout_
                        android:layout_marginLeft="@dimen/_26sdp"
                        android:layout_marginTop="@dimen/_8sdp"
                        android:layout_marginRight="@dimen/_6ssp"
                        android:layout_toRightOf="@id/imageView7"
                        android:fontFamily="@font/poppins_regular"
                        android:padding="@dimen/_2ssp"
                        android:text="xyz"
                        android:textColor="@color/black" />
    
                    <TextView
                        android:id="@+id/cardnum"
                        android:layout_
                        android:layout_
                        android:layout_below="@+id/cardname"
                        android:layout_marginLeft="@dimen/_26sdp"
                        android:layout_marginTop="@dimen/_3ssp"
                        android:layout_marginRight="@dimen/_6ssp"
                        android:layout_toRightOf="@id/imageView7"
                        android:fontFamily="@font/poppins_regular"
                        android:padding="@dimen/_2ssp"
                        android:text="98765544312"
                        android:textColor="@color/black" />
    
                    <TextView
                        android:id="@+id/pidnum"
                        android:layout_
                        android:layout_
                        android:layout_below="@id/cardnum"
                        android:layout_marginLeft="@dimen/_38sdp"
                        android:layout_marginTop="@dimen/_31ssp"
                        android:layout_toEndOf="@id/textView15"
                        android:fontFamily="@font/poppins_regular"
                        android:padding="@dimen/_3ssp"
                        android:text="123456"
                        android:textAlignment="gravity"
                        android:textColor="@color/black"
                        android:textSize="@dimen/_10ssp" />
    
                    <TextView
                        android:id="@+id/pidtxt"
                        android:layout_
                        android:layout_
                        android:layout_below="@+id/pidnum"
                        android:layout_marginStart="31dp"
                        android:layout_marginLeft="@dimen/_30ssp"
                        android:layout_marginTop="4dp"
                        android:layout_toEndOf="@id/textView21"
                        android:fontFamily="@font/poppins_regular"
                        android:gravity="center"
                        android:padding="@dimen/_3ssp"
                        android:text="PID NO"
                        android:textColor="@color/black"
                        android:textSize="@dimen/_8ssp" />
    
                    <TextView
                        android:id="@+id/sitenum"
                        android:layout_
                        android:layout_
                        android:layout_marginStart="@dimen/_38ssp"
                        android:layout_marginTop="@dimen/_83ssp"
                        android:layout_toEndOf="@id/pidnum"
                        android:fontFamily="@font/poppins_regular"
                        android:gravity="center"
                        android:padding="@dimen/_3ssp"
                        android:text="986"
                        android:textColor="@color/black"
                        android:textSize="@dimen/_10ssp" />
    
                    <TextView
                        android:id="@+id/sitetxt"
                        android:layout_
                        android:layout_
                        android:layout_below="@id/sitenum"
                        android:layout_marginStart="@dimen/_43ssp"
                        android:layout_marginTop="4dp"
                        android:layout_toEndOf="@id/pidtxt"
                        android:fontFamily="@font/poppins_regular"
                        android:padding="@dimen/_3ssp"
                        android:text="SITE NO"
                        android:textColor="@color/black"
                        android:textSize="@dimen/_8ssp" />
    
                    <TextView
                        android:id="@+id/sasnum"
                        android:layout_
                        android:layout_
                        android:layout_marginLeft="@dimen/_60ssp"
                        android:layout_marginTop="@dimen/_82ssp"
                        android:layout_toEndOf="@id/sitenum"
                        android:fontFamily="@font/poppins_regular"
                        android:padding="@dimen/_3ssp"
                        android:text="1/134"
                        android:textColor="@color/black"
                        android:textSize="@dimen/_10ssp" />
    
                    <TextView
                        android:layout_
                        android:layout_
                        android:layout_below="@+id/sasnum"
                        android:layout_marginLeft="@dimen/_47ssp"
                        android:layout_marginTop="4dp"
                        android:layout_toEndOf="@id/sitetxt"
                        android:fontFamily="@font/poppins_regular"
                        android:padding="@dimen/_3ssp"
                        android:text="SAS APPN NO"
                        android:textColor="@color/black"
                        android:textSize="@dimen/_8ssp" />
             </RelativeLayout>
    </androidx.cardview.widget.CardView>

【问题讨论】:

【参考方案1】:

嗯,Android Studio 提供了不同的方式来预览您的布局。您可以选择在哪个设备上进行预览。从 5.0" 到 10.1" 的小型设备(您可以使用更多配置,因为虚拟设备列表更广泛,最近我一直在使用 AVD 在 4" 虚拟设备上测试应用程序)。

【讨论】:

在检查了不同的 AVD 之后,我问我如何才能让 cardview 响应以适应所有屏幕尺寸......你没有得到我的问题。

以上是关于在卡片视图中排列小部件的主要内容,如果未能解决你的问题,请参考以下文章

无法将 onTap 字段传递给无状态小部件

如何使卡片小部件在设计中可触摸?

如何将卡片小部件放在 SliverAppBar 中?

Flutter:在 ListView 中按下卡片小部件不起作用

如何将一列小部件紧紧包裹在卡片中?

Flutter Cards:如何在 Flutter 中创建自定义卡片小部件