Search code examples
androidxmlandroid-studiotextview

How do I add Image/Vector Asset to a border of a circular textview


My Circular textView Drawable

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#e5e5e5" />
    <padding
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp" />
    <size
        android:width="15dp"
        android:height="15dp" />

</shape>

My TextView

<TextView
            android:id="@+id/profile_thumbnail"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:background="@drawable/circular_text_view"
            android:gravity="center"
            android:text="MP"
            android:textColor="#333333" />

What I want my TextView to look like

This is what mine looks like


Solution

  • I have created sample like that you can Customise according to your need

    Here is my sample image for your reference you can customise my code accordingly to your image

    <androidx.constraintlayout.widget.ConstraintLayout
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                app:layout_constraintBottom_toBottomOf="parent"
                                app:layout_constraintEnd_toEndOf="parent"
                                app:layout_constraintStart_toStartOf="parent">
    
                                <ImageView
                                    android:id="@+id/rewards_icon"
                                    android:layout_width="@dimen/_60sdp"
                                    android:layout_height="@dimen/_60sdp"
                                    android:src="@drawable/ic_baseline_card_giftcard_24"
                                    app:layout_constraintStart_toStartOf="parent"
                                    app:layout_constraintTop_toTopOf="parent" />
    
                                <TextView
                                    android:id="@+id/rewards_tv"
                                    android:layout_width="@dimen/_30sdp"
                                    android:layout_height="@dimen/_30sdp"
                                    android:layout_marginStart="@dimen/_minus20sdp"
                                    android:background="@drawable/profile_reward_count"
                                    android:gravity="center"
                                    android:text="0"
                                    android:textColor="@color/quiz_prev_text"
                                    android:textSize="@dimen/_16sdp"
                                    android:textStyle="bold"
                                    app:layout_constraintStart_toEndOf="@id/rewards_icon"
                                    app:layout_constraintTop_toTopOf="parent" />                            </androidx.constraintlayout.widget.ConstraintLayout>
    

    Here is the code for shape

      <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
    
        <solid
            android:color="@color/quiz_submit"/>
    
        <size
            android:width="25dp"
            android:height="25dp"/>
    </shape>
    

    I hope my answer will help you!!