Search code examples
androidcardview

How to add arrow to cardview right side


I have rectangle Cardview

enter image description here

how to add to my cardview something as an arrow or triangle (it can be with no dot)

enter image description here

like as on the right side of this image?

<androidx.cardview.widget.CardView
    android:id="@+id/cardView"
    android:layout_width="wrap_content"
    android:layout_height="20dp"
    android:layout_marginTop="2dp"
    android:layout_gravity="start"
    android:layout_marginRight="2dp"
    android:background="@android:color/transparent">
        <TextView
            android:id="@+id/text"
            android:layout_width="wrap_content"
            android:layout_height="20dp"
            android:layout_gravity="center"
            ........
            android:text="asdasdasdsdasdaadsaasd"
             />
</androidx.cardview.widget.CardView>

color and text of cardview I'm applying via adapter and arrow color should be the same


Solution

  • Create a vector drawable of the required shape, bg_img.xml. You can use this site to create vector from an image. However, this is not always accurate, so once xml is generated you can try playing with it, to adjust.

    <vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="200dp"
        android:height="200dp"
        android:viewportWidth="3276"
        android:viewportHeight="1840">
        <path
            android:fillColor="#ED1C24"
            android:pathData="M0 0L2263.5 0L2264 2.5L3237.5 881L3276 913.5L3276 932.5Q3276 933.5 3271.5 933L2266.5 1840L0 1840L0 0Z"
            android:strokeWidth="1"
            android:strokeColor="#ED1C24" />
    </vector>
    

    Set this as background to your textView

    <TextView
          android:id="@+id/text"
          android:layout_width="wrap_content"
          android:layout_height="20dp"
          android:layout_gravity="center"
          android:backgroud="@drawable/bg_img"
          android:text="asdasdasdsdasdaadsaasd"/>