android - recyclerview - Radio de esquina de CardView

dependencia cardview android studio

Question

¿Hay alguna manera de hacer que CardView solo tenga un radio de esquina en la parte superior?

<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardCornerRadius="10dp"
    >

Answer 1

A menos que intente extender la clase CardView Android, no puede personalizar ese atributo desde XML .

Sin embargo, hay una manera de obtener ese efecto.

Coloque un CardView dentro de otro CardView y aplique un fondo transparente a su CardView externo y elimine su radio de esquina ( "cornerRadios = 0dp" ). Su CardView interno tendrá un valor de cornerRadius de 3dp, por ejemplo. Luego aplique un marginTop a su CardView interno, de modo que sus límites inferiores sean cortados por el CardView externo. De esta manera, el radio de la esquina inferior de su CardView interno estará oculto.

El código XML es el siguiente:

 <android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_view_outer"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_gravity="center"
    card_view:cardBackgroundColor="@android:color/transparent"
    card_view:cardCornerRadius="0dp"
    card_view:cardElevation="3dp" >

    <android.support.v7.widget.CardView
        xmlns:card_view="http://schemas.android.com/apk/res-auto"
        android:id="@+id/card_view_inner"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_gravity="center"
        android:layout_marginTop="3dp"
        card_view:cardBackgroundColor="@color/green"
        card_view:cardCornerRadius="4dp"
        card_view:cardElevation="0dp" >
    </android.support.v7.widget.CardView>
</android.support.v7.widget.CardView>

Y el efecto visual es el siguiente:

Siempre coloque su contenido en su CardView interno. Su CardView externo solo sirve para "ocultar" las Esquinas Redondeadas inferiores del CardView interno.

Answer 2

Escribí una lib dibujable en una posición de esquina redonda personalizada, se ve así:

Puedes obtener esta lib aquí:

https://github.com/mthli/Slice

Answer 3

Hay un ejemplo de cómo lograrlo, cuando la tarjeta está en la parte inferior de la pantalla. Si alguien tiene este tipo de problema, simplemente haga algo así:

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="-5dp"
    card_view:cardCornerRadius="4dp">

    <SomeView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="5dp">

    </SomeView>

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

La vista de tarjeta tiene un margen inferior negativo. La vista dentro de una Vista de tarjeta tiene el mismo margen inferior positivo pero positivo. De esta forma, las partes redondeadas se ocultan debajo de la pantalla, pero todo se ve exactamente igual, porque la vista interna tiene un margen de contador.

Answer 4

La forma más fácil de lograrlo en Android Studio se explica a continuación:

Paso 1:
Escriba debajo de la línea en dependencias en build.gradle :

cardView = view.findViewById(R.id.card_view2);
cardView.setBackgroundResource(R.drawable.card_view_bg);

Paso 2:
Copie el siguiente código en su archivo xml para integrar CardView .

Para que cardCornerRadius funcione, asegúrese de incluir la siguiente línea en el diseño principal: xmlns:card_view="http://schemas.android.com/apk/res-auto"

Y recuerde usar card_view como espacio de nombres para usar la propiedad cardCornerRadius .

Por ejemplo: card_view:cardCornerRadius="4dp"

Código XML:

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/white" />
<corners android:topLeftRadius="18dp" android:bottomRightRadius="18dp" />
</shape>

Answer 5

Necesitas hacer 2 cosas:

1) Llame a setPreventCornerOverlap(false) en su CardView.

2) Poner Imageview redondeado dentro de CardView

Acerca de redondear su vista de imagen, tuve el mismo problema, así que hice una biblioteca que puede establecer diferentes radios en cada esquina . Finalmente obtuve el resultado que quería a continuación.

https://github.com/pungrue26/SelectableRoundedImageView

Answer 6

Puede usar este xml dibujable y establecerlo como fondo para cardview:

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#ffffffff"/>

    <stroke android:width="1dp"
        android:color="#ff000000"
        />

    <padding android:left="1dp"
        android:top="1dp"
        android:right="1dp"
        android:bottom="1dp"
        />

    <corners 
        android:topLeftRadius="7dp"
        android:topRightRadius="7dp"/>
</shape>

Answer 7

Puede usar la MaterialCard estándar incluida en la biblioteca oficial de Componentes del material .

Use en su diseño:

compile ''com.android.support:cardview-v7:+''

En su estilo, use el atributo shapeAppearanceOverlay para personalizar la forma (el radio de esquina predeterminado es 4dp )

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_view_outer"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_gravity="center"
    card_view:cardBackgroundColor="@android:color/transparent"
    card_view:cardCornerRadius="0dp"
    card_view:cardElevation="3dp" >

    <android.support.v7.widget.CardView
        xmlns:card_view="http://schemas.android.com/apk/res-auto"
        android:id="@+id/card_view_inner"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_gravity="center"
        android:layout_marginTop="3dp"
        card_view:cardBackgroundColor="@color/green"
        card_view:cardCornerRadius="4dp"
        card_view:cardElevation="0dp" >
    </android.support.v7.widget.CardView>

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

Es el resultado:

Answer 8

Si está configurando el fondo de la tarjeta mediante programación, use cardView.setCardBackgroundColor() y no cardView.setBackgroundColor() y asegúrese de usar la app:cardPreventCornerOverlap="true" en cardView.xml. Eso me lo arregló.

Por cierto, el código anterior (entre comillas) está en Kotlin y no en Java. Utilice el equivalente de Java si está utilizando Java.

Answer 9

Una manera fácil de lograr esto sería:

1.Haga un recurso de fondo personalizado (como una forma de rectángulo) con esquinas redondeadas.

2.configura este fondo personalizado con el comando -

cardView = view.findViewById(R.id.card_view2); cardView.setBackgroundResource(R.drawable.card_view_bg);

Esto funcionó para mí.

El diseño XML que hice con el radio superior izquierdo e inferior derecho.

<shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="@color/white" /> <corners android:topLeftRadius="18dp" android:bottomRightRadius="18dp" /> </shape>

En su caso, solo necesita cambiar topLeftRadius y topRightRadius.

Si tiene un diseño que se superpone con las esquinas de la vista de la tarjeta y quizás tiene un color diferente, entonces es posible que necesite un archivo de recursos de fondo diferente para el diseño y en el xml configure este recurso de fondo en su diseño.

Intenté y probé el método anterior. Espero que esto te ayude.

Answer 10

puedes usar la biblioteca: OptionRoundCardview

Answer 11

dependencies: compile ''com.android.support:cardview-v7:23.1.1''

<android.support.v7.widget.CardView
    android:layout_width="80dp"
    android:layout_height="80dp"
    android:elevation="12dp"
    android:id="@+id/view2"
    app:cardCornerRadius="40dp"
    android:layout_centerHorizontal="true"
    android:innerRadius="0dp"
    android:shape="ring"
    android:thicknessRatio="1.9">
    <ImageView
        android:layout_height="80dp"
        android:layout_width="match_parent"
        android:id="@+id/imageView1"
        android:src="@drawable/Your_image"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true">
    </ImageView>
</android.support.v7.widget.CardView>