adapt bottom menu to all screens

Question

I have designed one bottom menu in mu android app

it works fine in the screen which I work on

but if I change the screen , it doesn't fill all the width of screen even if I set width of the relativeLayout to fill_parent

here is the code of the menu :

    <RelativeLayout
    android:id="@+id/bar_bas"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:orientation="horizontal" >

    <RelativeLayout
        android:id="@+id/relativeLayout1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@null"
        android:clickable="true" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/right_left"
            android:text="test"
            android:textColor="#bfd2b0" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/relativeLayout2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@+id/relativeLayout1"
        android:clickable="true" >

        <Button
            android:id="@+id/btn_circle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/left_circle"
            android:text="test"
            android:textColor="#bfd2b0" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/relativeLayout3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginLeft="-40dp"
        android:layout_toRightOf="@+id/relativeLayout2"
        android:clickable="true" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/circle"
            android:text="test"
            android:textColor="#bfd2b0" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/relativeLayout4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="-38dp"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@+id/relativeLayout3"
        android:clickable="true" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/right_circle"
            android:text="test"
            android:textColor="#bfd2b0" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/relativeLayout5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@+id/relativeLayout4"
        android:clickable="true" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/right_left"
            android:text="test"
            android:textColor="#bfd2b0" />
    </RelativeLayout>
</RelativeLayout>

and here is how it is in my screen : http://s23.postimg.org/m3h37utuj/image.png and here an example of other screen(tablet screen) : http://s24.postimg.org/hd0ibrahh/image.png

how can I fix this issue

Drake29a · Answer 1 · 2013-10-10T09:51:42.760

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/bar_bas"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >

<Button
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="#ff00ff"
    android:text="test"
    android:layout_weight="1"
    android:textColor="#bfd2b0" />

<Button
    android:id="@+id/btn_circle"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="#FF0000"
    android:text="test"
    android:layout_weight="1"
    android:textColor="#bfd2b0" />

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#ff00AA"
    android:text="test"
    android:layout_weight="1"
    android:textColor="#bfd2b0" />

<Button
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="#ffaaff"
    android:text="test"
    android:layout_weight="1"
    android:textColor="#bfd2b0" />

<Button
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="#00AAff"
    android:text="test"
    android:layout_weight="1"
    android:textColor="#bfd2b0" />

</LinearLayout>

Check this one, wrap_parent means it will take as less space as it can.

score 0 · Answer 2 · answered Oct 10 '13 at 09:37

Try this..

<LinearLayout
    android:id="@+id/bar_bas"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:orientation="horizontal" >       

        <Button
            android:layout_height="0dp"
            android:layout_weight="0.2"
            android:layout_height="wrap_content"
            android:background="@drawable/right_left"
            android:text="test"
            android:textColor="#bfd2b0" />

        <Button
            android:id="@+id/btn_circle"
             android:layout_height="0dp"
            android:layout_weight="0.2"
            android:layout_height="wrap_content"
            android:background="@drawable/left_circle"
            android:text="test"
            android:textColor="#bfd2b0" />        

        <Button
             android:layout_height="0dp"
            android:layout_weight="0.2"
            android:layout_height="wrap_content"
            android:background="@drawable/circle"
            android:text="test"
            android:textColor="#bfd2b0" />       

        <Button
             android:layout_height="0dp"
            android:layout_weight="0.2"
            android:layout_height="wrap_content"
            android:background="@drawable/right_circle"
            android:text="test"
            android:textColor="#bfd2b0" />        

        <Button
             android:layout_height="0dp"
            android:layout_weight="0.2"
            android:layout_height="wrap_content"
            android:background="@drawable/right_left"
            android:text="test"
            android:textColor="#bfd2b0" />

</LinearLayout>

adapt bottom menu to all screens

2 Answers2