CODEWITHSUNDEEP
androidmaterial-designandroid-cardview
Choletski
Choletski

Reputation: 7525

"Ugly" CardView on Pre-Lollipop devices

I am using CardView as custom item for RecyclerView. They looks good on Android 5+ but so different on older Android versions.

On Android 5 + enter image description here

On Android < 5 enter image description here

The code is the same:

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?android:attr/listPreferredItemHeight"
card_view:cardCornerRadius="1dp"
card_view:cardElevation="1dp">

... other items ...

</android.support.v7.widget.CardView>

Is there a way to achieve the Android 5+ behavior on pre-Lollipop devices?

Upvotes: 1

Views: 966

Answers (1)

Zielony
Zielony

Reputation: 16537

Using the support CardView? No.

Personally I think that the support CardView is broken and shouldn't be used at all. It looks and works a little bit different on Lollipop and on older systems. The shadow is different, the padding is different, content clipping doesn't work on pre-Lollipop devices, etc. The API is also weird and confusing. That's why it's hard to get good results on all platforms. If you can live without cards, I would go that way.

Of course it's possible to create a custom, nice-looking, backwards-compatible card, but it's a bit complex task. To create a card on your own you have to implement:

  • rounded corners with content clipping (doesn't work in the support CardView). Here's how to do it properly.
  • shadows drawn outside the card (not inside, like the support CardView). This one depends on your needs. I would override drawChild(...) in a parent container, where I could draw shadows around cards freely. Shadow generation method doesn't matter - it could be a gradient, a static 9-patch or a RenderScript-blurred black shape.

I was frustrated by the look and the API of CardView as well, so I created my own implementation. It can be found on GitHub - the library is called Carbon and using it is probably the easiest way to get a decent card. After importing the library simply add style="?attr/carbon_cardViewStyle" to any layout to make it look like a card:

<carbon.widget.RelativeLayout 
    style="?attr/carbon_cardViewStyle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Upvotes: 1

Related Questions