ImageView 在 cardView 中不匹配 - Android

Posted 2023-04-19

【中文标题】ImageView 在 cardView 中不匹配 - Android

【英文标题】：ImageView don't match in cardView - Android

【发布时间】：2018-06-23 21:39:14

【问题描述】：

我有下面的 xml：

<RelativeLayout
    android:id="@+id/relative_one"
    android:layout_
    android:layout_>

    <RelativeLayout
        android:id="@+id/relative_two"
        android:layout_
        android:layout_>

        <ImageView
            android:id="@+id/image_product_imageview"
            android:layout_
            android:layout_
            android:adjustViewBounds="true"
            android:scaleType="fitXY" />

        <TextView
            android:id="@+id/status_product_textview"
            android:layout_
            android:layout_
            android:layout_alignParentLeft="true"
            android:layout_gravity="left"
            android:layout_marginTop="20dp"
            android:gravity="center_vertical"
            android:paddingLeft="5dp"
            android:paddingRight="5dp"
            android:visibility="invisible" />
    </RelativeLayout>

    <android.support.constraint.ConstraintLayout
        android:id="@+id/relative_three"
        android:layout_
        android:layout_
        android:layout_below="@+id/relative_two">

        <Spinner
            android:id="@+id/select_spinner"
            android:layout_
            android:layout_
            android:layout_marginRight="5dp"
            android:dropDownVerticalOffset="40dp"
            android:gravity="center_vertical"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintHeight_default="wrap"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/name_product_textview"
            android:layout_
            android:layout_
            android:layout_marginBottom="10dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginTop="10dp"
            android:ellipsize="marquee"
            android:gravity="right"
            android:maxLines="1"
            android:text="TEXT"
            app:layout_constraintRight_toLeftOf="@+id/select_spinner"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/count_products_textview"
            android:layout_
            android:layout_
            android:layout_marginBottom="10dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginTop="10dp"
            android:gravity="right"
            android:text="TEXT"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintRight_toLeftOf="@+id/select_spinner"
            app:layout_constraintTop_toBottomOf="@+id/name_product_textview" />
    </android.support.constraint.ConstraintLayout>
</RelativeLayout>

在上面xml我有下面ImageView：

    <ImageView
        android:id="@+id/image_product_imageview"
        android:layout_
        android:layout_
        android:adjustViewBounds="true"
        android:scaleType="fitXY" />

问题：我的ImageView不要match在cardView（左右和顶部）。它在ImageView周围有2或3个空格（左右和顶部） )。

在我的源代码中，我将图像设置如下：

Picasso.with(context)
                    .load(productsModelList.getPictureUrl())
                    .placeholder(AppCompatDrawableManager.get().getDrawable(context, R.drawable.placeholder_pictures))
                    .fit()
                    .into(image_product_imageview);

【问题讨论】：

关于问题的截图？

请检查您的布局文件是否有填充。 id 为 relative_one 的布局的宽度属性为“wrap_content”，其内部子元素的宽度属性为“match_parent”。你不认为它们相互混淆吗？

CardView has extra margin in each edge on Pre-Lollipop的可能重复

【参考方案1】：

这个空间是 CardView 支持早于 L (API 20) 的系统的结果。为了使您的布局在 Lollipop 前（和CardView 前小部件）或 Lollipop 和更新版本上看起来相同，Android 引入了一些额外的属性。

因为重叠（圆角）对于旧的 Android 版本来说内容很困难，所以添加了 cardPreventCornerOverlap 并默认设置为 true。这就是为什么你的ImageView 周围有白色条纹 - 你可以自己检查它们的宽度是否与cardCornerRadius 值密切相关。

要删除此填充关闭 cardPreventCornerOverlap。你可以做到：

通过 xml card_view:cardPreventCornerOverlap="false"

或以编程方式yourCardView.setPreventCornerOverlap(false)。

请记住，这只会为您提供 API 20+ 所需的效果。 在具有旧版本系统的设备上，您的圆角将不可见（隐藏在非圆角图像下）。

要了解更多信息，请查看the CardView doc。在第一段中，您可以找到有关您的问题的官方说明。

【讨论】：

@paulina_glab。非常感谢。