Hinzufügen farbigen Rand auf cardview?

Ich bin neu auf Android und dies ist meine erste Frage hier.

Ich versuche, fügen Sie einen farbigen vertikalen Grenze am Anfang der cardview. Wie kann ich es erreichen, das auf xml ? Ich habe versucht, hinzufügen, mit leeren textview ist es aber vermasselt die ganze cardview selbst. Bitte überprüfen Sie das Bild link gepostet unten, zum Beispiel.

Farbige Rand auf Cardview

activity_main.xml

<android.support.v7.widget.CardView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    card_view:contentPadding="16dp"
    card_view:cardElevation="2dp"
    card_view:cardCornerRadius="5dp">

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            style="@style/Base.TextAppearance.AppCompat.Headline"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Title" />

        <TextView
            style="@style/Base.TextAppearance.AppCompat.Body1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Content here" />

    </LinearLayout>

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

Vielen Dank

müssen Sie verwenden eine cardview hier? was nur ein Flugzeug linearlayout und das hinzufügen einer ItemDecoration zu Ihrem recycler anzeigen?
Ich bin ein Anfänger auf Android-und recyclerview ist etwas advanced für meine aktuelle skill-set. Also, ich bin mit cardview hier.
okay, ich habe eine Lösung für Sie unten

InformationsquelleAutor George Forster | 2016-02-12

tun versuchen:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    card_view:cardElevation="2dp"
    card_view:cardCornerRadius="5dp">

    <FrameLayout
        android:background="#FF0000"
        android:layout_width="4dp"
        android:layout_height="match_parent"/>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:orientation="vertical">

        <TextView
            style="@style/Base.TextAppearance.AppCompat.Headline"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Title" />

        <TextView
            style="@style/Base.TextAppearance.AppCompat.Body1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Content here" />

    </LinearLayout>

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

dieser entfernt die Polsterung aus der cardview und fügt ein FrameLayout mit einer Farbe. Sie müssen dann fix die Polsterung im LinearLayout dann für die anderen Felder

Update

Wenn Sie möchten, bewahren Sie die Karte Eckenradius erstellen card_edge.xml in drawable Ordner:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="#F00" />
    <size android:width="10dp"/>
    <padding android:bottom="0dp" android:left="0dp" android:right="0dp" android:top="0dp"/>
    <corners android:topLeftRadius="5dp" android:bottomLeftRadius="5dp"
        android:topRightRadius="0.1dp" android:bottomRightRadius="0.1dp"/>
</shape>

und in der frame-layout verwenden android:background="@drawable/card_edge"

aktualisiert ein drawable hintergrund erhalten die Karte Ecken, wenn Sie wollen, noch haben Sie
funktionierte nicht für mich. warum 4 dp Breite für den frame-layout?

InformationsquelleAutor kandroidj

29

Start Von der material-design-update, it-support app:strokeColor und auch app:strokeWidth. sehen Sie mehr

Verwendung material-design-update. fügen Sie folgenden code zum build.gradle(app)
```
dependencies {
    //...
    implementation 'com.google.android.material:material:1.0.0'
    //...
  }
```
- Beste Antwort! Keine XML-Zeug auf den Punkt.
- Konnte nicht gefunden bis.
- ändern cardView zu MaterialCardView
InformationsquelleAutor Aung Myo Lwin

Ich denke, diese Lösung ist nicht effizient, aber es dient dem Zweck, und fügt hinzu, Flexibilität mit der Rahmenbreite.

 <android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="40dp"
    android:layout_gravity="center"
    card_view:cardBackgroundColor="@color/some_color"
    card_view:cardCornerRadius="20dp"
    card_view:contentPadding="5dp"> <!-- Change it to customize the border width -->

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        card_view:cardCornerRadius="20dp"
        card_view:contentPadding="5dp">

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

         <!-- Add your UI elements -->

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

Dies ist eine schlechte Lösung. Fügen Sie die view-Hierarchie-Ebene, die hätte Einbußen bei der Leistung.
Gute Idee, es sollte verfügbar sein-innere Funktionen
dies ist nicht die Leistung bietet, aber ich habe nicht einen massiven hit mithilfe dieser

InformationsquelleAutor Amit

Ich möchte zu verbessern, die vorgeschlagene Lösung von Amit. Ich bin die Nutzung der vorhandenen Ressourcen ohne zusätzliche shapes oder Views. Ich gebe CardView eine Hintergrundfarbe und dann verschachtelte layout, Farbe weiß zu überdrucken noch mit einigen leftMargin...

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    card_view:cardElevation="2dp"
    card_view:cardBackgroundColor="@color/some_color"
    card_view:cardCornerRadius="5dp">


    <!-- The left margin decides the width of the border -->

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:layout_marginLeft="5dp"
        android:background="#fff"
        android:orientation="vertical">

        <TextView
            style="@style/Base.TextAppearance.AppCompat.Headline"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Title" />

        <TextView
            style="@style/Base.TextAppearance.AppCompat.Body1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Content here" />

    </LinearLayout>

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

InformationsquelleAutor Mirwise Khan

-1

Ich dies Problem gelöst, indem Sie zwei CardViews in einem RelativeLayout. Ein hintergrund mit der Rahmenfarbe und die andere mit dem Bild. (oder was auch immer Sie verwenden möchten)

Hinweis: die Marge Hinzugefügt, um top-und der start für die zweite CardView. In meinem Fall entschied ich mich für eine 2dp dicken Rand.

            <android.support.v7.widget.CardView
            android:id="@+id/user_thumb_rounded_background"
            android:layout_width="36dp"
            android:layout_height="36dp"
            app:cardCornerRadius="18dp"
            android:layout_marginEnd="6dp">

            <ImageView
                android:id="@+id/user_thumb_background"
                android:background="@color/colorPrimaryDark"
                android:layout_width="36dp"
                android:layout_height="36dp" />

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

        <android.support.v7.widget.CardView
            android:id="@+id/user_thumb_rounded"
            android:layout_width="32dp"
            android:layout_height="32dp"
            app:cardCornerRadius="16dp"
            android:layout_marginTop="2dp"
            android:layout_marginStart="2dp"
            android:layout_marginEnd="6dp">

        <ImageView
            android:id="@+id/user_thumb"
            android:src="@drawable/default_profile"
            android:layout_width="32dp"
            android:layout_height="32dp" />

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

InformationsquelleAutor John T

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.