user7641488
user7641488

Reputation:

Grid View shows in front of tool bar not below

I just Create a simple an xml file with a tool bar and grid view, the problem is the grid view show infornt of tool bar not below the tool bar like this Grid View

and this is my xml file

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:context="abtech.waiteriano.com.waitrer.MenuActivity">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize" />

    <GridView
        android:id="@+id/menuGridView"
        android:layout_width="match_parent"
        android:background="#d2d2d2"
        android:layout_height="fill_parent"
        android:layout_margin="4dp"
        android:columnWidth="80dp"
        android:gravity="center"
        android:horizontalSpacing="5dp"
        android:numColumns="3"
        android:stretchMode="columnWidth"
        android:layout_below="@+id/toolbar" />
</FrameLayout>

Upvotes: 1

Views: 271

Answers (3)

sodhankit
sodhankit

Reputation: 1248

FrameLayout is designed to display a single item.

Generally FrameLayout should be used to hold single child view.

You can however add multiple children to a FrameLayout and control their position within the FrameLayout.

So if you want to continue with FrameLayout then you can add LinearLayout or RelativeLayout as child inside FrameLayout as given below.

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<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="wrap_content"
android:orientation="vertical">

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    android:minHeight="?attr/actionBarSize" />

<GridView
    android:id="@+id/menuGridView"
    android:layout_width="match_parent"
    android:background="#d2d2d2"
    android:layout_height="fill_parent"
    android:layout_margin="4dp"
    android:columnWidth="80dp"
    android:gravity="center"
    android:horizontalSpacing="5dp"
    android:numColumns="3"
    android:stretchMode="columnWidth"
    android:layout_below="@+id/toolbar" />

Upvotes: 2

MarcGV
MarcGV

Reputation: 1262

You have diferent options

  • Change your FrameLayout for LinearLayout (orientation vertical)

  • Change your FrameLayout for RelativeLayout and use 'layout_below'

I recommend you to use LinearLayout

Examples:

LinearLayout

<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="wrap_content"
    android:orientation="vertical"
    tools:context="abtech.waiteriano.com.waitrer.MenuActivity">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize" />

    <GridView
        android:id="@+id/menuGridView"
        android:layout_width="match_parent"
        android:background="#d2d2d2"
        android:layout_height="fill_parent"
        android:layout_margin="4dp"
        android:columnWidth="80dp"
        android:gravity="center"
        android:horizontalSpacing="5dp"
        android:numColumns="3"
        android:stretchMode="columnWidth" />
</LinearLayout>

RelativeLayout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:context="abtech.waiteriano.com.waitrer.MenuActivity">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize" />

    <GridView
        android:id="@+id/menuGridView"
        android:layout_width="match_parent"
        android:background="#d2d2d2"
        android:layout_height="fill_parent"
        android:layout_margin="4dp"
        android:columnWidth="80dp"
        android:gravity="center"
        android:horizontalSpacing="5dp"
        android:numColumns="3"
        android:stretchMode="columnWidth"
        android:layout_below="@id/toolbar" />
</RelativeLayout>

Upvotes: 2

Nika Kurdadze
Nika Kurdadze

Reputation: 2512

Change FrameLayout to LinearLayout and set the orientation to vertical :

<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="wrap_content"
    android:orientation="vertical"
    tools:context="abtech.waiteriano.com.waitrer.MenuActivity">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize" />

    <GridView
        android:id="@+id/menuGridView"
        android:layout_width="match_parent"
        android:background="#d2d2d2"
        android:layout_height="fill_parent"
        android:layout_margin="4dp"
        android:columnWidth="80dp"
        android:gravity="center"
        android:horizontalSpacing="5dp"
        android:numColumns="3"
        android:stretchMode="columnWidth"
        android:layout_below="@+id/toolbar" />
</LinearLayout >

Upvotes: 1

Related Questions