交错网格视图中的未知额外 space 来源

Question

这是我第一次使用卡片我得到了一些额外的 space 不知道它来自哪里

这是我的名片视图

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.CardView 
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/tools"
android:id="@+id/card_view"
android:layout_width="150dp"
android:layout_height="wrap_content"
card_view:cardUseCompatPadding="true"
card_view:cardCornerRadius="8dp">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/product_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        card_view:srcCompat="@drawable/sample_1" />

    <TextView
        android:id="@+id/product_price"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignEnd="@+id/product_image"
        android:layout_alignParentTop="true"
        android:layout_alignRight="@+id/product_image"
        android:layout_marginRight="10dp"
        android:layout_marginTop="10dp"
        android:background="#ffffff"
        android:padding="10dp"
        android:text="[=11=].00"
        android:textColor="#000000" />


    <TextView
        android:id="@+id/product_description"
        android:layout_width="150dp"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/product_image"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:background="#CCFFFFFF"
        android:text="This is the product description!"
        android:textColor="#000000" />
</RelativeLayout>

这是我的 space 装饰 class

public class SpacesDecoration extends RecyclerView.ItemDecoration {
private final int mSpace;

public SpacesDecoration(int space) {
    this.mSpace = space;
}

@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {

    if (parent.getChildAdapterPosition(view) == 0)
        outRect.top = mSpace;
}}}

这是我得到的最终视图

任何人都可以告诉我这个额外的 space 来自哪里，在此先感谢

Answer 1

您的 CardView XML.

中存在一些问题

1. 将 ImageView 属性 android:layout_width="wrap_content" 更新为 android:layout_width="match_parent".

2. 在 ImageView 中使用 android:src="@drawable/sample_1" 而不是 card_view:srcCompat="@drawable/sample_1" 并根据需要使用 scaleType。

3. 将属性 card_view:cardPreventCornerOverlap="false" 添加到 CardView 并使用 card_view:cardUseCompatPadding="false"

仅供参考，我从 TextView's 中删除了一些不必要的 attributes 并添加了一些以进行正确对齐。

试试这个：

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/tools"
    android:id="@+id/card_view"
    android:layout_width="150dp"
    android:layout_height="wrap_content"
    card_view:cardCornerRadius="8dp"
    card_view:cardUseCompatPadding="false"
    card_view:cardPreventCornerOverlap="false">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/product_image"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true"
            android:layout_alignParentTop="true"
            android:scaleType="fitXY"
            android:src="@drawable/sample_1" />

        <TextView
            android:id="@+id/product_price"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_alignParentRight="true"
            android:layout_marginRight="10dp"
            android:layout_marginTop="10dp"
            android:background="#ffffff"
            android:padding="10dp"
            android:text="[=10=].00"
            android:textColor="#000000" />


        <TextView
            android:id="@+id/product_description"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/product_image"
            android:padding="8dp"
            android:background="#CCFFFFFF"
            android:text="This is the product description!"
            android:textColor="#000000" />
    </RelativeLayout>
</android.support.v7.widget.CardView>

输出：

希望对你有所帮助~

交错网格视图中的未知额外 space 来源

unknown extra space source in staggered grid view

android

android-recyclerview

android-cardview

staggered-gridview