it-swarm.com.de

CardView-Eckenradius

Gibt es eine Möglichkeit, CardView nur einen Eckenradius an der Spitze zu haben?

<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"
    >
68
squeeish

Wenn Sie nicht versuchen, die Android-Klasse CardView zu erweitern, können Sie dieses Attribut nicht von XML aus anpassen. 

Es gibt jedoch eine Möglichkeit, diesen Effekt zu erzielen.

Platzieren Sie ein CardView in ein anderes CardView und wenden Sie einen transparenten Hintergrund auf Ihr äußeres CardView an und entfernen Sie den Eckenradius ("cornerRadios = 0dp"). Ihr innerer CardView hat zum Beispiel einen cornerRadius-Wert von 3dp. Wenden Sie dann eine marginTop auf Ihr inneres CardView an, damit die unteren Begrenzungen durch das äußere CardView geschnitten werden. Auf diese Weise wird der Radius der unteren Ecke Ihres inneren CardView ausgeblendet. 

Der XML-Code lautet wie folgt:

 <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>

Und der visuelle Effekt ist folgender:

CardView with rounded corners only on top

Legen Sie Ihren Inhalt immer in Ihr Inneres CardView. Ihre äußere CardView dient nur dazu, die unteren abgerundeten Ecken der inneren CardView "zu verstecken".

87
joao2fast4u
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>
25
shreedhar bhat

Ich habe eine gezeichnete Lib in eine benutzerdefinierte runde Ecke geschrieben. Sie sieht folgendermaßen aus:

 example.png

Sie können diese lib hier bekommen:

https://github.com/mthli/Slice

5
mthli

Sie können diese Zeichenbare XML-Datei verwenden und als Hintergrund für Cardview festlegen: 

<?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>
5
Surender Kumar

Es gibt ein Beispiel, wie Sie dies erreichen können, wenn sich die Karte ganz unten auf dem Bildschirm befindet. Wenn jemand so ein Problem hat, mach einfach so etwas:

<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>

Die Kartenansicht hat einen negativen unteren Rand. Die Ansicht in einer Kartenansicht hat den gleichen, aber positiven unteren Rand. Auf diese Weise werden abgerundete Teile unter dem Bildschirm ausgeblendet, aber alles sieht genau gleich aus, da die Innenansicht einen Rand aufweist.

4
koras

Sie müssen zwei Dinge tun:

1) Rufen Sie setPreventCornerOverlap(false) auf Ihrem CardView auf.

2) Fügen Sie gerundet Imageview in CardView ein

Beim Runden der Bildansicht hatte ich das gleiche Problem, also habe ich eine Bibliothek erstellt, in der Sie unterschiedliche Radien in jeder Ecke einstellen können. Endlich bekam ich das Ergebnis, was ich unten gerne wollte.

https://github.com/pungrue26/SelectableRoundedImageView

Rounded ImageView inside CardView

2
김준호

Ein einfacher Weg, dies zu erreichen, wäre: 

1. Erstellen Sie eine benutzerdefinierte Hintergrundressource (wie eine Rechteckform) mit abgerundeten Ecken.

2. Setzen Sie diesen benutzerdefinierten Hintergrund mit dem Befehl -

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

das hat für mich funktioniert.

Das XML-Layout habe ich mit dem oberen linken und rechten unteren Radius erstellt.

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

In Ihrem Fall müssen Sie nur topLeftRadius sowie topRightRadius ändern.

Wenn Sie ein Layout haben, das mit den Ecken der Kartenansicht überlappt und möglicherweise eine andere Farbe hat, benötigen Sie möglicherweise eine andere Hintergrundressourcendatei für das Layout, und setzen Sie diese Hintergrundressource in der XML-Datei auf Ihr Layout.

Ich habe die obige Methode ausprobiert und getestet. Hoffe das hilft dir.

0
Ankit Deshmukh

Wenn Sie den Kartenhintergrund programmgesteuert einstellen, verwenden Sie cardView.setCardBackgroundColor() und nicht cardView.setBackgroundColor() und stellen Sie sicher, dass app:cardPreventCornerOverlap="true" für cardView.xml verwendet wird. Das hat es für mich behoben.

Übrigens, der obige Code (in Zitaten) befindet sich in Kotlin und nicht in Java. Verwenden Sie die Java-Entsprechung, wenn Sie Java verwenden.

0
Joseph Magara

sie können die Bibliothek verwenden: OptionRoundCardview

 enter image description here

0
qinmiao