Search code examples
androidandroid-layoutandroid-linearlayout

How to create layout with 8 button around central button in android

enter image description here

How can i create layout something like this i had created with use of weight but output is not proper as i expected it. I also have 3 buttons horizontally at bottom of screen. i had added sample code for first row. kindly help me to achieve it.

<LinearLayout
        android:layout_width="match_parent"
        android:id="@+id/demo_l1"
        android:layout_centerInParent="true"
        android:orientation="vertical"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:orientation="horizontal"
            android:weightSum="4"
            android:layout_height="wrap_content">

            <ImageView
                android:layout_weight="1"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
            <ImageView
                android:layout_weight="1"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
            <ImageView
                android:layout_weight="1"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />

            <ImageView
                android:layout_weight="1"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />            </LinearLayout>
Solution

  • Just try this way,this is exactly what you looking for

     <?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/black"
    android:fitsSystemWindows="true"
    android:orientation="vertical">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:orientation="horizontal"
        android:padding="5dp"
        android:visibility="visible">



        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1.0"
            android:orientation="vertical">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_marginBottom="10dp"
                android:layout_weight="1.0"
                android:gravity="right|bottom"
                android:orientation="vertical">





                <Button
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:padding="15dp"
                    android:text="F"

                    android:src="@mipmap/ic_launcher" />



            </LinearLayout>


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_marginTop="5dp"
                android:layout_weight="1.0"
                android:gravity="top|right"
                android:orientation="vertical">

                <Button
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:padding="15dp"
                    android:text="E"

                    android:src="@mipmap/ic_launcher" />
            </LinearLayout>

        </LinearLayout>



        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:orientation="vertical">


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1.0"
                android:gravity="bottom|center"
                android:orientation="horizontal">

                <Button
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:padding="15dp"
                    android:text="A"
                    android:src="@mipmap/ic_launcher" />
                <Button
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:padding="15dp"
                    android:text="A"
                    android:src="@mipmap/ic_launcher" />



            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/menu_marging_pading_20pd"
                android:gravity="center"
                android:orientation="vertical">

                <Button
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:padding="15dp"
                    android:text="G"

                    android:src="@mipmap/ic_launcher" />


            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1.0"
                android:gravity="center|top"
                android:orientation="horizontal">

                <Button
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:padding="15dp"
                    android:text="D"

                    android:src="@mipmap/ic_launcher" />
                <Button
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:padding="15dp"
                    android:text="A"
                    android:src="@mipmap/ic_launcher" />

            </LinearLayout>


        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1.0"
            android:gravity="center|center_vertical"
            android:orientation="vertical">


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_marginBottom="@dimen/menu_marging_pading_10pd"
                android:layout_weight="1.0"
                android:gravity="start|bottom"
                android:orientation="vertical">

                <Button
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:padding="15dp"
                    android:text="B"

                    android:src="@mipmap/ic_launcher" />

            </LinearLayout>


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_marginTop="5dp"
                android:layout_weight="1.0"
                android:gravity="start|top"
                android:orientation="vertical">

                <Button
                    android:layout_width="65dp"
                    android:layout_height="65dp"
                    android:padding="15dp"
                    android:text="C"

                    android:src="@mipmap/ic_launcher" />
            </LinearLayout>

        </LinearLayout>

    </LinearLayout>



</android.support.design.widget.CoordinatorLayout>

    OUTPUT

    enter image description here