CODEWITHSUNDEEP
androidandroid-cardview
Mohammad Aftal
Mohammad Aftal

Reputation: 11

card view boundaries showing on pre lollipop devices

The following code is rendering with undesired view boundaries on devices with android versions pre lollipop:

 <android.support.v7.widget.CardView
        android:id="@+id/cardView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        app:cardBackgroundColor="@color/transparent"
        app:cardCornerRadius="@dimen/card_corner_radius"
        app:cardElevation="0dp"
        app:cardUseCompatPadding="true">

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

            <com.makeramen.roundedimageview.RoundedImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:adjustViewBounds="true"
                app:srcCompat="@{radio.radioLogo}"
                app:riv_corner_radius="@dimen/card_corner_radius"
                android:alpha="@{radio.playing}"/>

            <LinearLayout
                android:id="@+id/overlay_layout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:background="@color/transparent"
                android:gravity="center"
                android:orientation="vertical"
                android:visibility="@{radio.recording?View.VISIBLE:View.GONE}">

                <TextView
                    android:id="@+id/recording_text_view"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@color/transparent"
                    android:text="@string/recording"
                    android:textAppearance="?android:textAppearanceLarge"
                    android:textColor="@color/white" />

                <TextView
                    android:id="@+id/recording_time"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@color/transparent"
                    android:text="@{radio.recordingElapsedTime}"
                    android:textAppearance="?android:textAppearanceLarge"
                    android:textColor="@color/white" />

            </LinearLayout>

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

ps: I tried card_view:cardPreventCornerOverlap="false" and it doesn't solve my problem. lollipop render

Pre lollipop render

Thanks in advance for any interest in helping.

Upvotes: 0

Views: 569

Answers (2)

Andoctorey
Andoctorey

Reputation: 788

If you need to keep elevation on v21 devices and remove cardview weird boundaries on pre21 devices - create values-v21/dimens.xml with:

<dimen name="card_elevation">2dp</dimen>

And values/dimens.xml with:

<dimen name="card_elevation">0dp</dimen>

Then add property to CardView:

app:cardElevation="@dimen/card_elevation"

Upvotes: 0

Mohammad Aftal
Mohammad Aftal

Reputation: 11

I found a solution that worked for me and I wanted to post it in case any one else came across this situation. I set the maximum elevation to 0dp and now rendering is perfect on API level 16 too.

<android.support.v7.widget.CardView
    android:id="@+id/cardView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    app:cardBackgroundColor="@color/transparent"
    app:cardCornerRadius="@dimen/card_corner_radius"
    app:cardElevation="0dp"
    app:cardMaxElevation="0dp"
    app:cardUseCompatPadding="true">

Upvotes: 1

Related Questions