Nested vertical layout in horizontal layout

Question

I'm creating an android app and I want to create a layout that has two buttons side by side and three buttons underneath. An example of what I am trying to do can be found here:

http://mycolorscreen.com/2014/11/29/flatdrop-zw-skin/

I am struggling to get the two buttons to be side by side in a horizontal linear layout and also have the three buttons in a vertical linear layout. Since the first linear layout is horizontal it will make my buttons become horizontal as well. My code is as follows:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity"
android:weightSum="1">

<TextView
        android:layout_width="164dp"
        android:layout_height="wrap_content"
        android:text="New Text"
        android:id="@+id/textView2"
        android:layout_gravity="left"
        android:layout_weight="0.1" />

    <TextView
        android:layout_width="174dp"
        android:layout_height="wrap_content"
        android:text="New Text"
        android:id="@+id/textView"
        android:layout_gravity="right"
        android:layout_weight="0.1" />

<LinearLayout
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    style="@style/AppTheme"
    android:longClickable="false"
    android:weightSum="1">



    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/btnFitnessGoalsDefaultString"
        android:textColor="#FFFFFF"
        android:id="@+id/btnFitnessGoals"
        android:background="@drawable/buttondefault"
        android:layout_marginBottom="10dp"
        android:layout_weight="0.10"
        android:layout_gravity="top" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:text="@string/btnNutritionGoalsDefaultString"
        android:textColor="#FFFFFF"
        android:id="@+id/btnNutritionGoals"
        android:background="@drawable/buttondefault"
        android:layout_weight="0.10" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/btnBonusEventsDefaultString"
        android:textColor="#FFFFFF"
        android:id="@+id/btnBonusEvents"
        android:background="@drawable/buttondefault"
        android:layout_weight="0.10" />
</LinearLayout>
</LinearLayout>

Solution 1

Use something like this:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/button1"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_weight="1"
            android:text="Button" />

        <Button
            android:id="@+id/button2"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_weight="1"
            android:text="Button" />
    </LinearLayout>

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

        <Button
                android:id="@+id/button3"
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:text="Button" />

            <Button
                android:id="@+id/button4"
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:text="Button" />

            <Button
                android:id="@+id/button5"
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:text="Button" />

    </LinearLayout>

</LinearLayout>

Solution 2

You need to do something like this

<LinearLayout
    android:orientation="vertical">

      <LinearLayout
         android:orientation="horizontal">

           <!-- horizontal buttons here -->

      </LinearLayout>

      <LinearLayout
        android:orientation="vertical">

           <!-- vertical buttons here -->

      </LinearLayout>
</LinearLayout>

Comments

[Bhetzie]

Thank you for the help!!