Question

Please see designer’s picture:

Now see what I’m getting:

Here is my layout:

<LinearLayout android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content"
            android:background="@drawable/nav_back">
        <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
                android:drawableTop="@drawable/home"
                android:background="@drawable/nav_selected"
                android:layout_weight="1"
                android:textColor="#FFF"
                android:textSize="10dp"
                android:text="Home"/>
        <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
                android:drawableTop="@drawable/home_g"
                android:background="@drawable/nav_back"
                android:layout_weight="1"
                android:textColor="#FFF"
                android:textSize="10dp"
                android:text="This is long string that pushes layout"/>
        <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
                android:drawableTop="@drawable/available_g"
                android:background="@drawable/nav_back"
                android:layout_weight="1"
                android:textColor="#FFF"
                android:textSize="10dp"
                android:text="Available"/>
        <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
                android:drawableTop="@drawable/completed_g"
                android:background="@drawable/nav_back"
                android:layout_weight="1"
                android:textColor="#FFF"
                android:textSize="10dp"
                android:text="Completed"/>
        <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
                android:drawableTop="@drawable/mail_g"
                android:background="@drawable/nav_back"
                android:layout_weight="1"
                android:textColor="#FFF"
                android:textSize="10dp"
                android:text="Mail"/>

    </LinearLayout>

Questions. How do I:

1. Make sure no matter what – screen broken down to 5 even segments – so all buttons even no matter text inside.

2. If one button pushes layout down – how do I make sure other buttons fill that vertical space as well? Like home button is not all way down – you can see where nav_selected ends

3. I have icons in PNG in 3 sizes as per google format. I want to have some padding for drawableTop if possible so icons look smaller on my screen – closer to what designers screen look.

Thanks!

Answer 1

Read about layout_weight on this page in the section about LinearLayouts. That is the attribute you’re going to want to use to get the views to all get the same width. I am not super familiar with its implementation but I would think you probably wont want width set to wrap_content when you do it that way.

Edit:

Tip: To create a proportionate size
layout on the screen, create a
container view group object with the
layout_width and layout_height
attributes set to fill_parent; assign
the children height or width to 0
(zero); then assign relative weight
values to each child, depending on
what proportion of the screen each
should have.

This seems like what you want to do.