Using Gridview and Button in LinearLayout - android

I tried add button below gridview in linearlayout at following code. But when i execute my app i only see gridview there is no button item. So it may basic mistake but i can't see it.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:background="#2a2a2a"
>
<GridView
android:id="#+id/grid_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnWidth="150dp"
android:numColumns="auto_fit"
android:horizontalSpacing="10dp"
android:verticalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"></GridView>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:text="#string/cam_string" />
</LinearLayout>

Change the orientation of your LinearLayout to vertical. I suspect you're not seeing the Button because the GridView takes up all horizontal space, then the LinearLayout adds the Button in a place off the screen that's not visible. You also may want to change the layout_height of the GridView to "0dip" and give it the `android:layout_weight=1' attribute so that it will fill all space except that taken up by the Button.

Other than the suggested Solution by others you can try the alternative using relative layout.
You can use a RelativeLayout for this purpose instead of LinearLayout.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#2a2a2a" >
<GridView
android:id="#+id/grid_view"
android:layout_above="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnWidth="150dp"
android:numColumns="auto_fit"
android:horizontalSpacing="10dp"
android:verticalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"></GridView>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:text="#string/cam_string" />
</RelativeLayout>

Related

Center gridlayout in linearlayout

I have a Gridlayout inside a Linearlayout and want the Gridlayout to be horizontally centered (ie. same distance to the left and right):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/outerLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="10pt"
android:paddingRight="10pt"
android:orientation="vertical"
android:gravity="center"
tools:context=".MainActivity">
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:columnWidth="200px"
android:horizontalSpacing="0dp"
android:numColumns="auto_fit"
android:stretchMode="none"
android:verticalSpacing="0dp" />
<Button
android:id="#+id/startButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Start..."/>
</LinearLayout>
The Gridlayout is centered, but does not appear to be so, since it does not tightly wrap its content (there is still "empty space" inside the Gridlayout on the right side), even though layout_width="wrap_content" is set.
you need to use stretchMode as spacing width uniform instead of none. Set gravity as center.
There are two more options in StretchMode. Check this link
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:columnWidth="200px"
android:gravity="center"
android:horizontalSpacing="0dp"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:verticalSpacing="0dp" />

How to set the screens size of Grid view to match all screen sizes?

Here i have used a gridview but it is not changing according to the screen size.I think there is a problem with height.the xml used for gridview is given below.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:background="#drawable/bg"
android:orientation="vertical" >
<GridView
android:id="#+id/gridView1"
android:numColumns="3"
android:gravity="center"
android:paddingTop="20dp"
android:horizontalSpacing="10dp"
android:verticalSpacing="10dp"
android:stretchMode="columnWidth"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/linearLayout1"
android:layout_centerVertical="true"
>
</GridView>
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<com.assuretech.ku.HorizontalMenuBar
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>
From what I can see. You need to close the RelativeLayout at the end. I've included my screenshot of your code with it closed. I changed the background to red to see the text.
I guess you are looking for
numColumns = "auto_fit"
as GridView attribute
Firstly you must be using some layout to put your gridview in. Do the following:
Make height and width of the layout to fill parent:
android:layout_width="fill_parent"
android:layout_height="fill_parent"
then, set height and width of your gridview to fill_parent as well.
Well, this is just a supposed solution that you might have been working this way
Hope this works for you.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="30dp">
<GridView
android:id="#+id/grid_images"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnWidth="100dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:verticalSpacing="15dp">
</GridView>
</LinearLayout>

Group More Than One Controls At Android

I had created a window with RelativeLayout and insterted two controls in it; one is GridView and the other one is WebView.
I will bind images to gridview to use like menu and i will load a html page in webview for ads.
But i have problems with these controls.
For example, if user scrolls gridview vertically it is disappearing behind webview however, in that i was expecting webview was slide with gridview too when user scroll gridview.
So i wonder, can i group these controls together to act simultaneously?
My another problem with orientation, when i turn my device to landscape mode webview is disappearing from screen.
Lastly if i set GridView's layout_height attribute fill_parent, i can't see WebView, so i set it as wrap_content. But this time WebView doesn't align at bottom, it aligns at GridView's after and there is space between screen bottom and webview.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/bg480480">
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:numColumns="auto_fit"
android:verticalSpacing="45dp"
android:horizontalSpacing="10dp"
android:columnWidth="150dp"
android:stretchMode="columnWidth"
android:gravity="center"
android:layout_marginTop="30dp"
android:scrollbars="none"
android:layout_alignParentTop="true" />
<WebView
android:id="#+id/webView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerInside"
android:gravity="bottom"
android:layout_below="#id/gridview" />
</RelativeLayout>
Here are some screen shots.
I guess the main problem is that both the GridView and the Webview specify layout_height="fill_parent". I guess you probably don't want the GridView to fill the whole parent area, so use "wrap_content" instead.
I don't know enough of the desired layout of the page but I would recommend using a LinearLayout to start and get comfortable. It really depends what the grid view and the web view should show and where your main content is.
In the example below I have simply assumed that your web view wants to take up the majority of the screen.
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#ff0000"
android:numColumns="auto_fit"
android:verticalSpacing="45dp"
android:horizontalSpacing="10dp"
android:columnWidth="150dp"
android:stretchMode="columnWidth"
android:layout_marginTop="30dp"
android:scrollbars="none"
/>
<WebView
android:id="#+id/webView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00ff00"
android:scaleType="centerInside" />
</LinearLayout>
If the assumption is not correct then you would probably specify it the other way round (Webview=>wrap_conent)
Improve the WebView layout code as below:
<GridView
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/webView1"
android:layout_alignParentTop="true"
android:layout_marginTop="30dp"
android:columnWidth="150dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="auto_fit"
android:scrollbars="none"
android:stretchMode="columnWidth"
android:verticalSpacing="45dp" />
<WebView
android:id="#+id/webView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="bottom"
android:scaleType="centerInside" />
FYI, android:layout_alignParentBottom="true" will display WebView at the bottom of the screen. and include android:layout_above="#+id/webView1" inside the GridView.
Give a try to this layout code.
You need to add
android:layout_above="#+id/webView1"
in your gridview
also
android:layout_alignParentBottom="true"
in your webview
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/bg480480"
android:orientation="vertical"
>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:numColumns="auto_fit"
android:verticalSpacing="45dp"
android:horizontalSpacing="10dp"
android:columnWidth="150dp"
android:stretchMode="columnWidth"
android:gravity="center"
android:layout_above="#+id/webView1"
android:layout_marginTop="30dp"
android:scrollbars="none"
android:layout_alignParentTop="true" />
<WebView
android:id="#+id/webView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_below="#id/gridview" />
</RelativeLayout>

Center elements in GridView

I have GridView with 6 images in 2 columns. I want to display this 6 images in the middle of the screen. I set gravity properties to center but this center elements only horizontally. GridView takes whole screen.
<GridView
android:id="#+id/gridview"
android:layout_above="#id/ad" android:layout_alignParentTop="true"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="2"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:background="#ffffff"
android:gravity="center"
/>
Here is what I did to get the items in the gridview to center (notice the stretchmode, columnwidth, gravity and horizontal and vertical spacing):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:padding="5dp" >
<GridView
android:id="#+id/gridview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnWidth="100dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="3"
android:stretchMode="spacingWidthUniform"
android:verticalSpacing="10dp" />
</LinearLayout>
It took me a while to figure it out, but messing with those different values I was able to get them to center.
Try wrapping your GridView in a LinearLayout that has it's child elements centered and change your gridview's layout_height to "wrap_content". ex:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:gravity="center"
android:layout_gravity="center">
<GridView
android:id="#+id/homeGridView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:numColumns="3"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center" />
</LinearLayout>
Need to set the following attributes:
android:stretchMode="columnWidth"
...and...
android:gravity="center"
well, in case you are using a custom adapter thing to inflate single rowview inside your gridview then try to add android:gravity="center" to the layout of your single_row.. this will do the trick hopefully :)
i.e,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >
<ImageView
android:id="#+id/ivClrBlock"
android:layout_width="88dp"
android:layout_height="88dp"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
/>
<TextView
android:id="#+id/tvClrName"
android:layout_width="88dp"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:text="#string/color_name"
android:textSize="15sp" />
</LinearLayout>
Issue occurred when I updated the gridview adapter from:
gridView = inflater.inflate(R.layout.mobile, null);
to
gridView = inflater.inflate(R.layout.mobile, parent, false);
so I just reversed back using a try catch if the old (null) version failed.
Try to change this:
android:layout_height="fill_parent"
into
android:layout_height="wrap_content"
You are now telling your grid view to fill it's parent height and width fully.
Here is my answer:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/linearLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<GridView
android:id="#+id/gridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnWidth="100dip"
android:gravity="center"
android:numColumns="3"
android:stretchMode="spacingWidthUniform"
android:verticalSpacing="10dip" />
</LinearLayout>
Don't use padding or horizontalSpacing if you don't need it as it may cause problems with other views.
Note also that fill_parent is already deprecated.
I hope this will solve your problem:
<LinearLayout
android:layout_gravity="center_horizontal"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<GridLayout
android:id="#+id/gridlayou4x3"
android:rowCount="4"
android:columnCount="3"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="80"
android:minWidth="25px"
android:minHeight="25px" />
</LinearLayout>
I found that you just have the gridlayout wrap content on height and width.
android:layout_centerHorizontal="true"
It will center itself for the size it needs but if you have it matching the parent. You are technically centering it based with a lot of parent empty space offsetting your children.

Why can't I add elements after a GridView?

I've got the following layout XML file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main_layout" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:orientation="vertical">
<GridView android:id="#+id/main_grid_screen"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:numColumns="auto_fit" android:verticalSpacing="30dp"
android:horizontalSpacing="10dp" android:columnWidth="90dp"
android:stretchMode="columnWidth" android:gravity="center" />
<Button android:id="#+id/clickable_area" android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/view_items_area" />
</LinearLayout>
The GridView shows up perfectly fine; however, the Button below it is completely absent. If I place the Button tag above the GridView, it appears. What gives?
I think it is because of the fill_parent attributes. The GridView is most likely taking up the entire screen and blocking your view of the button. You could try wrap_content instead.

Categories

Resources