Niepotrzebne wypełnienie w CardView?

Question

Zaimplementowałam CardView w mojej aplikacji i wszystko działa dobrze, z wyjątkiem niewielkiego wypełnienia wokół obrazu, jeśli umieściłem promień na karcie.

Wydaje się to tak:

Ale w android docs aw this article obraz zajmuje całą cardview, więc u może mi pomóc to osiągnąć.

Mój plik układ jest podobny:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 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="match_parent" 
      android:orientation="vertical" 
      android:padding="8dp"> 

<android.support.v7.widget.CardView 
    android:layout_width="match_parent" 
    android:layout_height="200dp" 
    card_view:cardBackgroundColor="@android:color/white" 
    card_view:cardCornerRadius="4dp"> 

    <ImageView 
     android:id="@+id/media_image_view" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:scaleType="centerCrop"/> 

     <RelativeLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="bottom" 
      android:alpha="0.8" 
      android:background="?attr/colorPrimary" 
      android:padding="4dp"> 

      <TextView 
       android:id="@+id/media_download" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignParentRight="true" 
       android:textSize="11sp"/> 

      <TextView 
       android:id="@+id/category_name" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignParentLeft="true" 
       android:textColor="@color/primary_text" 
       android:textSize="12sp"/> 

     </RelativeLayout> 

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

</LinearLayout> 

UWAGA: zrzut ekranu jest rejestrowany na urządzeniu wstępnie lizak.

Answer 1

Przeszedłem przez developer docs ponownie i stwierdził, że:

Na API 20 i wcześniej, CardView nie clip granice karty dla zaokrąglonymi narożnikami. Zamiast tego dodaje dopełnienie do treści, aby nie nakładało się na zaokrąglone rogi.

Tak więc w przypadku urządzeń pre-Lollipop muszę zadzwonić pod numer setPreventCornerOverlap (false); w widoku karty.

Aktualizacja: To samo można zrobić poprzez kod XML, dodając app:cardPreventCornerOverlap="false" w widoku karty.

Answer 2

Ustawienie app:cardPreventCornerOverlap="false" rozwiąże problem, a także usunie narożne wszystkie urządzenia pre-Lollipop. Jeśli chcesz rogiem na wszystkich urządzeniach, dodaj ją ręcznie:

card_view_round_corner_background.xml

<?xml version="1.0" encoding="utf-8"?>  
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">   
    <item>  
    <shape android:shape="rectangle">     
     <solid android:color="@color/transparent"/>     
     <stroke android:width="2dp" android:color="@color/Black"/> 
     </shape> 
     </item> 
     <item>    
    <shape android:shape="rectangle"> 
    <solid android:color="@color/transparent"/>    
    <corners android:radius="6dp"/>    
    <stroke android:width="2dp" android:color="@color/Black"/>   
    </shape> 
    </item> 
    </layer-list> 

W cardview

<android.support.v7.widget.CardView android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:focusable="true" 
    android:clickable="true" 
    android:foreground="?android:attr/selectableItemBackground"card_view:cardCornerRadius="@dimen/conner_radius" 
    card_view:cardBackgroundColor="@color/Black" 
    card_view:cardElevation="@dimen/z_card"> 

    <!-- Put your card contain here --> 

    <View 
    android:background="@drawable/card_view_round_corner_border" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    /> 

Ale to rozwiązanie działa tylko na jednolitym tle, takie jak czarny lub biały.

Answer 3

Wystarczy użyć FrameLayout zamiast LinearLayout, działa

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginBottom="-4dp"> 

    <android.support.v7.widget.CardView 
     android:id="@+id/card_view" 
     xmlns:card_view="http://schemas.android.com/apk/res-auto" 
     android:layout_width="fill_parent" 
     android:layout_height="100dp" 
     android:layout_gravity="center" 
     android:layout_margin="5dp" 
     card_view:cardCornerRadius="4dp" 
     card_view:cardPreventCornerOverlap="false" 
     card_view:cardUseCompatPadding="true" 

     > 

     <FrameLayout 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:orientation="horizontal" 
      > 

      <ImageView 
       android:id="@+id/imageView" 
       android:tag="image_tag" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_margin="5dp" 
       android:layout_weight="1" 
       android:src="@drawable/ic_launcher"/> 

      <LinearLayout 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_marginTop="5dp" 
       android:layout_weight="2" 
       android:orientation="vertical" 
       > 

       <TextView 
        android:id="@+id/textViewName" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_gravity="center_horizontal" 
        android:layout_marginTop="5dp" 
        android:text="Android Name" 
        android:textAppearance="?android:attr/textAppearanceLarge"/> 

       <TextView 
        android:id="@+id/textViewVersion" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_gravity="center_horizontal" 
        android:layout_marginTop="5dp" 

        android:text="Android Version" 
        android:textAppearance="?android:attr/textAppearanceMedium"/> 

      </LinearLayout> 
     </FrameLayout> 

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

</FrameLayout>