marchemike
marchemike

Reputation: 3277

Placing elements below other elements in Framelayout with Linearlayout

I created a android layout xml for some of my screens, and apparently I am using a navigation drawer in my app which is why I am using a frame layout. Now I've added a linear layout that will show the following:

A text view with a submit button

2 image buttons

This is a sample layout of what I want:

enter image description here

The problem is when I made my layout, I can't seem to pull down the 2 buttons to make them below the submit and because what happens is that both of the buttons are on the right side of the layout, like this:

enter image description here

This is my xml code:

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="mypackage.test.HomeActivity" >

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <LinearLayout 
            android:id="@+id/linerlayout"
            android:layout_width="match_parent"
            android:layout_height="100dp"
              android:gravity="center_horizontal"

            >
                    <EditText
            android:id="@+id/editText1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ems="10"
            android:hint="Enter ID"
            >

            <requestFocus />
        </EditText>

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Submit" /> 
         <!--
        I'm trying to put the two buttons here but what happens is they both disappear when I put them

        -->      

        <Button
            android:id="@+id/button2"
            android:text="Button"
 android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

        <Button
            android:id="@+id/button3"
            android:text="Button" 
 android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>          
        </LinearLayout>

        </FrameLayout>

    <fragment
        android:id="@+id/navigation_drawer"
        android:name="mypackage.test.NavigationDrawerFragment"
        android:layout_width="@dimen/navigation_drawer_width"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        tools:layout="@layout/fragment_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>

How do I pull the two buttons to go down? Should I transfer the buttons to another layout?

Upvotes: 12

Views: 28061

Answers (2)

Kartik
Kartik

Reputation: 7917

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="mypackage.test.HomeActivity">

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <EditText
                android:id="@+id/editText1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_toLeftOf="@+id/button1"
                android:ems="10"
                android:hint="Enter ID">

                <requestFocus />
            </EditText>

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="48dp"
                android:layout_alignParentRight="true"
                android:text="Submit" />


            <Button
                android:id="@+id/button3"
                android:text="Button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/editText1"
                android:layout_alignRight="@+id/editText1" />

            <Button
                android:id="@+id/button2"
                android:text="Button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/button3"
                android:layout_alignRight="@+id/button3" />
        </RelativeLayout>
    </FrameLayout>

    <fragment
        android:id="@+id/navigation_drawer"
        android:layout_width="@dimen/navigation_drawer_width"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        tools:layout="@layout/fragment_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>

Upvotes: 0

Christian Abella
Christian Abella

Reputation: 5797

You can put the two other buttons outside of the LinearLayout layout so that they will appear on the bottom. Like this:

<FrameLayout
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
        android:id="@+id/linerlayout"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:gravity="center_horizontal"

        >
        <EditText
            android:id="@+id/editText1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ems="10"
            android:hint="Enter ID"
            >
        <requestFocus />
        </EditText>
        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Submit" />

    </LinearLayout>

    <Button
        android:id="@+id/button3"
        android:text="Button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right|bottom"/>

    <Button
        android:id="@+id/button2"
        android:text="Button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right|center_vertical"/>

</FrameLayout>

Upvotes: 7

Related Questions