Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Text View with circular background

Tags:

android

xml

I want my TextView to have rounded border and want that ring to be filled with red color.

card_text_border.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="10dp"
    android:thickness="15dp"
    android:useLevel="false"
    android:shape="ring" >
    <solid 
        android:color="@color/PrimaryDarkColor"/>
    <stroke 
        android:width="4px"
        android:color="#000000" />
</shape>

This is my TextView

<TextView
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:text="0"
    android:id="@+id/txtView_cart"
    android:paddingRight="10dp"
    android:background="@drawable/card_text_border"
    android:layout_gravity="top|right"/>
like image 567
arps Avatar asked Jan 08 '16 10:01

arps


3 Answers

Using the following code:

White_circle_drawable.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
     android:shape="oval">
    <solid android:color="#A6ffffff"/>
    <stroke android:width="0dp" android:color="#fff" />
    <size android:width="28dp" android:height="28dp"/>
</shape>

TextView

<TextView
    android:id="@+id/TextViewID"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="5dp"
    android:paddingTop="5dp"
    android:text="2"
    android:layout_marginTop="2dp"
    android:layout_marginBottom="2dp"
    android:gravity="center"
    android:visibility="gone"
    android:textColor="#ff2800"                
    android:background="@drawable/white_circle_drawable"
    android:textSize="13sp" />
like image 144
Ehsan Anjum Avatar answered Oct 16 '22 17:10

Ehsan Anjum


Here is solution :

circular_textview.xml code

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
      android:shape="oval" >
        <corners android:radius="10dip" />
    <stroke
         android:width="5dip"
         android:color="@color/red" />
   <solid android:color="@color/red" />

Here is textView in main.xml

            <TextView
                android:layout_width="27dp"
                android:layout_height="27dp"
                android:layout_gravity="center_vertical"
                android:layout_marginLeft="5dp"
              android:background="@drawable/circular_textview"
                android:gravity="center"
                android:padding="5dp"
                android:text="@string/tag_2"
                android:textColor="@color/white"
                android:textSize="12sp" />

This will help you.

like image 34
Sanwal Singh Avatar answered Oct 16 '22 19:10

Sanwal Singh


such great answers up there, I am going to add my way.

first, create a drawable file and add the following code and you should be good to go.

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#A6E41010" />
<size
android:width="36dp"
android:height="36dp" />
<corners android:radius="18dp" />
</shape> 
like image 22
Ahmad Dalao Avatar answered Oct 16 '22 19:10

Ahmad Dalao