Android linear layout align center and right

Question

This is what I have:

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="@+id/LinearLayout01"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:background="#FFFFFF">
    <LinearLayout android:id="@+id/LinearLayout01"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal"
        android:background="#E30000"
        android:layout_gravity="center_horizontal|center_vertical"
        android:gravity="center_horizontal|center_vertical">
        <TextView 
            android:id="@+id/TextView00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#FFFFFF"
            android:textSize="20px"
            android:textStyle="bold"
            android:text="Something"
            android:gravity="right|center_vertical"
            />
        <LinearLayout android:id="@+id/LinearLayout01"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:orientation="horizontal"
            android:gravity="right|center_vertical"
            android:layout_gravity="center_vertical"
            android:background="#E30000">
            <Button 
                android:id="@+id/btnCalls"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:drawableLeft="@drawable/icon"
                android:gravity="right|center_vertical"
            />
        </LinearLayout>
    </LinearLayout>
</LinearLayout>

And I want this:

So horizontal center align the text and vertical center align the button.

What am I missing? I haven't tried RelativeLayout and I would prefer LinearLayout to work this out.

Agora

Answer 1

try this one

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="@+id/LinearLayout01"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:background="#FFFFFF">
    <LinearLayout android:id="@+id/LinearLayout01"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal"
        android:background="#E30000"
        android:layout_gravity="center_horizontal|center_vertical" 
        android:gravity="center_vertical">
        <TextView 
            android:id="@+id/TextView00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#FFFFFF"
            android:textSize="20px"
            android:textStyle="bold"
            android:text="Something"
            android:layout_weight="1" 
            android:gravity="center"/>
        <LinearLayout android:id="@+id/LinearLayout01"
            android:layout_height="wrap_content"
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:orientation="horizontal"
            android:gravity="right|center_vertical"
            android:layout_gravity="center_vertical"
            android:background="#E30000"                
            android:layout_width="wrap_content">
            <Button 
                android:id="@+id/btnCalls"
                android:layout_width="wrap_content"
                android:drawableLeft="@drawable/icon"
                android:gravity="right|center_vertical" 
                android:layout_height="wrap_content" 
                android:layout_margin="5dip"/>
        </LinearLayout>
    </LinearLayout>
</LinearLayout>

Approbation

Almost. The textview is in the center of the place left to the button, but not in the center of the width of the display. – Agora

I missed the part about textView being aligned at the center of display. How should text be aligned if it's wider than width of display minus width of a button? – Approbation

I figured it out that if the textview and the linearlayout are next to each other that means I can center align the text in the textview but not in the width of the display. So with linear layout this problem cannot be solved. – Agora

it leaves you with to options than - adding left marging to your textView the size of the button (or adding fake invisible button to the left of the text, the same size of the one on the right, which is actually a dirty hack) or using relative layout – Approbation

Yes with this hacks it can be worked out. I solved it by using relative layout. Notwithstanding I accept your solution considering you were the nearest to the solution and for the idea of hacks. – Agora

Yeah, I believe relative layout is the best solution. Thanks =) – Approbation

you are adding both gravity, layout_gravity for LinearLayout01.Does it make any effect on view positioning?? @Approbation – Christopher

Answer 2

android:gravity="right|center_vertical"

aligns your TextView to the right. How about center_horizontal?

And your LinearLayouts have the same ID, if there is not more code, then I would delete one of them.

Germanism

try setting the width of the textview to fill_parent – Germanism

This is not a solution. Gravity works only on text contents. Don't know how this gets upvoted. – Cronin

Answer 3

I found none of the answers work exactly as the OP intended, but the RelativeLayout solution was the closest one. Except that the TextView wasn't centered. But, with layout_centerInParent=true, works like a charm:

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <TextView 
         android:id="@+id/TextView00"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:textColor="#FFFFFF"
         android:textSize="20px"
         android:textStyle="bold"
         android:text="Something"
         android:layout_centerInParent="true" />

    <Button 
         android:id="@+id/btnCalls"
         android:drawableLeft="@drawable/icon"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_alignParentRight="true"/>
</RelativeLayout>

Extortionate

"layout_centerInParent=true" worked for me to center my textview! – Bettyannbettye

Answer 4

you have used android:gravity="right|center_vertical" in your textview. Use android:gravity="center".

Nightgown

Answer 5

Try to add empty View inside horizontal LinearLayout between element that you want see left and element that you want to see right, e.g.:

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <View
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="1"
            />                

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </LinearLayout>

Mozambique

Please do not post the exact same answer to multiple questions. If the questions are duplicates, please leave a comment on the question indicating that. If the questions are not duplicates, then please tailor your code and your answer to the question asked. – Highspirited

Answer 6

I think,gravity means the position of things inside the component(for textview,it means the text you have given)in component where layout_gravity means position of component itself in the whole layout.So...

Try Using:

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout android:id="@+id/LinearLayout01"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:background="#FFFFFF"
        >
        <LinearLayout android:id="@+id/LinearLayout01"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:orientation="horizontal"
            android:background="#E30000"
            android:layout_gravity="right"
            android:gravity="center_vertical|right"                    
            >
                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="right|center_vertical"
                    android:gravity="center_vertical|center" 
                    android:layout_weight="0.9"
                >
                    <TextView 
                        android:id="@+id/TextView00"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:textColor="#FFFFFF"
                        android:textSize="20px"
                        android:textStyle="bold"
                        android:text="Something"
                        android:gravity="center_horizontal"
                        android:layout_gravity="center_horizontal|center_vertical" 

                    />
                </LinearLayout>
                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="right|center_vertical"
                    android:gravity="center_vertical|right"                    
                    android:paddingTop="5dip"
                    android:layout_weight="0.1"
                >
                    <Button 
                        android:id="@+id/btnCalls"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:drawableLeft="@drawable/icon"
                        android:layout_gravity="center_vertical"
                        android:gravity="center"                                    
                    />
                </LinearLayout>
        </LinearLayout>
    </LinearLayout>

Brickkiln

Nothing. The button became wider. – Agora

please check the edited answer. it uses some hard fixes like paddingTop="5dip" but it might not be an issue for you.please adjust it as per the image you use in place of android icon. – Brickkiln

The android:layout_marginLeft="150px" is a solution, however this is a hard fix I don't like. Not it is clear that the problem can only be worked out with relativelayout. – Agora

Answer 7

define layout weight for TextView and LinearLayout

set android:layout_weight="1" to TextView

set android:layout_weight="0" to LinearLayout

and also change the layout_width="wrap_content" to LinearLayout and set layout_gravity="center" to TextView

Skyla

No it doesn't. I figured it out that if the textview and the linearlayout are next to each other that means I can center align the text in the textview but not in the width of the display. – Agora

better to use relative layout.If you don't have idea in relative layout i will provide the answer for above layout. – Skyla

Answer 8

Just use RelativeLayout, and wallaaa!!!

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <TextView 
         android:id="@+id/TextView00"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:textColor="#FFFFFF"
         android:textSize="20px"
         android:textStyle="bold"
         android:text="Something"
         android:gravity="center" />

    <Button 
         android:id="@+id/btnCalls"
         android:drawableLeft="@drawable/icon"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_alignParentRight="true"/>
</RelativeLayout>

Unarmed

Answer 9

The solution for this is- android:gravity="center_vertical"

Normally you'll also have to take care of its parent's position too to make sure it works.

Demolition