Gridview aligns closer to left side of screen - android

I have a GridView within FrameLayout as shown below:
As seen, numbers are aligned closer to left side of the screen. I have tried to bring numbers closer so that i could solve the problem, but failed. Playing around with stretchMode like 'columnWidth' and 'none' couldn't solve my problem. Please suggest me any way that i can fit numbers within background white area.
.xml file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<GridView
android:id="#+id/gridview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/paperbck"
android:columnWidth="30dp"
android:gravity="center"
android:horizontalSpacing="20dp"
android:numColumns="4"
android:stretchMode="columnWidth"
android:verticalSpacing="20dp" />
</FrameLayout>
</LinearLayout>

Try giving left margin to the Grid View.

Related

GridView cuts off last row

I have a GridView that I populate through code, the problem is that the last row it's not fully visible. I don't know why this is happening, the layout of the Activity is pretty simple:
<?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:orientation="vertical">
<GridView
android:id="#+id/sectionGrid"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:horizontalSpacing="0dp"
android:numColumns="1"
android:stretchMode="columnWidth"
android:verticalSpacing="10dp">
</GridView>
</LinearLayout>
And the Layout for the row is the following:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:pew="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/white" >
<ImageView
android:layout_width="match_parent"
android:layout_height="180dp"
android:layout_gravity="center"
android:scaleType="centerCrop"
android:id="#+id/sectionImage"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignTop="#+id/sectionImage"
android:layout_alignLeft="#+id/sectionImage"
android:layout_alignStart="#+id/sectionImage"
android:background="#drawable/bg_section_row"
android:layout_alignBottom="#+id/sectionTitle"
android:layout_alignRight="#+id/sectionImage"
android:layout_alignEnd="#+id/sectionImage"
android:id="#+id/sectionBgView"></RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:textColor="#color/white"
android:scrollHorizontally="true"
android:ellipsize="end"
android:maxLines="1"
android:padding="10dp"
android:layout_alignBottom="#+id/sectionImage"
android:layout_alignLeft="#+id/sectionImage"
android:layout_alignStart="#+id/sectionImage"
android:layout_alignRight="#+id/sectionImage"
android:layout_alignEnd="#+id/sectionImage"
android:id="#+id/sectionTitle"/>
</RelativeLayout>
</LinearLayout>
I'm not sure if it might be related but currently i'm using the following theme:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
What's wrong with the layout? am I missing any property for the GridView?
In GridView android:verticalSpacing or android:horizontalSpacing only works if there is another cell to give spacing between.
Even for the first cell the spacing doesn't get applied in the top but as soon as second cell is drawn the verticalSpacing property works and a gap can be observed between the cell.
In this case, the bottom cell doesn't have any other cell to show below it as a result the last cell looks like being cut from bottom.
Try giving a padding for LinearLayout in row cell.
eg: android:paddingBottom="5dp"
after wasting hours I found out this issue on the library i'm using in order to create a Sliding Menu:
https://github.com/jfeinstein10/SlidingMenu/issues/680
I've added the following code to my BaseActivity (every activity inherits from this):
if(Build.VERSION.SDK_INT >= 21)
getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION);
And it did the trick. The problem seem to happen only on devices with API > 21

Difficulty centering GridView in RelativeLayout

What's up guys, just a quick question. I'm trying to get my GridView to be center inside it's parent which is a RelativeLayout. I want the entire grid to be centered, not the items. From what I'm seeing, the default alignment is "left-aligned" and it's difficult to change this behavior. I tried a few other solutions suggested in other SO questions found here as well as couple others. This seems like something trivial, and that it shouldn't be such a headache. I tried wrapping the GridView inside a LinearLayout with horizontal orientation but to no avail.
The only semi workaround I've found was to mess around with the left and right padding, but even that approach leaves way too much empty space at the sides.
This image is before I changed the padding
This image is after I messed around with padding, but again..seems a bit hackish and not really what I'm looking for. I'm looking for flush center without the extra padding on the sides
Another reason why this approach is impractical is due to the extra space, the selector appears to be too large..as seen in the image below
Any help on this would great, thanks as always!
Code for the layout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/weatherFragRoot"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<GridView
android:id="#+id/menuGridView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/weathermate_lv_background"
android:gravity="center_horizontal"
android:listSelector="#drawable/list_selector"
android:numColumns="3"
android:paddingLeft="30dp"
android:paddingRight="5dp"
android:stretchMode="columnWidth"
android:visibility="invisible" >
</GridView>
</RelativeLayout>
EDIT
As suggest by user, I centered each grid item row inside it's own relative layout..and that gave me the result I was looking for! Here is the updated XML files to reflect the solution
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/weatherFragRoot"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<GridView
android:id="#+id/menuGridView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/weathermate_lv_background"
android:gravity="center_horizontal"
android:listSelector="#drawable/list_selector"
android:numColumns="3"
android:stretchMode="columnWidth"
android:visibility="invisible" >
</GridView>
</RelativeLayout>
This is the layout for the grid row. As you can see, what worked for me was setting the orientation to Horizontal and adding android:layout_centerHorizontal="true" to each child.
<?xml version="1.0" encoding="utf-8"?>
<ImageView
android:id="#+id/menuItem"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerHorizontal="true"
android:background="#android:drawable/ic_menu_add" >
</ImageView>
<TextView
android:id="#+id/tvMenuItemName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/menuItem"
android:layout_centerHorizontal="true"
android:text="Option"
android:textColor="#android:color/white" >
</TextView>
</RelativeLayout>
The answear is to center image and text views in each grids as they have separate layout :)

Android Layout equal width and height

I'm stuck on something that is probably simple but I just can't seem to figure it out. An example of what I'm looking for is a screen with 4 buttons. One taking the entire top left quadrant, the 2nd taking the entire top right quadrant, the 3rd taking the entire bottom left quadrant and the 4th taking the entire bottom right quadrant. The end result would be that the 4 buttons fill the entire screen.
I seem to be able to equally stretch objects to fill the width of the screen or I can stretch objects to fill the height. What I can't seem to figure out is how to stretch the width and height at the same time.
Any help with this would be greatly appreciated.
I imagine you're trying to do this with one LinearLayout. I would probably just use two LinearLayouts to handle it. Something like:
<?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="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1">
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1">
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
Just tested that and it definitely works. LINT says nesting weights is bad for performance, but it definitely has the right layout.

Android, How to stick gallery into left side of screen?

I have two questions.
The first, when i load the activity first item of gallery is in the middle. How to ask android to align it to left? (actually i used align="left" but it seems doesn't work)
the second, my activity includes three items, header, body and footer. currently the footer (gallery) is on top of body. I want bottom of body stays on above of footer instead of behind of footer.
any suggestions appreciated. The image is like this.
the code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android = "http://schemas.android.com/apk/res/android"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
android:background = "#drawable/bg" >
<!-- Loading header of this UI which is coded separately -->
<include
android:id="#+id/header"
layout="#layout/header_bar" />
<GridView
android:id="#+id/news_gridview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dip"
android:numColumns="2"
android:verticalSpacing="5dp"
android:horizontalSpacing="5dp"
android:layout_below="#id/header"
android:layout_centerInParent="true" />
<Gallery
android:id="#+id/gallery"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" />
</RelativeLayout>
For 1st:
Check this existing SO question:
android gallery image position problem
For 2nd:
- You need to include android:layout_above="#+id/gallery" in your GridView.
- Remoev android:layout_centerInParent="true"
In short, define:
<GridView
android:id="#+id/news_gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="10dip"
android:numColumns="2"
android:verticalSpacing="5dp"
android:horizontalSpacing="5dp"
android:layout_below="#+id/header"
android:layout_above="#+id/gallery"/>

Android GridView with ads below

I'm trying to integrate ads (admob) into my Android app. It's mostly working, except for one issue with the layout. My layout consists of:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:app="http://schemas.android.com/apk/res/com.example.photos">
<LinearLayout android:orientation="horizontal"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/status_layout">
<ImageView android:id="#+id/cardStatus"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content" android:text="#string/hello"
android:id="#+id/cardStatusText" />
</LinearLayout>
<GridView android:id="#+id/imageGridView"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:padding="10dp" android:verticalSpacing="10dp"
android:horizontalSpacing="10dp" android:numColumns="auto_fit"
android:columnWidth="100dp" android:stretchMode="columnWidth"
android:gravity="center" android:layout_below="#id/status_layout" />
<!-- Place an AdMob ad at the bottom of the screen. -->
<!-- It has white text on a black background. -->
<!-- The description of the surrounding context is 'Android game'. -->
<com.admob.android.ads.AdView android:id="#+id/ad"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:layout_alignParentBottom="true" app:backgroundColor="#000000"
app:primaryTextColor="#FFFFFF" app:secondaryTextColor="#CCCCCC"
app:keywords="Android Photo" />
</RelativeLayout>
The ads are shown at the bottom of the screen, just as I want. However, they seem to be overlayed or drawn on top of the bottom portion of the grid view. I would like the gridview to be shorter, so that the ad can fill the bottom portion of the screen, and not hide part of the gridview. The problem is most annoying when you scroll all the way to the bottom of the gridview, and you still cannot fully see the last row items in the grid due to the ad.
I'm not sure if this is the standard way that AdMob ads work. If this is the case, adding some padding to the bottom of the grid (if that's possible) would due the trick. That way the user can scroll a bit further, and see the last row in addition to the ad.
I just switched from using LinearLayout to RelativeLayout after reading some similar issues with ListViews. Now my ad is along the bottom instead of above the grid, so I'm getting closer.
Thoughts?
-Kevin
put this property in your gridview
android:layout_above="#+id/ad"

Categories

Resources