Tag Archives: picture

Android: Image upload activity


Hi,

After working on how to upload image, I decided to post complete activity code, and that will help for new Android developers.

imageupload.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/ImageView" android:layout_width="wrap_content"
		android:layout_height="wrap_content" android:layout_centerInParent="true" />
 <Button android:layout_width="wrap_content" android:id="@+id/Upload"
		android:layout_height="wrap_content" android:layout_alignParentLeft="true"
		android:layout_alignParentBottom="true" android:text="Upload" />
 <EditText android:id="@+id/Caption" android:layout_width="500px"
		android:layout_height="wrap_content" android:hint="Write caption"
		android:singleLine="true" android:layout_toRightOf="@id/Upload"
		android:layout_alignParentBottom="true" />
</RelativeLayout>

ImageUpload.java:

package com.isummation.imageupload;

import java.io.BufferedReader;
import java.io.ByteArrayOutputStream;
import java.io.InputStreamReader;

import org.apache.http.HttpResponse;
import org.apache.http.client.HttpClient;
import org.apache.http.client.methods.HttpPost;
import org.apache.http.entity.mime.HttpMultipartMode;
import org.apache.http.entity.mime.MultipartEntity;
import org.apache.http.entity.mime.content.ByteArrayBody;
import org.apache.http.entity.mime.content.StringBody;
import org.apache.http.impl.client.DefaultHttpClient;
import org.apache.http.protocol.BasicHttpContext;
import org.apache.http.protocol.HttpContext;
import org.json.JSONObject;

import android.app.Activity;
import android.app.ProgressDialog;
import android.content.Intent;
import android.database.Cursor;
import android.graphics.Bitmap;
import android.graphics.Bitmap.CompressFormat;
import android.graphics.BitmapFactory;
import android.net.Uri;
import android.os.AsyncTask;
import android.os.Bundle;
import android.provider.MediaStore;
import android.util.Log;
import android.view.KeyEvent;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.Toast;

public class ImageUpload extends Activity {
	private static final int PICK_IMAGE = 1;
	private ImageView imgView;
	private Button upload;
	private EditText caption;
	private Bitmap bitmap;
	private ProgressDialog dialog;

	/** Called when the activity is first created. */
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.imageupload);

		imgView = (ImageView) findViewById(R.id.ImageView);
		upload = (Button) findViewById(R.id.Upload);
		caption = (EditText) findViewById(R.id.Caption);
		upload.setOnClickListener(new View.OnClickListener() {

			public void onClick(View v) {
				if (bitmap == null) {
					Toast.makeText(getApplicationContext(),
							"Please select image", Toast.LENGTH_SHORT).show();
				} else {
					dialog = ProgressDialog.show(ImageUpload.this, "Uploading",
							"Please wait...", true);
					new ImageUploadTask().execute();
				}
			}
		});

	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		MenuInflater inflater = getMenuInflater();
		inflater.inflate(R.menu.imageupload_menu, menu);
		return true;
	}

	@Override
	public boolean onOptionsItemSelected(MenuItem item) {
		// Handle item selection
		switch (item.getItemId()) {
		case R.id.ic_menu_gallery:
			try {
				Intent intent = new Intent();
				intent.setType("image/*");
				intent.setAction(Intent.ACTION_GET_CONTENT);
				startActivityForResult(
						Intent.createChooser(intent, "Select Picture"),
						PICK_IMAGE);
			} catch (Exception e) {
				Toast.makeText(getApplicationContext(),
						getString(R.string.exception_message),
						Toast.LENGTH_LONG).show();
				Log.e(e.getClass().getName(), e.getMessage(), e);
			}
			return true;
		default:
			return super.onOptionsItemSelected(item);
		}
	}

	@Override
	protected void onActivityResult(int requestCode, int resultCode, Intent data) {
		switch (requestCode) {
		case PICK_IMAGE:
			if (resultCode == Activity.RESULT_OK) {
				Uri selectedImageUri = data.getData();
				String filePath = null;

				try {
					// OI FILE Manager
					String filemanagerstring = selectedImageUri.getPath();

					// MEDIA GALLERY
					String selectedImagePath = getPath(selectedImageUri);

					if (selectedImagePath != null) {
						filePath = selectedImagePath;
					} else if (filemanagerstring != null) {
						filePath = filemanagerstring;
					} else {
						Toast.makeText(getApplicationContext(), "Unknown path",
								Toast.LENGTH_LONG).show();
						Log.e("Bitmap", "Unknown path");
					}

					if (filePath != null) {
						decodeFile(filePath);
					} else {
						bitmap = null;
					}
				} catch (Exception e) {
					Toast.makeText(getApplicationContext(), "Internal error",
							Toast.LENGTH_LONG).show();
					Log.e(e.getClass().getName(), e.getMessage(), e);
				}
			}
			break;
		default:
		}
	}

	class ImageUploadTask extends AsyncTask <Void, Void, String>{
		@Override
		protected String doInBackground(Void... unsued) {
			try {
				HttpClient httpClient = new DefaultHttpClient();
				HttpContext localContext = new BasicHttpContext();
				HttpPost httpPost = new HttpPost(
						getString(R.string.WebServiceURL)
								+ "/cfc/iphonewebservice.cfc?method=uploadPhoto");

				MultipartEntity entity = new MultipartEntity(
						HttpMultipartMode.BROWSER_COMPATIBLE);

				ByteArrayOutputStream bos = new ByteArrayOutputStream();
				bitmap.compress(CompressFormat.JPEG, 100, bos);
				byte[] data = bos.toByteArray();
				entity.addPart("photoId", new StringBody(getIntent()
						.getStringExtra("photoId")));
				entity.addPart("returnformat", new StringBody("json"));
				entity.addPart("uploaded", new ByteArrayBody(data,
						"myImage.jpg"));
				entity.addPart("photoCaption", new StringBody(caption.getText()
						.toString()));
				httpPost.setEntity(entity);
				HttpResponse response = httpClient.execute(httpPost,
						localContext);
				BufferedReader reader = new BufferedReader(
						new InputStreamReader(
								response.getEntity().getContent(), "UTF-8"));

				String sResponse = reader.readLine();
				return sResponse;
			} catch (Exception e) {
				if (dialog.isShowing())
					dialog.dismiss();
				Toast.makeText(getApplicationContext(),
						getString(R.string.exception_message),
						Toast.LENGTH_LONG).show();
				Log.e(e.getClass().getName(), e.getMessage(), e);
				return null;
			}

			// (null);
		}

		@Override
		protected void onProgressUpdate(Void... unsued) {

		}

		@Override
		protected void onPostExecute(String sResponse) {
			try {
				if (dialog.isShowing())
					dialog.dismiss();

				if (sResponse != null) {
					JSONObject JResponse = new JSONObject(sResponse);
					int success = JResponse.getInt("SUCCESS");
					String message = JResponse.getString("MESSAGE");
					if (success == 0) {
						Toast.makeText(getApplicationContext(), message,
								Toast.LENGTH_LONG).show();
					} else {
						Toast.makeText(getApplicationContext(),
								"Photo uploaded successfully",
								Toast.LENGTH_SHORT).show();
						caption.setText("");
					}
				}
			} catch (Exception e) {
				Toast.makeText(getApplicationContext(),
						getString(R.string.exception_message),
						Toast.LENGTH_LONG).show();
				Log.e(e.getClass().getName(), e.getMessage(), e);
			}
		}
	}

	public String getPath(Uri uri) {
		String[] projection = { MediaStore.Images.Media.DATA };
		Cursor cursor = managedQuery(uri, projection, null, null, null);
		if (cursor != null) {
			// HERE YOU WILL GET A NULLPOINTER IF CURSOR IS NULL
			// THIS CAN BE, IF YOU USED OI FILE MANAGER FOR PICKING THE MEDIA
			int column_index = cursor
					.getColumnIndexOrThrow(MediaStore.Images.Media.DATA);
			cursor.moveToFirst();
			return cursor.getString(column_index);
		} else
			return null;
	}

	public void decodeFile(String filePath) {
		// Decode image size
		BitmapFactory.Options o = new BitmapFactory.Options();
		o.inJustDecodeBounds = true;
		BitmapFactory.decodeFile(filePath, o);

		// The new size we want to scale to
		final int REQUIRED_SIZE = 1024;

		// Find the correct scale value. It should be the power of 2.
		int width_tmp = o.outWidth, height_tmp = o.outHeight;
		int scale = 1;
		while (true) {
			if (width_tmp &lt; REQUIRED_SIZE &amp;&amp; height_tmp &lt; REQUIRED_SIZE)
				break;
			width_tmp /= 2;
			height_tmp /= 2;
			scale *= 2;
		}

		// Decode with inSampleSize
		BitmapFactory.Options o2 = new BitmapFactory.Options();
		o2.inSampleSize = scale;
		bitmap = BitmapFactory.decodeFile(filePath, o2);

		imgView.setImageBitmap(bitmap);

	}
}

imageupload_menu.xml:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
	<item android:id="@+id/ic_menu_gallery" android:icon="@drawable/ic_menu_gallery"
		android:title="Gallery" />
</menu>

Tips: To upload a camera picture, we can directly call camera activity. But it may return you a small, thumbnail sized image. So while browsing the gallery we can also take a new picture, and then we select that picture to upload.

Remember that my decodeFile() function will reduce the size of image, when we convert it to bitmap to show selected image. It is important because a large size of image can crash your application. Think that you load 8 Mega pixel image with 5 MB size into RAM of Android mobile! It definitely crash the application.

Also If you want to upload the full sized image then, just use the filePath. Instead of using ByteArrayBody(), use the following line:

entity.addPart("uploaded", new FileBody(new File(filepath)));

Again, if you upload a large size of image with slow Internet speed, it will take long long time. So just limit it size and also choose the compress format for the image.

Added:

ColdFusion function to receive file:

<cffunction name="uploadPhoto" access="remote" output="false" returntype="struct">
		<cfargument name="photoId" required="true" type="numeric" />
		<cfargument name="photoCaption" required="false" type="string" default=""/>
		<!--- Receive File --->
		<cfargument name="uploaded" required="true" type="any" />

		<!--- Save file --->
		<cfset Variables.Path="/upload"/>
		<cfset Variables.FolderPath="#Expandpath(Variables.Path)#" />
		<cffile action="upload"
 			filefield="uploaded"
 			destination="#Variables.FolderPath#"
 			nameconflict="makeunique"
 			/>

		<!--- Other code --->
		<cfreturn retStruct>
	</cffunction>

Update:

Download source code: Download

Android: Web image, photo, picture gallery


Hi.

Recently I’ve created web image gallery for my application. That took much of the time when I test it under various condition. Each time I need to improve my code. So that finally I decided to post my work.

It is easy to show images from phone, but to display images from web (or from url), you need to take care of downloading images to your application, image size, image exist or not etc..

Consider that your server contains two type of images, one is original and second is thumbnail.

e.g.

Thumbnail: th_3BC52DAA-AFD8-50B5-DA5096B82422275F.jpg

Original: 3BC52DAA-AFD8-50B5-DA5096B82422275F.jpg

All the images are in /upload directory.

main.xml

<?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">
	<Gallery xmlns:android="http://schemas.android.com/apk/res/android"
		android:id="@+id/Gallery" android:layout_width="fill_parent"
		android:layout_height="wrap_content" />
	<ImageView android:id="@+id/GalleryView"
		android:layout_width="fill_parent" android:layout_height="wrap_content" />
</LinearLayout>

MyGallery.java

package com.isummation.igallery;

import java.io.InputStream;
import java.net.URL;
import java.net.URLConnection;
import java.util.ArrayList;

import org.apache.http.HttpEntity;
import org.apache.http.HttpResponse;
import org.apache.http.client.HttpClient;
import org.apache.http.client.methods.HttpGet;
import org.apache.http.entity.BufferedHttpEntity;
import org.apache.http.impl.client.DefaultHttpClient;

import android.app.Activity;
import android.app.ProgressDialog;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.os.AsyncTask;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageView;
import android.widget.Toast;
public class MyGallery extends Activity {

	private ImageAdapter imageAdapter;

	private ArrayList PhotoURLS = new ArrayList();
	private ProgressDialog dialog;

	/** Called when the activity is first created. */
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);

		imageAdapter = new ImageAdapter(this);
		final ImageView imgView = (ImageView) findViewById(R.id.GalleryView);
		Gallery g = (Gallery) findViewById(R.id.Gallery);
		g.setAdapter(imageAdapter);
		g.setOnItemClickListener(new OnItemClickListener() {
			public void onItemClick(AdapterView parent, View v,
					int position, long id) {
				dialog = ProgressDialog.show(ImageGallery.this, "Loading",
						"Please wait...", true);
				new ShowImageTask().execute(position);
			}
		});

		// replace this code to set your image urls in list
		PhotoURLS.add("http://10.0.2.2/upload/3BC52DAA-AFD8-50B5-DA5096B82422275F.jpg");
		PhotoURLS.add("http://10.0.2.2/upload/B652F78D-C760-B674-7A6E61E505A05A0F.jpg");

		new AddImageTask().execute();

	}

	class ShowImageTask extends AsyncTask {
		@Override
		protected Drawable doInBackground(Integer... position) {
			Drawable drawable = LoadImageFromURL(PhotoURLS.get(position[0]));
			return drawable;
		}

		@Override
		protected void onProgressUpdate(Void... unsued) {

		}

		@Override
		protected void onPostExecute(Drawable drawable) {
			imgView.setImageDrawable(drawable);
			imgView.setScaleType(ImageView.ScaleType.FIT_CENTER);
			dialog.dismiss();
		}
	}

	class AddImageTask extends AsyncTask<Void, Void, Void> {
		@Override
		protected Void doInBackground(Void... unused) {
			for (String url : PhotoURLS) {
				String filename = url.substring(url.lastIndexOf("/") + 1,
						url.length());
				filename = "th_" + filename;
				String thumburl = url.substring(0, url.lastIndexOf("/") + 1);
				imageAdapter.addItem(LoadThumbnailFromURL(thumburl + filename));
				publishProgress();
				//SystemClock.sleep(200);
			}

			return (null);
		}

		@Override
		protected void onProgressUpdate(Void... unused) {
			imageAdapter.notifyDataSetChanged();
		}

		@Override
		protected void onPostExecute(Void unused) {
		}
	}

	private Drawable LoadThumbnailFromURL(String url) {
		try {
			URLConnection connection = new URL(url).openConnection();
			String contentType = connection.getHeaderField("Content-Type");
			boolean isImage = contentType.startsWith("image/");
			if(isImage){
				HttpGet httpRequest = new HttpGet(url);
				HttpClient httpclient = new DefaultHttpClient();
				HttpResponse response = (HttpResponse) httpclient
						.execute(httpRequest);
				HttpEntity entity = response.getEntity();
				BufferedHttpEntity bufferedHttpEntity = new BufferedHttpEntity(entity);

				InputStream is = bufferedHttpEntity.getContent();
				Drawable d = Drawable.createFromStream(is, "src Name");
				return d;
			} else {
				Bitmap b = BitmapFactory.decodeResource(getResources(), R.drawable.no_image);
				Drawable d = new BitmapDrawable(b);
				return d;
			}
		} catch (Exception e) {
			Toast.makeText(getApplicationContext(), "error", Toast.LENGTH_LONG)
					.show();
			Log.e(e.getClass().getName(), e.getMessage(), e);
			return null;
		}
	}

	private Drawable LoadImageFromURL(String url) {
		try {
			URLConnection connection = new URL(url).openConnection();
			String contentType = connection.getHeaderField("Content-Type");
			boolean isImage = contentType.startsWith("image/");
			if(isImage){
				HttpGet httpRequest = new HttpGet(url);
				HttpClient httpclient = new DefaultHttpClient();
				HttpResponse response = (HttpResponse) httpclient
						.execute(httpRequest);
				HttpEntity entity = response.getEntity();
				BufferedHttpEntity bufferedHttpEntity = new BufferedHttpEntity(
						entity);
				InputStream is = bufferedHttpEntity.getContent();

				// Decode image size
				BitmapFactory.Options o = new BitmapFactory.Options();
				o.inJustDecodeBounds = true;
				BitmapFactory.decodeStream(is, null, o);

				// The new size we want to scale to
				final int REQUIRED_SIZE = 150;

				// Find the correct scale value. It should be the power of 2.
				int width_tmp = o.outWidth, height_tmp = o.outHeight;
				int scale = 1;
				while (true) {
					if (width_tmp / 2 &lt; REQUIRED_SIZE
							|| height_tmp / 2 &lt; REQUIRED_SIZE)
						break;
					width_tmp /= 2;
					height_tmp /= 2;
					scale *= 2;
				}

				// Decode with inSampleSize
				is = bufferedHttpEntity.getContent();
				BitmapFactory.Options o2 = new BitmapFactory.Options();
				o2.inSampleSize = scale;
				Bitmap b = BitmapFactory.decodeStream(is, null, o2);
				Drawable d = new BitmapDrawable(b);
				return d;
			} else {
				Bitmap b = BitmapFactory.decodeResource(getResources(), R.drawable.no_image);
				Drawable d = new BitmapDrawable(b);
				return d;
			}
		} catch (Exception e) {
			Toast.makeText(getApplicationContext(), "error", Toast.LENGTH_LONG)
					.show();
			Log.e(e.getClass().getName(), e.getMessage(), e);
			return null;
		}
	}

	public class ImageAdapter extends BaseAdapter {
		int mGalleryItemBackground;
		private Context mContext;

		ArrayList drawablesFromUrl = new ArrayList();

		public ImageAdapter(Context c) {
			mContext = c;
			TypedArray a = obtainStyledAttributes(R.styleable.GalleryTheme);
			mGalleryItemBackground = a.getResourceId(
					R.styleable.GalleryTheme_android_galleryItemBackground, 0);
			a.recycle();
		}

		public void addItem(Drawable item) {
			drawablesFromUrl.add(item);
		}

		public int getCount() {
			return drawablesFromUrl.size();
		}

		public Drawable getItem(int position) {
			return drawablesFromUrl.get(position);
		}

		public long getItemId(int position) {
			return position;
		}

		public View getView(int position, View convertView, ViewGroup parent) {
			ImageView i = new ImageView(mContext);

			i.setImageDrawable(drawablesFromUrl.get(position));
			i.setLayoutParams(new Gallery.LayoutParams(80, 70));
			i.setScaleType(ImageView.ScaleType.FIT_CENTER);
			i.setBackgroundResource(mGalleryItemBackground);

			return i;
		}
	}

}

Also /res/values/attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="GalleryTheme">
        <attr name="android:galleryItemBackground" />
    </declare-styleable>
</resources>

Dont forget to add permission in AndroidManifest.xml:

<uses-permission android:name="android.permission.INTERNET"/>

Also add this image to Drawable:

Note: Some code is taken from Stackoverflow.com and Androidpeople.com

Update:

Download source code: Download