CODEWITHSUNDEEP
androidandroid-layout
michael_ferl
michael_ferl

Reputation: 275

RelativeLayout with vertical centered at right

How can I do this simple layout with a RelativeLayout?

--------------------------------
First line
                           9999
Second line
--------------------------------

Two things:

I tried this, but doesn't work

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="6dip"
android:gravity="center_vertical">

<TextView  
    android:id="@+id/second_line"
    android:layout_width="wrap_content"
    android:layout_height="26dip" 
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:singleLine="true"
    android:ellipsize="marquee"
    android:layout_gravity="right"
    android:text="Second Line" />

<TextView android:id="@+id/first_line"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_above="@id/second_line"
    android:layout_alignWithParentIfMissing="true"
    android:singleLine="true"
    android:ellipsize="marquee"
    android:text="First line"
    android:gravity="center_vertical" />

<TextView  
    android:id="@+id/number"
    android:layout_width="wrap_content"
    android:layout_height="fill_parent" 
    android:layout_alignParentRight="true"
    android:layout_toRightOf="@id/first_line"
    android:text="99999" />

</RelativeLayout>

Upvotes: 2

Views: 3968

Answers (4)

igalarzab
igalarzab

Reputation: 916

The key is the android:layout_centerVertical because in a RelativeLayout you can't use a normal android:layout_gravity.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:padding="6dip">

    <TextView 
        android:id="@+id/first_line"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:singleLine="true"
        android:text="First line" />

    <TextView  
        android:id="@+id/second_line"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/first_line"
        android:singleLine="true"
        android:text="Second Line" />

    <TextView  
        android:id="@+id/number"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:text="99999" />

</RelativeLayout>

Upvotes: 8

Code Droid
Code Droid

Reputation: 10472

Basically inside the RelativeLayout which is a ViewGroup btw, put another LinearLayout (with an id so you can reference it) and use that to setup layout. Treat LinearLayout as just another element in the RelativeLayout. So as a general principal you can use Layouts just like other view items. Inside the activity you can even reference them LinearLayout linLayout = (LinearLayout)findViewById(R.id.linearLayoutId);

or treat it as a 

ViewGroup vg = (ViewGroup)findViewById(R.id.linearLayoutId).

A layout is a type of View. A ViewGroup.

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="?android:attr/listPreferredItemHeight"
 android:padding="6dip"
  android:gravity="center_vertical">
 <LinearLayout ..... android:id="@+id/linearLayoutId" android:orientation="vertical">
 <TextView  
android:id="@+id/second_line"
android:layout_width="wrap_content"
android:layout_height="26dip" 
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:singleLine="true"
android:ellipsize="marquee"
android:layout_gravity="right"
android:text="Second Line" />

 <TextView android:id="@+id/first_line"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_above="@id/second_line"
android:layout_alignWithParentIfMissing="true"
android:singleLine="true"
android:ellipsize="marquee"
android:text="First line"
android:gravity="center_vertical" />
<LinearLayout>
<TextView  
android:id="@+id/number"
android:layout_width="wrap_content"
android:layout_height="fill_parent" 
android:layout_alignParentRight="true"
android:layout_toRightOf="@id/linearLayoutId"
android:text="99999" />

</RelativeLayout>

Then something in text view on rigth for centering. Checkout center_vertical etc. You can also combine aligning left/rigth and centervertical.

Upvotes: 0

Nate
Nate

Reputation: 401

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="6dip"
android:gravity="center">

<TextView 
    android:id="@+id/first_line"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_alignWithParentIfMissing="true"
    android:singleLine="true"
    android:text="First line"
     />
<TextView  
    android:id="@+id/number"
    android:layout_width="wrap_content"
    android:layout_height="fill_parent" 
    android:layout_alignParentRight="true"
    android:layout_below="@+id/first_line"
    android:gravity="right"
    android:text="99999" />

<TextView  
    android:id="@+id/second_line"
    android:layout_width="wrap_content"
    android:layout_height="26dip" 
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:singleLine="true"
    android:text="Second Line" />

</RelativeLayout>

enter image description here

Upvotes: 1

user1449018
user1449018

Reputation: 663

Your 9999 text view and either your first line or second line need to be in a horizontal layout of their own. By declaring them each separately you are making things harder on yourself. You can align them in a similar manner using tags that are native to a relative layout but I find it easier to just declare them in groups. I.E. surround the two items that you want to have aligned in a horizontal layout.

Upvotes: 0

Related Questions