Aligning textviews on the left and right edges in Android layout
Solution 1:
Use a RelativeLayout
with layout_alignParentLeft
and layout_alignParentRight
:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:id="@+id/mytextview1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:id="@+id/mytextview2"/>
</RelativeLayout>
Also, you should probably be using dip
(or dp
) rather than sp
in your layout. sp
reflect text settings as well as screen density so they're usually only for sizing text items.
Solution 2:
You can use the gravity property to "float" views.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_vertical|center_horizontal"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:layout_weight="1"
android:text="Left Aligned"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_weight="1"
android:text="Right Aligned"
/>
</LinearLayout>
</LinearLayout>
Solution 3:
It can be done with LinearLayout
(less overhead and more control than the Relative Layout option). Give the second view the remaining space so gravity
can work. Tested back to API 16.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Aligned left" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="end"
android:text="Aligned right" />
</LinearLayout>
If you want to limit the size of the first text view, do this:
Adjust weights as required. Relative layout won't allow you to set a percentage weight like this, only a fixed dp of one of the views
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Aligned left but too long and would squash the other view" />
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:gravity="end"
android:text="Aligned right" />
</LinearLayout>
Solution 4:
Even with Rollin_s's tip, Dave Webb's answer didn't work for me. The text in the right TextView
was still overlapping the text in the left TextView
.
I eventually got the behavior I wanted with something like this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout01"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp">
<TextView
android:id="@+id/mytextview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true" />
<TextView
android:id="@+id/mytextview2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/mytextview1"
android:gravity="right"/>
</RelativeLayout>
Note that mytextview2 has "android:layout_width"
set as "match_parent"
.
Hope this helps someone!
Solution 5:
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Hello world" />
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gud bye" />