Center a TextView inside another View in Android Relative Layout

Question

In my relative layout, I have a circle View and a TextView. I would like to center the TextView exactly within the circle View. How do I do that? The code I have so far is below:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <View
        android:id="@+id/firstCircle"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:layout_marginLeft="24dp"
        android:layout_marginTop="24dp"
        android:background="@drawable/circle" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="1"
        android:id="@+id/number1" />

</RelativeLayout>

I want the final result to look like:

Screenshot

can you please share a reference Image what you are exactly looking for? — Dhrumil Shah - dhuma1981, Jul 28 '16 at 06:11
View is not ViewGroup. Means you can not take TextView or Button inside that. there is large difference between View And ViewGroup. refer this http://stackoverflow.com/a/34676816/6176457 @KrishnaJ — anonymous, Jul 28 '16 at 06:16

score 2 · Answer 1 · answered Jul 28 '16 at 06:17

try this

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <View
        android:id="@+id/firstCircle"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:layout_marginLeft="24dp"
        android:layout_marginTop="24dp"
        android:background="@drawable/circle" >
    </View>

    <TextView
        android:id="@+id/number1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="30dp"
        android:layout_marginTop="28dp"
        android:text="1" />

</RelativeLayout>

score 1 · Answer 2 · answered Jul 28 '16 at 06:16

To paste a view on other framelyout is used.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


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

        <View
            android:id="@+id/firstCircle"
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:layout_marginLeft="24dp"
            android:layout_marginTop="24dp"
            android:background="@drawable/circle" />

        <TextView
            android:id="@+id/number1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1"
            android:layout_alignBottom="@+id/firstCircle"
            android:layout_alignRight="@+id/firstCircle"
            android:layout_alignEnd="@+id/firstCircle"
            android:layout_alignLeft="@+id/firstCircle"
            android:layout_alignStart="@+id/firstCircle"
            android:layout_alignTop="@+id/firstCircle"
            android:gravity="center" />
    </RelativeLayout>

</FrameLayout>

score 1 · Answer 3 · answered Jul 28 '16 at 06:22

<?xml version="1.0" encoding="utf-8"?>


<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">

        <View
            android:id="@+id/firstCircle"
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:layout_marginLeft="24dp"
            android:layout_marginTop="24dp"
            android:background="@drawable/circle" />

        <TextView
            android:id="@+id/number1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1"
            android:layout_alignBottom="@+id/firstCircle"
            android:layout_alignRight="@+id/firstCircle"
            android:layout_alignEnd="@+id/firstCircle"
            android:layout_alignLeft="@+id/firstCircle"
            android:layout_alignStart="@+id/firstCircle"
            android:layout_alignTop="@+id/firstCircle"
            android:gravity="center" />
    </RelativeLayout>

in your textview just set textsize to say 7-9 sp in above code — Ankesh kumar Jaisansaria, Jul 28 '16 at 11:09

score 0 · Answer 4 · answered Jul 28 '16 at 06:08

0

Change your view by any one layout as below it will work better,

 <LinearLayout
    android:id="@+id/firstCircle"
    android:layout_width="24dp"
    android:layout_height="24dp"
    android:layout_marginLeft="24dp"
    android:layout_marginTop="24dp"
    android:gravity="center"
    android:layout_gravity="center"
    android:background="@drawable/circle">

   <TextView
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="1"
       android:gravity="center"
       android:id="@+id/number1" />
</LinearLayout>

answered Jul 28 '16 at 06:08

Vickyexpert

3,147
5
21
34

he is asking for a relative one not linear ;) – Charuක Jul 28 '16 at 06:10
I know and I said to use another inside view as Linear or relative whatever for better performance – Vickyexpert Jul 28 '16 at 06:12

V-rund Puro-hit · Answer 5 · 2016-07-28T06:20:12.223

I think you want circleview as background of TextView. then why not that view as background as TextView.

Try this.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/circle"
        android:text="1"
        android:gravity="center"
        android:padding="10dp"
        android:id="@+id/number1" />

</RelativeLayout>

Note : you can adjust padding according to your need

score 0 · Accepted Answer · answered Jul 28 '16 at 06:13

You don't need to use some extra View, simply set circle image as background of TextView and set gravity to center as below:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        xmlns:app="http://schemas.android.com/apk/res-auto">


        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1"
            android:gravity="center"
            android:background="@drawable/circle"
            android:id="@+id/number1" />

    </RelativeLayout>

Center a TextView inside another View in Android Relative Layout

6 Answers6