Goodevening everyone,
I am using SQLite and android. I am trying to match a query result with images stored in the drawable folder. I am trying to do it dynamically search and then display it into a custome listview (image + text). I am not sure how to accomplish this. I can retrieve a simple query result from the database and display the values into a listview but I dont know how to display images + text in the listview. Can anyone help me and guide me to the right path?
The following code is part of my activity
List<YAODeckHieraticBlue> valuesMainimage = datasource2.SQLDeckHieraticBlueTABLESEARCHMAINDECKIMAGE();
List<YAODeckHieraticBlue> valuesMain = datasource2.SQLDeckHieraticBlueTABLESEARCHMAINDECK();
ImageView thumbnail;
thumbnail = (ImageView)findViewById(R.list.thumb);
TextView name;
name = (TextView)findViewById(R.list.text);
name.setText(valuesMain);
thumbnail.setBackgroundResource ( getResourceID ( valuesMainimage , "drawable", getApplicationContext() ) );
//if I just take out the previous section it only display Text but I am missing the Image part in the Listview
ArrayAdapter<YAODeckHieraticBlue> adapterMain = new ArrayAdapter<YAODeckHieraticBlue>(this,
android.R.layout.simple_list_item_1, valuesMain);
setListAdapter(adapterMain);
I use the following piece of code to verify if the image exist
protected final static int getResourceID
(final String resName, final String resType, final Context ctx)
{
final int ResourceID =
ctx.getResources().getIdentifier(resName, resType,
ctx.getApplicationInfo().packageName);
if (ResourceID == 0)
{
throw new IllegalArgumentException
(
"No resource string found with name " + resName
);
}
else
{
return ResourceID;
}
}
My table in the database looks like this:
Table Name: [Deck name Hieratic Blue]
column1:ID - Integer
column2 [Card Name] - Text
column3: Type - Text
column4: Deck_typeID - Integer
Column5: Images -Text
Note: the image column just store the name of the image file without the file extention (.png)
You are using default ArrayAdapter to put data into your ListView. What you need is a customized SimpleCursorAdapter. SimpleCursorAdapter is used to get data from database. By extending this class and overriding its method you can also put your pictures into list view! When extending SimpleCursorAdapter override newView() and bindView(). Also Remember to use View Holder to get better performance.
If what i'm saying doesn't make any scene to you! Don't worry. Use this link https://www.youtube.com/watch?v=0zQCv0Xb3pk
It's explain how to create a listView with image using custom adapter. It does not cover SimpleCursorAdapter because it doesn't uses database. But if you understand the concept correctly. You can easily work with SimpleCursorAdapter too.
I write the custom adapter for you. i hope it helps.
First you need a layout for single a single row
layout/single_row.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="10dip" >
<TextView
android:id="@+id/name_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="28dip" />
<ImageView
android:id="@+id/name_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
then you need to define a custom SimplerCursorAdapter
public class CustomStudentAdapter extends SimpleCursorAdapter {
private int layout;
public CustomStudentAdapter(Context context, int layout, Cursor c){
super(context, layout, c, null, null, 1);
}
@Override
public View newView(Context context, Cursor cursor, ViewGroup parent) {
final LayoutInflater inflater = LayoutInflater.from(context);
View v = inflater.inflate(layout,parent,false);
MyViewHolder holder = new MyViewHolder(v);
v.setTag(holder);
return v;
}
@Override
public void bindView(View view, Context context, Cursor cursor) {
int nameIndex = cursor.getColumnIndex(StudentTable.NAME);
int imageNameIndex = cursor.getColumnIndex(StudentTable.IMAGE_URL);
String name = cursor.getString(nameIndex);
String imageName = cursor.getString(imageNameIndex);
MyViewHolder holder = (MyViewHolder) view.getTag();
TextView nameInput = holder.name;
ImageView image = holder.image;
nameInput.setText(name);
int imageResource;
//colculate image resource based on iamgeName!
image.setImageResource(imageResource);
}
//View Holder is only a mechanism for performance increase. findViewById is a cup intensive task. View Holder
//just makes sure its not get called when there is no need for it!!
class MyViewHolder{
private TextView name;
private ImageView image;
public MyViewHolder(View v){
name = (TextView) v.findViewById(R.id.name);
image = (ImageView) v.findViewById(R.id.image);
}
}
}
and lastly use your custom adapter in the activity like this.
Cursor cursor = helper.getAllStudents();
CustomStudentAdapter studentAdapter = new CustomStudentAdapter(this,R.layout.single_row,cursor);
this.setListAdapter(studentAdapter);
Well that's it. I didn't tested this code and there is a slight chance that the code doesn't work! In that case you need to extend CursorAdapter since it's the parent of SimpleCursorAdapter and it gives you more flexibility!