Listview Click to Show Image in Imageview

Listview click to show image in ImageView

check below code it may help you for click on listview Items.

i check this link.

and i assume that you are aware of custom listview.

    public class ListViewAdapter_test extends BaseAdapter {

private LayoutInflater mInflater;

public ListViewAdapter_test(Context con) {
// TODO Auto-generated constructor stub
mInflater = LayoutInflater.from(con);
}

public int getCount() {
// TODO Auto-generated method stub
return a_product_id.size();
}

public Object getItem(int position) {
// TODO Auto-generated method stub
// return product_id1.size();
return position;
}

public long getItemId(int position) {
// TODO Auto-generated method stub
// return product_id1.get(position).hashCode();
return position;
}

public View getView(final int position, View convertView,
ViewGroup parent) {
// TODO Auto-generated method stub
final ListContent holder;
View v = convertView;
if (v == null) {
v = mInflater.inflate(R.layout.scan_row1, null);
holder = new ListContent();

holder.name = (TextView) v.findViewById(R.id.sc_textname);

holder.name1 = (TextView) v.findViewById(R.id.sc_review);

holder.ratings = (RatingBar) v.findViewById(R.id.sc_ratingBar1);

holder.total_rate = (Button) v.findViewById(R.id.button1);

holder.img_p = (ImageView) v.findViewById(R.id.image_prod);

// holder.total_rate.setOnClickListener(mOnTitleClickListener1);


v.setTag(holder);
} else {

holder = (ListContent) v.getTag();
}


holder.total_rate.setOnClickListener(mOnTitleClickListener3);

holder.img_p.setOnClickListener(mOnTitleClickListener_image);

return v;
}
}

static class ListContent {

ImageView img_p;
TextView name1;
TextView name;
RatingBar ratings;
Button total_rate;

}

public OnClickListener mOnTitleClickListener3 = new OnClickListener() {
public void onClick(View v) {
final int position = list_v
.getPositionForView((View) v.getParent());

Log.d("you are click on Ratings","you are click on Ratings");

}
};

public OnClickListener mOnTitleClickListener_image = new OnClickListener() {
public void onClick(View v) {
final int position = list_v
.getPositionForView((View) v.getParent());

Log.d("you are click on image view","you are click on image view");

/** in this listener you can show image in any other activity or in toast or in Alert. do whatever you want. */

}
};

Edited answer : 18/10/2012

full Example

Sample Image

Sample Image

Sample Image

Main Activity Class :

package com.example.test;

import java.io.IOException;
import java.io.InputStream;
import java.net.HttpURLConnection;
import java.net.URL;
import java.util.ArrayList;

import android.app.Activity;
import android.app.ProgressDialog;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Color;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.util.Log;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {

String iMages[] = {
"http://www.thebiblescholar.com/android_awesome.jpg",
"http://blogs-images.forbes.com/rogerkay/files/2011/07/Android1.jpg",
"http://cdn.slashgear.com/wp-content/uploads/2012/10/android-market-leader-smartphone.jpg",
"http://www.planmyworkshop.com/images/android.jpeg",
"http://www.androidguys.com/wp-content/uploads/2012/07/01-android2.jpg" };
String text[] = { "one", "two", "theree", "four", "five" };

ArrayList<Bitmap> bitmap_array = new ArrayList<Bitmap>();
private ListView listv;

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

listv = (ListView) findViewById(R.id.listView1);

final ProgressDialog progDailog = new ProgressDialog(MainActivity.this);
final Handler handler = new Handler() {

public void handleMessage(Message msg) {

listv.setAdapter(new ListViewAdapter_test(MainActivity.this));
}
};
new Thread() {

public void run() {

for (int i = 0; i < iMages.length; i++) {
Log.d("i-->" + i, "Url-->" + iMages[i]);
Bitmap bit = getBitmapFromURL(iMages[i]);
bitmap_array.add(bit);
}

progDailog.dismiss();
handler.sendEmptyMessage(0);

}
}.start();

}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}

public class ListViewAdapter_test extends BaseAdapter {

private LayoutInflater mInflater;

public ListViewAdapter_test(Context con) {
// TODO Auto-generated constructor stub
mInflater = LayoutInflater.from(con);
}

public int getCount() {
// TODO Auto-generated method stub
return iMages.length;
}

public Object getItem(int position) {
// TODO Auto-generated method stub

return position;
}

public long getItemId(int position) {
// TODO Auto-generated method stub

return position;
}

public View getView(final int position, View convertView,
ViewGroup parent) {
// TODO Auto-generated method stub
final ListContent holder;
View v = convertView;
if (v == null) {
v = mInflater.inflate(R.layout.row, null);
holder = new ListContent();

holder.name = (TextView) v.findViewById(R.id.textView1);

holder.button = (Button) v.findViewById(R.id.button1);

holder.img_p = (ImageView) v.findViewById(R.id.imageView1);

v.setTag(holder);
} else {

holder = (ListContent) v.getTag();
}

holder.name.setText(text[position]);
holder.button.setText(text[position]);

if (bitmap_array.get(position) != null) {
holder.img_p.setImageBitmap(bitmap_array.get(position));
} else {
holder.img_p.setImageDrawable(getResources().getDrawable(
R.drawable.ic_launcher));
}

holder.button.setOnClickListener(mOnTitleClickListener_button);

holder.img_p.setOnClickListener(mOnTitleClickListener_image);

return v;
}
}

static class ListContent {

ImageView img_p;

TextView name;

Button button;

}

public OnClickListener mOnTitleClickListener_image = new OnClickListener() {
public void onClick(View v) {
final int position = listv.getPositionForView((View) v.getParent());

ImageView i = new ImageView(MainActivity.this);
i.setImageBitmap(bitmap_array.get(position));

Toast toastView = new Toast(MainActivity.this);
toastView.setView(i);
toastView.setDuration(Toast.LENGTH_LONG);
toastView.setGravity(Gravity.CENTER, 0, 0);
toastView.show();

Log.d("you are click on image view", "you are click on image view");

}
};

public OnClickListener mOnTitleClickListener_button = new OnClickListener() {
public void onClick(View v) {
final int position = listv.getPositionForView((View) v.getParent());

Log.d("you are click on image view", "you are click on image view");

Toast.makeText(MainActivity.this,
"click on button " + text[position], Toast.LENGTH_LONG)
.show();

}
};

public static Bitmap getBitmapFromURL(String src) {
try {
URL url = new URL(src);
HttpURLConnection connection = (HttpURLConnection) url
.openConnection();
connection.setDoInput(true);
connection.connect();
InputStream input = connection.getInputStream();
Bitmap myBitmap = BitmapFactory.decodeStream(input);
return myBitmap;
} catch (IOException e) {
e.printStackTrace();
return null;
}
}

}

activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >

<ListView
android:id="@+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ListView>

</LinearLayout>

row.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >

<ImageView
android:id="@+id/imageView1"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@drawable/ic_launcher" />

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello"
android:textAppearance="?android:attr/textAppearanceLarge" />

<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="click me" />

</LinearLayout>

android manifest file :

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.test"
android:versionCode="1"
android:versionName="1.0" >

<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="15" />
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

<application
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
<activity
android:name=".MainActivity"
android:label="@string/title_activity_main" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>

</manifest>

How to change the image of a list view item when it is clicked in Android Studio?

You need to write view.findViewById and not just findViewById -

Change -

ImageView img=(ImageView) findViewById(R.id.image2);

to

ImageView img=(ImageView) view.findViewById(R.id.image2);

Android click listView to expand ImageView

use this getView()

    @Override
public View getView(int position, View convertView, ViewGroup parent)
{
Hotel data = getItem(position);

Holder viewHolder;

if (convertView == null)
{
viewHolder = new Holder();
LayoutInflater inflater = LayoutInflater.from(getContext());
convertView = inflater.inflate(R.layout.listhotels, parent, false);

viewHolder.nameFV = (TextView) convertView.findViewById(R.id.txtViewer);
viewHolder.pic = (ImageView) convertView.findViewById(R.id.imgView);

convertView.setTag(viewHolder);
}
else
{
viewHolder = (Holder) convertView.getTag();
}

viewHolder.nameFV.setText(data.getFName());
viewHolder.pic.setImageBitmap(convertToBitmap(data.getImage()));
viewHolder.pic.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {

Dialog settingsDialog = new Dialog(context);
settingsDialog.getWindow().requestFeature(Window.FEATURE_NO_TITLE);

RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(500, 500);
lp.addRule(RelativeLayout.CENTER_IN_PARENT);
ImageView iv = new ImageView(context);
iv.setLayoutParams(lp);
iv.setImageResource(R.drawable.img3);
//use in your case iv.setImageBitmap(convertToBitmap(data.getImage()));
settingsDialog.addContentView(iv,lp);
settingsDialog.show();

}
});

return convertView;
}

How to change an image in a ListView, when the image is clicked?

I'd like to thank everyone for their support. Unfortunately, with the way my code is written (rather messily and without much regard for what my professors taught me), I was unable to get most of these solutions to work. I did however, find a solution that falls in line with my own framework that I've had going into this. Unfortunately I could not redo my entire adapter method, or implement various interfaces that would cause me to have to rewrite a huge chunk of code for something seemingly trivial.

So, if anyone finds themselves in this situation in the future, here is my solution:

In the Movie class, I add a boolean value that represents my values, along with some getters and setters:

private boolean watchedStatus;
public boolean hasSeen() {return watchedStatus;}

public void toggleWatchedStatus(){
watchedStatus = !watchedStatus;
}

In the getView method, I simply get a reference to the ImageButton, and then based on the boolean value returned by "hasSeen," I set the ImageResource to one of two states:

@Override
public View getView(final int position, View convertView, ViewGroup parent){

ImageButton movieSeen = (ImageButton) convertView.findViewById(R.id.movieSeen);
if(movies.get(position).hasSeen()){
movieSeen.setImageResource(R.drawable.ic_check_circle_black_24dp);
} else {
movieSeen.setImageResource(R.drawable.ic_add_circle_black_24dp);
}

}

Next, I override the OnClickListener, and make it so that whenever the button is clicked, the boolean value in the Movie.java class is toggled. The key here was using the ArrayAdapter's method "notifyDataSetChanged()" This completes the process, and lets the ListView know that it should update itself:

final ImageButton movieSeenForClick = (ImageButton) convertView.findViewById(R.id.movieSeen);
movieSeen.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//movieSeenForClick.setImageResource(R.drawable.ic_check_circle_black_24dp);
movies.get(position).toggleWatchedStatus();
System.out.println(movies.get(position).hasSeen() + " ------- position: " + position);
notifyDataSetChanged();
}
});

Thanks again for the time taken to provide information, a lot of it really did steer me int he right direction, I just had to use the information correctly with the way my code was structured.

how to make an imageview clickable in an listview

You have to implement your own cursor adapter, and in that you have to override the getView method and then set the onclick listener to your image:

public class SMSimpleCursorAdapter extends SimpleCursorAdapter{

Context context;
Activity activity;
public SMSimpleCursorAdapter(Context context, int layout, Cursor c,
String[] from, int[] to) {
super(context, layout, c, from, to);
this.context=context;
this.activity=(Activity) context;
}


@Override
public View getView(int position, View convertView, ViewGroup parent){
View view = super.getView(position, convertView, parent);
long id=getItemId(position);
ImageView image= (ImageView)view.findViewById(R.id.icon);
image.setOnClickListener(new OnClickListener()
{
@Override
public void onClick(View v)
{

}
});


}

}

Click listview item and display image

First of all you need to have images in your drawable folder for all different items(in list view)
Change the single_list_item.xml to

single_list_item_view.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView android:id="@+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>

change your SingleListItem.java

  package com.androidhive.androidlistview;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.widget.TextView;

public class SingleListItem extends Activity{
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.setContentView(R.layout.single_list_item_view);

ImageView productimage = (ImageView) findViewById(R.id.image);

Intent i = getIntent();
// getting attached intent data
String product = i.getStringExtra("product");
// displaying selected product name
switch(product){
case "item1":
productimage.setImageDrawable(R.drawable.image1);
break;
case "item2":
productimage.setImageDrawable(R.drawable.image2);
break;
case "item3":
productimage.setImageDrawable(R.drawable.image3);
break;
.
.
.
.
.
//upto all 10 images

}

}
}


Related Topics



Leave a reply



Submit