Android GridView OnItemClickListener area - android

I have a GridView that displays a bunch of thumbnail images. All looks good, but when I click on an item, only the upper right hand portion of the image will register the onitemclicklistener call. If I click the lower left hand corner, nothing happens. When I fill the gridview with many images, clicking on certain images will trigger the call at the wrong position.
Here is some relevant code from the adapter:
imageView = new ImageView(mContext);
final float scale = getBaseContext().getResources().getDisplayMetrics().density;
int pixels = (int) (155 * scale + 0.5f);
imageView.setLayoutParams(new GridView.LayoutParams(pixels, pixels));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setPadding(8, 8, 8, 8);
Here is the listener code:
GridView gridview = (GridView) findViewById(R.id.gridview);
gridview.setAdapter(new ImageAdapter(this));
gridview.setOnItemClickListener(new OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
Intent intent = new Intent(MobialGrid.this,MobialImageInd.class);
intent.putExtra("image", file[position].getAbsolutePath());
startActivity(intent);
}
});
Here is the grid xml:
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnWidth="160dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"
android:paddingTop="15dp"
android:paddingBottom="15dp"
android:background="#drawable/dark_bg_repeat"
/>
Thanks for any comments.

Try to add the listener on the imageviews in your adapter, that might help...

Related

setOnItemClickListener for GridView in PopupWindow doesn't work

If i have a GridView in a normal Activity it works fine. But here I have it in a PopupWindow, and I tried everything to get it to work, but onItemClick won't get called! I tried with the following, which were solutions for most people, but they didn't work for me (perhaps i've misused them?):
android:clickable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:descendantFocusability="blocksDescendants"
Part of the activity:
bgGrid.setAdapter(new ImageAdapter(context));
bgGrid.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> arg0, View v, int position, long id) {
Log.v("CLICK", "ITEM SELECTED " + position);
}
});
pw = new PopupWindow(layout, posx, posy);
pw.setOutsideTouchable(false);
pw.showAtLocation(layout, Gravity.CENTER, 0, 0); //bgGrid is part of layout
And xml:
<?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:background="#444444"
android:orientation="vertical"
android:padding="5dip" >
<GridView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:columnWidth="160dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:verticalSpacing="10dp" >
</GridView>
<Button
android:id="#+id/popup_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:onClick="closePopup"
android:text="Close" />
</LinearLayout>
ImageAdapter
public class ImageAdapter extends BaseAdapter {
private Context mContext;
public ImageAdapter(Context c) {
mContext = c;
}
public int getCount() {
return mThumbIds.length;
}
public Object getItem(int position) {
return null;
}
public long getItemId(int position) {
return 0;
}
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) { mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams(160, 120));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
} else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
The whole popup part is in a PereferenceActivity, where I have a listener which detects a click on Preference and opens Popup. Apparently there can be only one listener, and I can't set onClick to Preference so I don't know how to solve this (onPreferenceClick never detects any clicks). The first listener which calls the popup (the only way I could get that click):
images = (Preference) findPreference("prefs_bg");
images.setOnPreferenceClickListener(new BackgroundColorSelector());
Click is shown on the screen (I even tried drawSelectorOnTop), but no matter what, click won't get through.
recently face this problem and found solution here
popupWindow.setFocusable(true);
duplicate problem with solution:
Cannot execute OnItemClick for GridView in PopupWindow
I've found a perfect solution for me:
popUpWindow.setOutsideTouchable(true);
popUpWindow.setBackgroundDrawable(getResources().getDrawable(android.R.color.white));
popUpWindow.setFocusable(true);
The first line enables touch event outside popupwindow.
Without the second line touch event will be prevented by the popupwindow.
And the third line solves your problem.
Without the first and the two, the user interface will not response to any touch/click event when happens outside the popupwindow.
Make sure that the layouts that your ImageAdapter is inflating do not have any OnItemClickListeners registered and/or have android:focussable=false set on the Adapter layouts.
Such as:
<ImageView
android:id="#+id/imageViewIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:focussable=false
/>

Rectangular images in GridView

How can I create a GirdView in which the images are rectangular (120 x 58.5), which would result in a non square cell? Currently if I have this XML layout there is whitespace above and below the image because the cell is 120 x 120. The width of each cell should be 120 and the height 58.
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/AppsOverviewGrid"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnWidth="120dp"
android:numColumns="auto_fit"
android:verticalSpacing="0dp"
android:horizontalSpacing="8dp"
android:stretchMode="columnWidth"
android:gravity="center">
</GridView>
Thanks for the help.
In my opinion, ideal solution is to create a layout file for the items in gridview layout in which you can specify the height of the images (using an ImageView). Then you can use a custom adapter with LayoutInflater to connect your grid view items with your main layout.
Here is a great tutorial for that (2. example): http://www.mkyong.com/android/android-gridview-example/
the easiest aproach for this is just to set the width and height of the imageview in the adapter.
public class ImageAdapter extends BaseAdapter {
// create a new ImageView for each item referenced by the Adapter
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
// if it's not recycled, initialize some attributes
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams(120, 58));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setPadding(8, 8, 8, 8);
} else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(pictureArray[position]);
return imageView;
}
// references to our images
private Integer[] pictureArray= {
R.drawable.pic1, R.drawable.pic2,
}
}
Then set the Adapter to the gridview.
GridView gridview = (GridView) findViewById(R.id.gridview);
gridview.setAdapter(new ImageAdapter(this));

How to show a selection of image in grid view in android [duplicate]

This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
how can I show selection of an image in grid view at once
I have a question that I want a check mark image shows when we select an image from grid view in the middle of the image, means suppose when we click on a grid item then a check mark image will appear in the middle of the image which shows the selection of image.
For Example below are showing the iphone screen:
I was able to get the position of the clicked image by making the position final and adding an onClick listener to the imageView. This logs the position of the image that was clicked.
#Override
public View getView(final int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
// if it's not recycled, initialize some attributes
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams(85, 85));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setPadding(8, 8, 8, 8);
imageView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Log.d("onClick","position ["+position+"]");
}
});
}
else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
or use this :
For a GridView you can use the setOnItemClickListener method to have an OnItemClickListener listener. That listener will give you a method that you must override with the signature
onItemClick(AdapterView<?> parent, View v, int position, long id)
where you get the position of the item in the grid that was clicked and the View that is inside the cell of the grid. Is that what you need?
Yes you can do it with GridView.
For implementing this kind of functionality, you have to define custom adapter for the same. Define a raw layout file with ImageView and CheckBox and inflate the same inside the GridView.
raw_layout.xml:
<?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">
<ImageView android:id="#+id/thumbImage" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_centerInParent="true" />
<CheckBox android:id="#+id/itemCheckBox" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_alignParentRight="true"
android:layout_alignParentTop="true" />
</RelativeLayout>
Here is a detailed example with the same functionality: Android custom image gallery with checkbox in grid to select multiple
.
Make a GridView and inside that use a custom inflated layout like
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/image_view" />
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/check_image" android:layout_centerInParent="true"/>
</RelativeLayout>

Button resize issue Android

I have 4 buttons that I want to show in a gridview. I want them to fill the screen as much as possible, but I never made it. I've tried all kind of ScaleTypes and it won't work. Right now I have the scale type in FIT_CENTER but i get an unexpected result. Here's the code I have so far:
Main.java
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
Display screenSize = getWindowManager().getDefaultDisplay();
int screenWidth = screenSize.getWidth();
int screenHeight = screenSize.getHeight();
int iconWidth = screenWidth/4;
int iconHeight= screenHeight/2;
GridView gridview = (GridView) findViewById(R.id.gridview);
gridview.setAdapter(new ImageAdapter(this, iconWidth, iconHeight));
}
ImageAdapter.java
public View getView(final int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
imageView = new ImageView(m_Context);
imageView.setLayoutParams(new GridView.LayoutParams(m_width, m_height));
imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
imageView.setPadding(8, 8, 8, 8);
} else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
GridViewLayout.xml
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:columnWidth="90dp"
android:stretchMode="columnWidth"
android:gravity="center"
android:numColumns="2"
android:background="#FFFFFF"/>
The result of the code looks like this:
This is what i would like it to look like:
Note that the last screen shot is hard coded which is obviously not my wish. I want this to work in every screen size without hard coding.
You can achieve it using recycler view with GridLayoutManager.
there you can define size of a single item to match half of device height and width. Then it'll be you expected result.

GridView is not clickable

I have the following layout:
<?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">
<GridView
android:id="#+id/grid"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:numColumns="auto_fit"
android:verticalSpacing="5dip"
android:horizontalSpacing="2.5dip"
android:columnWidth="100px"
android:stretchMode="columnWidth"
android:gravity="center"
android:listSelector="#drawable/transparent"
android:padding="5dip"
android:scrollbarStyle="outsideOverlay"
android:clickable="true" />
</RelativeLayout>
Now I use a custom Adapter that inflates my own views and sets them as the items in the gridview and set a listener on the clicks in the gridview.
GridView grid = (GridView) findViewById(R.id.grid);
grid.setAdapter(new ProductAdapter(getApplicationContext(), products));
grid.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
...
}
});
The problem is that the listener is not firing if I press on one of the cells in the gridview. If I use the trackpad to navigate around in the grid and I press the trackpad the listener is firing. Could it be that there is some other view that is capturing the click? My custom view consists of a LinearLayout with an ImageView and a TextView i read that inflating a layout for the gridview caused a problem at some places.
How can I make the items of the grid clickable?
Edit There is no difference between inflating the layout in my adapter or just instantiating a single view and returning this for the cellview.
Ok very very stupid error on my part. I reused another adapter that deactivated the views inside it.
For you all to know if you set this inside your Adapter
#Override
public boolean areAllItemsEnabled() {
return false;
}
#Override
public boolean isEnabled(int position) {
return false;
}
The views will not be clickable. Just as it is intended to be ;)
GridView grid = (GridView)findViewById(R.id.grid);
grid.setOnItemClickListener(mOnClickGridCell);
OnItemClickListener mOnClickGridCell = new OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
// Do stuff
}
};

Categories

Resources