Android Title + Button in titlebar not coming properly aligned

Question

I am trying to add title + button in titlebar in Android. But somehow i am not happy with the kind of result i am getting. May be something wrong with code. Has anyone tried this earlier ? My .xml is below

code.xml

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

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="40dip"
            android:background="#484848"
            android:orientation="horizontal">

        <TextView
            android:id="@+id/windowtitle"
            android:layout_width="match_parent"
            android:layout_marginTop="2dip"
            android:layout_height="wrap_content"
            android:text="Support"
            android:gravity="center_horizontal"
            android:textSize="30sp" ></TextView>

        <Button
            android:id="@+id/syncbutton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginTop="3dip"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:gravity="left"
            android:text="Sync" />

       </RelativeLayout>


    </RelativeLayout>

Answer 1

Replace your XML with below code..

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

   <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#484848"

            android:orientation="horizontal">

        <TextView
            android:id="@+id/windowtitle"
            android:layout_width="fill_parent"
           android:layout_centerInParent="true"
            android:layout_height="wrap_content"
            android:text="Support"
            android:gravity="center_horizontal|center_vertical"
            android:textSize="30sp" ></TextView>

        <Button
            android:id="@+id/syncbutton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:layout_marginTop="3dip"
            android:layout_alignParentRight="true"


            android:text="Sync" />

       </RelativeLayout>

</RelativeLayout>

Hope this work.....

Answer 2

Please mention exact issue you are facing, I assume the alignment of the two views is not proper is the issue. You can give the relative position of the button with respect to the text view to the button xml,

android:layout_toRightOf="@+id/windowtitle"

Also, add the alignment to the textview

Answer 3

Try this..

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

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="40dip"
            android:background="#484848">

        <TextView
            android:id="@+id/windowtitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Support"
            android:layout_centerHorizontal="true"
            android:textSize="30sp" ></TextView>

        <Button
            android:id="@+id/syncbutton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:text="Sync" />

       </RelativeLayout>


    </RelativeLayout>

Here is my screen

Answer 4

Remove android:gravity="center_horizontal" from windowtitle Textview and add android:layout_centerInParent="true" even change width to wrap_content.

and add android:layout_centerVertical="true" to syncbutton button and there is no need of android:layout_alignParentTop="true"

It all centered your views.

check below xml:

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

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="40dip"
        android:background="#484848"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/windowtitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:layout_marginTop="2dip"
            android:text="Support"
            android:textSize="30sp" >
        </TextView>

        <Button
            android:id="@+id/syncbutton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:layout_gravity="center"
            android:layout_marginTop="3dip"
            android:gravity="left"
            android:text="Sync" />
    </RelativeLayout>

</RelativeLayout>

Answer 5

Use this

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

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="50dip"
    android:background="#484848" >

    <TextView
        android:id="@+id/windowtitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Support"
        android:textSize="30sp" >
    </TextView>

    <Button
        android:id="@+id/syncbutton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:text="Sync" />
</RelativeLayout>

Answer 6

Use the following Code this might fullfill your requirement:

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

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#484848"
            android:orientation="horizontal">

        <TextView
            android:id="@+id/windowtitle"
            android:layout_width="match_parent"
          android:layout_centerVertical="true"
            android:layout_height="wrap_content"
            android:text="Support"
            android:gravity="center_horizontal"
            android:textSize="30sp" ></TextView>

        <Button
            android:id="@+id/syncbutton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"  

            android:layout_alignParentRight="true"            
            android:text="Sync" />

       </RelativeLayout>


    </RelativeLayout>

Answer 7

use this

 <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="40dip"
            android:background="#484848"
            android:orientation="horizontal">

        <TextView
            android:id="@+id/windowtitle"
            android:layout_width="wrap_content"
            android:layout_marginTop="2dip"
            android:layout_height="wrap_content"
            android:text="Support"
            android:gravity="center_horizontal"
            android:textSize="30sp" ></TextView>

        <Button
            android:id="@+id/syncbutton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
           android:layout_centerVertical="true"
            android:layout_alignParentRight="true"

            android:text="Sync" />

       </RelativeLayout>