user11482962
user11482962

Reputation:

Can't center the TextView using RelativeLayout

I've got an issue with my TextView, I just can't center it. Here's what it should look like : enter image description here

And it's actually look like that
enter image description here

Here's my XML code

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

    <TextView
        android:id="@+id/magnitudeTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_margin="10dp"
        android:textSize="15sp" />

    <TextView
        android:id="@+id/cityNameTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_margin="10dp"
        android:textSize="15sp" />

    <TextView
        android:id="@+id/dateTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_margin="10dp"
        android:textSize="15sp" />

</RelativeLayout>

Upvotes: 2

Views: 74

Answers (6)

Dev.Barai
Dev.Barai

Reputation: 92

The Below technique work for me.That is: Use your first TextView as left orient and middle TextView as center oriented and last TextView as right oriented and apply weight for each TextView.

Your code it would be like this:

      <?xml version="1.0" encoding="utf-8"?>
    <Linearlayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        orientation=vertical
        weightsum=3
>

        <TextView
            android:id="@+id/magnitudeTV"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true"
            android:layout_margin="10dp"
            android:textSize="15sp"
            android:layout_weight=1 />

        <TextView
            android:id="@+id/cityNameTV"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:textSize="15sp" 
            android:layout_weight=1/>

        <TextView
            android:id="@+id/dateTV"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_margin="10dp"
            android:textSize="15sp" 
            android:layout_weight=1/>
    </LinearLayout>

`

Upvotes: 1

Wasiq Ahmadzai
Wasiq Ahmadzai

Reputation: 231

Instead of RelativeLayout you can use LinearLayout in which you can set the weightsum to 3 that will give you more reliable solution. Every TextView will get the equal amount of space in a row.

Upvotes: 1

eManna
eManna

Reputation: 2482

Using a LinearLayout with horizontal orientation along with a weightsum of 3 for the children text view would give you a light and more reliable solution, doing it like the following:

               <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:weightSum="3"
                    android:orientation="horizontal">

                    <TextView
                        android:id="@+id/magnitudeTV"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="10dp"
                        android:layout_weight="1"
                        android:text="test"
                        android:textSize="15sp" />

                    <TextView
                        android:id="@+id/cityNameTV"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="test"
                        android:gravity="center"
                        android:layout_weight="1"
                        android:layout_margin="10dp"
                        android:textSize="15sp" />

                    <TextView
                        android:id="@+id/dateTV"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:layout_margin="10dp"
                        android:textSize="15sp" />

                </LinearLayout>

Now each of your text views will take exactly 1/3 of the whole screen width, if you want the center one to be bigger you can play with the layout_weight value in each of the text view to match your desired design.

Upvotes: 1

Rajat Kumar Tyagi
Rajat Kumar Tyagi

Reputation: 116

You can achieve this by doing this :

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

    <TextView
        android:id="@+id/magnitudeTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:text="sdf34 "
        android:textColor="#000000"
        android:textSize="15sp" />

    <TextView
        android:id="@+id/cityNameTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/magnitudeTV"
        android:layout_margin="10dp"
        android:text="dasdasdsadasdds"
        android:textColor="#000000"
        android:textSize="15sp" />

    <TextView
        android:layout_toRightOf="@id/cityNameTV"
        android:id="@+id/dateTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:text="fg25111dfg"
        android:textColor="#000000"
        android:textSize="15sp" />

</RelativeLayout>




but according to me it is not a good solution for this you can con-catenate all the three strings and than set the final string to one single text view as mentioned below:


  String final_string = distance +" "+string_2  +" "+string_3;
    textView.setText(final_string);

Upvotes: 0

Kushan
Kushan

Reputation: 5984

Generally, a linear layout with weights would suit these kinds of needs, the system will automatically divide the screen into parts depending on the weightsum you mentioned

  <LinearLayout
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:weightSum = "5"
     android:orientation = "horizontal"
     />

    <TextView
      android:id="@+id/magnitudeTV"
      android:layout_width="0dp"
      android:layout_weight = "1"
      android:layout_height="wrap_content"
      android:layout_alignParentStart="true"
      android:layout_alignParentLeft="true"
      android:layout_margin="10dp"
      android:textSize="15sp" />

    <TextView
      android:id="@+id/cityNameTV"
      android:layout_width="0dp"
      android:layout_weight = "3"
      android:layout_height="wrap_content"
      android:layout_centerHorizontal="true"
      android:layout_margin="10dp"
      android:textSize="15sp" />

    <TextView
      android:id="@+id/dateTV"
      android:layout_width="0dp"
      android:layout_weight = "1"
      android:layout_height="wrap_content"
      android:layout_alignParentEnd="true"
      android:layout_alignParentRight="true"
      android:layout_margin="10dp"
      android:textSize="15sp" />

</LinearLayout>

Upvotes: 0

r2rek
r2rek

Reputation: 2263

A horizontal LinearLayout would provide a better and lighter solution for your problem. What you'd do is wrap your three textviews in it, then use layout_width=wrap_content for the ones to the left and right and layout_width=0dp layout_weight=1

for the middle one

Upvotes: 0

Related Questions