How to display the images from SQLite in Android
Hi Everyone
In this Blog post i am going brief about how to display image from SQLite Database in Android.
Step 1:
Add the following xml file in your layout folder.
<?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" > <ListView android:id="@+id/list" android:layout_width="fill_parent" android:layout_height="0dip" android:layout_weight="0.78" /> </LinearLayout>
Step 2:
Add the followinf Xml file in layout folder
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#EEE" android:padding="4dp" tools:ignore="HardcodedText,ContentDescription" > <ImageView android:id="@+id/imgIcon" android:layout_width="50dp" android:layout_height="50dp" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" /> <TextView android:id="@+id/txtTitle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_marginLeft="16dp" android:layout_marginTop="8dp" android:layout_toRightOf="@+id/imgIcon" android:text="TextView1" android:textSize="21sp" /> </RelativeLayout>
Step 3:
Add the following Java file in your source folder
public class MainActvity extends Activity{ Cursor dbCursor; ArrayList<Item> mArrayList; ImageView image; TextView count_txt; ListView list; Dialog preview_dialog; ImageView preview_view; ArrayList<Contact> imageArry = new ArrayList<Contact>(); ContactImageAdapter adapter; List<Contact> contacts; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.analyticsby_pic); DataBaseHandler db = new DataBaseHandler(this); contacts = db.getAllContacts(); for (Contact cn : contacts) { String log = "ID:" + cn.getID() + " Name: " + cn.getName() + " ,Image: " + cn.getImage(); // Writing Contacts to log Log.d("Result: ", log); //add contacts data in arrayList imageArry.add(cn); } adapter = new ContactImageAdapter(this, R.layout.screen_list, imageArry); ListView dataList = (ListView) findViewById(R.id.list); dataList.setAdapter(adapter); //rowItems= new ArrayList<RowItem>(); }
Step 4:
Add following Database handler for getting image from SQLite Database
package com.example.jigsaw_puzzle; import java.util.ArrayList; import java.util.List; import android.content.ContentValues; import android.content.Context; import android.database.Cursor; import android.database.sqlite.SQLiteDatabase; import android.database.sqlite.SQLiteOpenHelper; public class DataBaseHandler extends SQLiteOpenHelper { // All Static variables // Database Version private static final int DATABASE_VERSION = 1; // Database Name private static final String DATABASE_NAME = "DBNAME.db"; // Contacts table name private static final String TABLE_CONTACTS = "contacts"; // Contacts Table Columns names private static final String KEY_ID = "id"; private static final String KEY_NAME = "name"; private static final String KEY_IMAGE = "image"; public DataBaseHandler(Context context) { super(context, DATABASE_NAME, null, DATABASE_VERSION); } // Creating Tables @Override public void onCreate(SQLiteDatabase db) { String CREATE_CONTACTS_TABLE = "CREATE TABLE " + TABLE_CONTACTS + "(" + KEY_ID + " INTEGER PRIMARY KEY," + KEY_NAME + " TEXT," + KEY_IMAGE + " BLOB" + ")"; db.execSQL(CREATE_CONTACTS_TABLE); } // Upgrading database @Override public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) { // Drop older table if existed db.execSQL("DROP TABLE IF EXISTS " + TABLE_CONTACTS); // Create tables again onCreate(db); } public// Adding new contact void addContact(Contact contact) { SQLiteDatabase db = this.getWritableDatabase(); ContentValues values = new ContentValues(); values.put(KEY_NAME, contact._name); // Contact Name values.put(KEY_IMAGE, contact._image); // Contact Phone // Inserting Row db.insert(TABLE_CONTACTS, null, values); db.close(); // Closing database connection } // Getting single contact Contact getContact(int id) { SQLiteDatabase db = this.getReadableDatabase(); Cursor cursor = db.query(TABLE_CONTACTS, new String[] { KEY_ID, KEY_NAME, KEY_IMAGE }, KEY_ID + "=?", new String[] { String.valueOf(id) }, null, null, null, null); if (cursor != null) cursor.moveToFirst(); Contact contact = new Contact(Integer.parseInt(cursor.getString(0)), cursor.getString(1), cursor.getBlob(1)); // return contact return contact; } // Getting All Contacts public List<Contact> getAllContacts() { List<Contact> contactList = new ArrayList<Contact>(); // Select All Query String selectQuery = "SELECT * FROM contacts ORDER BY DESC"; SQLiteDatabase db = this.getWritableDatabase(); Cursor cursor = db.rawQuery(selectQuery, null); // looping through all rows and adding to list if (cursor.moveToFirst()) { do { Contact contact = new Contact(); contact.setID(Integer.parseInt(cursor.getString(0))); contact.setName(cursor.getString(1)); contact.setImage(cursor.getBlob(2)); // Adding contact to list contactList.add(contact); } while (cursor.moveToNext()); } // close inserting data from database db.close(); // return contact list return contactList; } // Updating single contact public int updateContact(Contact contact) { SQLiteDatabase db = this.getWritableDatabase(); ContentValues values = new ContentValues(); values.put(KEY_NAME, contact.getName()); values.put(KEY_IMAGE, contact.getImage()); // updating row return db.update(TABLE_CONTACTS, values, KEY_ID + " = ?", new String[] { String.valueOf(contact.getID()) }); } // Deleting single contact public void deleteContact(Contact contact) { SQLiteDatabase db = this.getWritableDatabase(); db.delete(TABLE_CONTACTS, KEY_ID + " = ?", new String[] { String.valueOf(contact.getID()) }); db.close(); } // Getting contacts Count public int getContactsCount() { String countQuery = "SELECT * FROM " + TABLE_CONTACTS; SQLiteDatabase db = this.getReadableDatabase(); Cursor cursor = db.rawQuery(countQuery, null); cursor.close(); // return count return cursor.getCount(); } public Cursor get() { SQLiteDatabase db = getWritableDatabase(); String SELECT_QUERY = "SELECT * FROM " + TABLE_CONTACTS + " ORDER BY " + KEY_ID + " ASC"; return db.rawQuery(SELECT_QUERY,null); //return db.query(TABLE_NAME_MESSAGES, null, MESSAGE_SENDER + " LIKE ? OR " + MESSAGE_SENDER + " LIKE ?", sender , null, null, _ID + " ASC"); } }
Step 5:
Add following Custom List Adaptor to display image in ListView
package com.example.jigsaw_puzzle; import java.io.ByteArrayInputStream; import java.util.ArrayList; import android.app.Activity; import android.content.Context; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ArrayAdapter; import android.widget.ImageView; import android.widget.TextView; public class ContactImageAdapter extends ArrayAdapter<Contact>{ Context context; int layoutResourceId; // BcardImage data[] = null; ArrayList<Contact> data=new ArrayList<Contact>(); public ContactImageAdapter(Context context, int layoutResourceId, ArrayList<Contact> data) { super(context, layoutResourceId, data); this.layoutResourceId = layoutResourceId; this.context = context; this.data = data; } @Override public View getView(int position, View convertView, ViewGroup parent) { View row = convertView; ImageHolder holder = null; if(row == null) { LayoutInflater inflater = ((Activity)context).getLayoutInflater(); row = inflater.inflate(layoutResourceId, parent, false); holder = new ImageHolder(); holder.txtTitle = (TextView)row.findViewById(R.id.txtTitle); holder.imgIcon = (ImageView)row.findViewById(R.id.imgIcon); row.setTag(holder); } else { holder = (ImageHolder)row.getTag(); } Contact picture = data.get(position); holder.txtTitle.setText(picture._name); //convert byte to bitmap take from contact class byte[] outImage=picture._image; ByteArrayInputStream imageStream = new ByteArrayInputStream(outImage); Bitmap theImage = BitmapFactory.decodeStream(imageStream); holder.imgIcon.setImageBitmap(theImage); return row; } static class ImageHolder { ImageView imgIcon; TextView txtTitle; } }
Hope this blog post was helpful. Do let me know your feedback.
Related Posts
Nithya Govind
Latest posts by Nithya Govind (see all)
- How to Display Image Gallery Using ViewPager in Android - April 12, 2015
- How to Display Google Map in Android - February 19, 2015
- How to List Drawable Images in Array XML in Android using TypedArray - February 18, 2015
wow. exelent tutorial. Awesome
Hi,
I think you have missed the Contact Class in this code.. Can u put it here…
Hello sir can you upload or send me the code of your contact class.