Question

I am developing an Android application’s home screen and I am trying to lay out 4 ImageButtons in android in the following orientation:

a | b
_____

c | d

For example A is centered in the top left of the screen, b is centered in the top right of the screen, c is centered in the bottom left of the screen, and d is centered in the bottom right of the screen. All of the images are 512×512 pixels and therefore, since they are very big, should be automatically shrunk if the screen size is small. I am not concerned with stretching them.

I have tried essentially all the different kinds of layouts in Android and I’m having a terrible time trying to figure this out, after 2.5 hours of experimentation and research I am reaching out for help. Does anyone know how to do this or of a sample open source app that does this?

Answer 1

You should set weights on your LinearLayouts and ImageButtons and the ImageButton ScaleTypes to fitXY like so

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1.0"
        android:orientation="horizontal>
        <ImageButton
            android:src="@drawable/myimage1"
            android:layout_height="fill_parent"
            android:layout_width="0dp"
            android:layout_weight="1.0"
            android:scaleType="fitXY"/>
        <ImageButton
            android:src="@drawable/myimage2"
            anroid:layout_height="fill_parent"
            android:layout_width="0dp"
            android:layout_weight="1.0"
            android:scaleType="fitXY"/>
    </LinearLayout>
    <LinearLayout
         //same as above horizontal layout with same children for buttons 3 and 4
    </LinearLayout>
</LinearLayout>

Weights divide up the space according to percentage of total weights of children. So if two children each have weight 1.0, they get 50% of the space. In order for weights to act on that view, you should specify the dimension you would like weight calculated to 0dp. ScaleType fitXY just fits the image into the space available to the ImageButton.