How to make this android button layout 6 buttons in a single row fills whole screen

Question

Here image of what i want. They need to be scaled according to the screen size. If screen size is 1920x1080p they should look perfect.

Here what i tried but it fails nothing visible

    <ImageButton
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/imageButton_register"
    android:background="@null"
    android:src="@drawable/bgbutton_1"
    android:adjustViewBounds="true"
    android:scaleType="centerCrop"
    android:layout_centerInParent="true"
    />

<ImageButton
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/imageButton_register2"
    android:background="@null"
    android:src="@drawable/button1"
    android:adjustViewBounds="true"
    android:scaleType="centerCrop"
    android:layout_centerInParent="true"
    />

<ImageButton
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/imageButton_register3"
    android:background="@null"
    android:src="@drawable/button2"
    android:adjustViewBounds="true"
    android:scaleType="centerCrop"
    android:layout_centerInParent="true"
    />

I am using android studio and api is 9 on windows 8.1

the images are exact size 1080x560 pixel and 1080x200 pixel

enter image description here

weight layout properties solve your problem – Santosh Mar 20 '15 at 12:06 — Santosh, Mar 20 '15 at 12:06

score 2 · Accepted Answer · edited Mar 20 '15 at 13:05

Use Linear Layout give orientation=vertical place your image buttons inside this, give weight_sum=100 to your linear layout, then you can give weight to your image buttons in percentage Like if you have 2 imagebuttons give weight=50 to each imagebutton, and if you have 5 imagebuttons give weight=20 to each imagebutton Use this:

<LinearLayout
        android:id="@+id/linearButtons"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:weightSum="100" >

<ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageButton_register"
        android:src="@drawable/bgbutton_1"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:layout_weight="16.6"/>

<ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageButton_register2"
        android:src="@drawable/button1"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:layout_weight="16.6"/>

<ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageButton_register"
        android:src="@drawable/bgbutton_1"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:layout_weight="16.6"/>

<ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageButton_register2"
        android:src="@drawable/button1"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:layout_weight="16.6"/>

<ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageButton_register"
        android:src="@drawable/bgbutton_1"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:layout_weight="16.6"/>

<ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageButton_register2"
        android:src="@drawable/button1"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:layout_weight="16.6"/>
</LinearLayout>

score 1 · Answer 2 · edited Mar 20 '15 at 13:16

Try This Code:

<LinearLayout
        android:id="@+id/ll_main_view_about_us_screen"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:weightSum="6" >

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:layout_weight="1"
            android:background="@color/text_black" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:layout_weight="1"
            android:background="@color/text_black" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:layout_weight="1"
            android:background="@color/text_black" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:layout_weight="1"
            android:background="@color/text_black" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:layout_weight="1"
            android:background="@color/text_black" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:layout_weight="1"
            android:background="@color/text_black" />
</LinearLayout>

How to make this android button layout 6 buttons in a single row fills whole screen

2 Answers2