Appcompat CardView和毕加索没有圆角 [英] Appcompat CardView and Picasso no rounded Corners

问题描述

我不知道究竟我应该ADRESS这个问题，如果是我的错，也有一些是在毕​​加索库错误或Cardview库内。

Basicly我有一个 CardView 包含图像（全卡支付）和A 的TextView 覆盖。

在运行上的的Andr​​oid 5.0 设备的code，一切工作正常，图像获取它的圆角的。

但是，如果我在pre 5.0 设备运行，图像重叠 Cardlayout 并不会有圆角。

您可以看到这个形象的比较：

下面是一些code代码片段：

layout_row.xml

 ＆LT; RelativeLayout的
    机器人：layout_width =match_parent
    机器人：layout_height =match_parent＆GT;

    ＆LT; ImageView的
        机器人：ID =@ + ID / pandaImage
        机器人：layout_width =match_parent
        机器人：layout_height =200dp
        机器人：layout_centerInParent =真
        机器人：scaleType =centerCrop/＆GT;

    ＆LT;的TextView
        机器人：ID =@ + ID / pandaName
        机器人：layout_width =match_parent
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_alignBottom =@ + ID / pandaImage
        机器人：layout_alignParentLeft =真
        机器人：layout_alignParentStart =真
        机器人：背景=@色/ photo_tint
        机器人：可点击=真
        机器人：可聚焦=真
        机器人：重力=中心
        机器人：文字颜色=@机器人：彩色/白
        机器人：TEXTSIZE =24sp/＆GT;

＆LT; / RelativeLayout的＆GT;
 

和回收商适配器加载图片：

  @覆盖
公共无效onBindViewHolder（ViewHolder viewHolder，int i）以{
    相片p值= photos.get（ⅰ）;
    Picasso.with（mContext）.load（p.getUrl（））符合（）成（viewHolder.mImage）。
    viewHolder.mPandaName.setText（p.getTitle（））;
}
 

解决方案

根据文档，这是设计的：

  

由于圆角裁剪昂贵的性质，在平台前l，CardView不夹及其子与圆角相交。相反，它增加了衬垫，以避免这样的交点（请参阅设置preventCornerOverlap（布尔），以改变这种行为）。

请参阅的 CardView 文档，获取更多信息。

I do not know where Exactly i Should Adress this issue, if it is my fault, there is something in the Picasso Lib Wrong or in the Cardview Library.

Basicly i have a CardView containing an image (Full Card Covered) and A TextView overlaying.

When Running the Code on a Android 5.0 Device, everything works fine and the Image Gets its Rounded Corners.

However if i run it on a pre 5.0 device, the image overlaps the Cardlayout and does not have rounded Corners.

You can See a Comparison on this Image:

Here are some Code Snippets:

layout_row.xml

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

    <ImageView
        android:id="@+id/pandaImage"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_centerInParent="true"
        android:scaleType="centerCrop" />

    <TextView
        android:id="@+id/pandaName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/pandaImage"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:background="@color/photo_tint"
        android:clickable="true"
        android:focusable="true"
        android:gravity="center"
        android:textColor="@android:color/white"
        android:textSize="24sp" />

</RelativeLayout>

And the Recycler Adapter Loading the Image:

@Override
public void onBindViewHolder(ViewHolder viewHolder, int i) {
    Photo p = photos.get(i);
    Picasso.with(mContext).load(p.getUrl()).fit().into(viewHolder.mImage);
    viewHolder.mPandaName.setText(p.getTitle());
}

解决方案

According to the docs, this as designed:

Due to expensive nature of rounded corner clipping, on platforms before L, CardView does not clip its children that intersect with rounded corners. Instead, it adds padding to avoid such intersection (See setPreventCornerOverlap(boolean) to change this behavior).

See the CardView docs for more info.

这篇关于Appcompat CardView和毕加索没有圆角的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！