Develop Reference

Load multiple Url images without using third party libraries in Recyclerview

Hi all I'm new to Android, I'm facing difficulty in loading Multiple images through URL into a Recycler view, My task is not to use any third Party Libraries and also not to add in string array in xml file. Is it Possible to loop an URL? for example "http://onethousandpaintings.com/imgs/numbers/number_1.png", if the number is change the image correspondingly changes.try it yourself once! I'm thinking an way to increment that number in a "For Loop" but could not figure it out. Kindly provide me an solution for it.

#sample AsycTask Code, you can pass the url to this class by execute method.
public class ShowImage extends AsyncTask<String,Void,Bitmap>{
private WeakReference<ImageView> imageview;
public ShowImage(ImageView imv){
imageview=new WeakReference<ImageView>(imv);
}
/** Background process
* input:url
* output: Bitmap image
* It passed into onPostExecute method
**/
#Override
protected Bitmap doInBackground(String... urls) {
return getBitMapFromUrl(urls[0]);
}
/** This method called after the doINputBackground method
* input:Bitmap image
* output: image set into the image view
* Image view passed from RecyclerViewOperation to ShowImage class through constructor
**/
#Override
protected void onPostExecute(Bitmap result) {
if((imageview!=null)&&(result!=null)){
ImageView imgview=imageview.get();
if(imgview!=null){
imgview.setImageBitmap(result);
}
}
}
/** This method called by doInBackground method
* input:url
* output: Bitmap image
*
**/
private Bitmap getBitMapFromUrl( String imageuri){
HttpURLConnection connection=null;
try {
URL url=new URL(imageuri);
// Log.d("bucky","bitmap" + imageuri);
connection= (HttpURLConnection) url.openConnection();
connection.setDoInput(true);
connection.connect();
InputStream is=connection.getInputStream();
Bitmap mybitmap=BitmapFactory.decodeStream(is);
return mybitmap;
} catch (MalformedURLException e) {
e.printStackTrace();
return null;
} catch (IOException e) {
e.printStackTrace();
return null;
}
finally {
if(connection!=null) {
connection.disconnect();
}
}
}
}

You can use AsynTask so it will load multiple Images from the Url, which provides the functionality to work in Background. So Your main thread does not gets affected and the Images downloads in the backgreound continously. I hope this answer your Question.

Uploading images to server from Android device

We are currently in need of a tool to upload photos shot from an android device directly to our server without creating an android app. Can this be done in a web application? I already tried getusermedia API without success.

Now you can make this task simpler and more useful i have designed one class named ImageUploaderUtility, which uploads images to a remote webserver. ImageUploadUtility has simple methods where you just need to pass the name of your image to upload.
Apart from this the key point here is this class needs to be executed in an AsynTask so it ensures the whole image upload process doesn't freeze your UI.
I have used this same past project and expanded it.
The first thing to understand is i have made inner class in my BlogPostExampleActivity which is extended from AsyncTask, this inner class will call the method to upload image which is declared and defined in ImageUploader Utility that's all isn't that simple.
Have a look at the code and let me know if you can't understand anything in this.
private class ImageUploaderTask extends AsyncTask<String, Integer, Void>{
#Override
protected void onPreExecute()
{
simpleWaitDialog = ProgressDialog.show(BlogPostExamplesActivity.this, "Wait", "Uploading Image");
}
#Override
protected Void doInBackground(String... params){
new ImageUploadUtility().uploadSingleImage(params[0]);
return null;
}
#Override
protected void onPostExecute(Void result){
simpleWaitDialog.dismiss();
}
}
And Now ImageUploaderUtility.java
package gargi.blogpostexamples.webservice;import java.io.File;import java.io.FileInputStream;import java.io.IOException;import java.io.InputStream;import org.apache.commons.httpclient.methods.PostMethod;import org.apache.commons.httpclient.methods.multipart.ByteArrayPartSource;import org.apache.commons.httpclient.methods.multipart.FilePart;import org.apache.commons.httpclient.methods.multipart.MultipartRequestEntity;import org.apache.commons.httpclient.methods.multipart.Part;import org.apache.commons.httpclient.methods.multipart.StringPart;import android.os.Environment;import android.util.Log;class ImageUploadUtility {/** * Simple Utility Method gets called from other class to start uploading the image * #param fileNameToUpload name of the file to upload */public void uploadSingleImage(String fileNameToUpload){ try { doUploadinBackground(getBytesFromFile(new File(Environment.getExternalStorageDirectory(),fileNameToUpload)), fileNameToUpload); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); }}/** * Method uploads the image using http multipart form data. * We are not using the default httpclient coming with android we are using the new from apache * they are placed in libs folder of the application * * #param imageData * #param filename * #return * #throws Exception */static boolean doUploadinBackground(final byte[] imageData, String filename) throws Exception{ String responseString = null; PostMethod method; method = new PostMethod("your url to upload"); org.apache.commons.httpclient.HttpClient client = new org.apache.commons.httpclient.HttpClient(); client.getHttpConnectionManager().getParams().setConnectionTimeout( 100000); FilePart photo = new FilePart("userfile", new ByteArrayPartSource( filename, imageData)); photo.setContentType("image/jpeg"); photo.setCharSet(null); String s = new String(imageData); Part[] parts = { new StringPart("latitude", "123456"), new StringPart("longitude","12.123567"), new StringPart("imei","1234567899"), new StringPart("to_email","some email"), photo }; method.setRequestEntity(new MultipartRequestEntity(parts, method .getParams())); client.executeMethod(method); responseString = method.getResponseBodyAsString(); method.releaseConnection(); Log.e("httpPost", "Response status: " + responseString); if (responseString.equals("SUCCESS")) { return true; } else { return false; } }/** * Simple Reads the image file and converts them to Bytes * * #param file name of the file * #return byte array which is converted from the image * #throws IOException */public static byte[] getBytesFromFile(File file) throws IOException { InputStream is = new FileInputStream(file); // Get the size of the file long length = file.length(); // You cannot create an array using a long type. // It needs to be an int type. // Before converting to an int type, check // to ensure that file is not larger than Integer.MAX_VALUE. if (length > Integer.MAX_VALUE) { // File is too large } // Create the byte array to hold the data byte[] bytes = new byte[(int)length]; // Read in the bytes int offset = 0; int numRead = 0; while (offset < bytes.length && (numRead=is.read(bytes, offset, bytes.length-offset)) >= 0) { offset += numRead; } // Ensure all the bytes have been read in if (offset < bytes.length) { throw new IOException("Could not completely read file "+file.getName()); } // Close the input stream and return bytes is.close(); return bytes;}}
So that's it for now, the bad thing in this is i have used to Inner Class in this activity and i don't know why but i am not feeling good about that, so next time i will try to make a single class extended from AysncTask and use that in existing examples.
Apart from this if you feel it can be improved in some other ways please don't forget to leave that in comment.
Last but not the list you can download the complete example from this link.

Android OOM errors due to image cacheing?

It will be a little easier to understand this if you think if the app I'm working on like facebook (at least that will give you a context for what i'm doing). I have one activity that uses a navigationdrawer to swap between fragments each of these fragments could have from one to several "subFragments" --- think of these as individual posts with things like a textview, a few buttons and an ImageView in them. When the "container fragment" is created I call to the server and get the data I need to make all the "sub fragments". I then iterate through the data and add all the "sub fragments" to the "container fragment"'s view.
I have noticed that I seem to be using an excessively high amount of memory (around 129 mb).
When the subfragments are created I then call this async task which pulls the images each fragment will need from a server and places them in their ImageView.
public class URLImageFactory extends AsyncTask<String, Void, Bitmap>
{
ImageView imgView;
private static final ImgCache mCache = new ImgCache();
public URLImageFactory(ImageView bmImage) {
this.imgView = bmImage;
}
#Override
protected Bitmap doInBackground(String... urls) {
String urldisplay = Config.SERVER_URL + urls[0].replaceAll("\\s+","%20");
Bitmap bitmap = null;
//If it is in the cache don't bother pulling it from the server
if(bitmap != null)
{
return bitmap;
}
try {
InputStream in = new java.net.URL(urldisplay).openStream();
//This is in case we are using match_parent/wrap content
if(imgView.getWidth() == 0 || imgView.getHeight() == 0)
{
bitmap = BitmapFactory.decodeStream(in);
} else {
bitmap = Bitmap.createScaledBitmap(BitmapFactory.decodeStream(in),
imgView.getWidth(), imgView.getHeight(), false);
}
mCache.put(urldisplay,bitmap);
} catch (Exception e) {
Log.e("Error", e.getMessage());
e.printStackTrace();
}
return bitmap;
}
#Override
protected void onPostExecute(Bitmap result) {
imgView.setImageBitmap(result);
}
}
I have made a rudimentary attempt at caching the images to speed up the process
public class ImgCache extends LruCache {
public ImgCache() {
super( calculateCacheSize() );
}
public static int calculateCacheSize()
{
int maxMemory = (int) Runtime.getRuntime().maxMemory() / 8;
int cacheSize = maxMemory;
return cacheSize;
}
#Override
protected int sizeOf( String key, Bitmap value ) {
return value.getByteCount() / 1024;
}
}
My app is crashing with outOfMemory exception. I have also noticed that when my "container fragment" is swapped out for a different one ... usually a similarly structured fragment... the onPause() and onStop() of these sub fragments are not being fired. If it helps the sub fragments are static inner classes while the container fragment is not. I think it is a bitmap related issue, but I'm not sure. I have attempted to use TransactionManager.remove(fragment) on all the sub fragments when the parent hits onPause but it doesn't seem to help.

You're dividing the byte count of each object by 1024, but only dividing the available memory by 8; the result is that the LRU cache could fill up to 128 times the amount of available memory you have. Remove the / 1024 from sizeOf and you should be good.

why my animations are not proper and image loading is taking more time in some of the images?

public class LoadImageActivity extends Activity {
ImageView image_view;
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
image_view = (ImageView)findViewById(R.id.imageview);
me m1=new me();
m1.execute("http://wallbase1.org/thumbs/rozne/thumb-499842.jpg");
me m2=new me();
m2.execute( "http://wallbase1.org/thumbs/rozne/thumb-637449.jpg");
me m3=new me();
m3.execute( "http://wallbase1.org/thumbs/rozne/thumb-2509834.jpg");
me m4=new me();
m4.execute( "http://wallbase1.org/thumbs/rozne/thumb-2501884.jpg");
me m5=new me();
m5.execute( "http://wallbase1.org/thumbs/rozne/thumb-2514440.jpg");
};
class me extends AsyncTask<String, Integer, Bitmap> {
Bitmap b1;
// private MainActivity m1;
protected Bitmap doInBackground(String...params) {
// TODO Auto-generated method stub
try {
/* Open a new URL and get the InputStream to load data from it. */
URL aURL = new URL(params[0]);
URLConnection conn = aURL.openConnection();
conn.connect();
InputStream is = conn.getInputStream();
/* Buffered is always good for a performance plus. */
BufferedInputStream bis = new BufferedInputStream(is);
/* Decode url-data to a bitmap. */
Bitmap bm = BitmapFactory.decodeStream(bis);
b1=bm;
bis.close();
is.close();
} catch (IOException e)
{
Log.e("DEBUGTAG", "Remote Image Exception", e);
}
return null;
}
#Override
protected void onPostExecute(Bitmap result) {
// TODO Auto-generated method stub
super.onPostExecute(result);
image_view.setImageBitmap(b1);
Animation rotation = AnimationUtils.loadAnimation(LoadImageActivity.this, R.anim.rotate);
image_view.startAnimation(rotation);
}
}}
I am trying to show an image from internet by decoding it into bitmap,i want to show multiple images from multiple urls.Is there any better way of implementing it?

The duration of a download depends on a lot of different stuff. You currently spawn 5 AsyncTasks and there is no guarantee that the order of delivery/execution will be the same order you spawned them. It is easily possible that the fifth image might be the first you received and this would result in a totally wrong order. So you should download all images first, possibly with just one AsyncTask. After that and if that succeeded, you should start the animation and switch between the images.

There're several better ways of doing it and all of them are far more complex than your code. But you do have a good start.
This video form Google I/O have some good techniques for image, check around 4:40 https://www.youtube.com/watch?v=gbQb1PVjfqM
It takes different times because they are different images with probably different sizes.
Please post your XML R.anim.rotate code so someone can try to check why the animation is not working.

Android HTML ImageGetter as AsyncTask

Okay, I'm losing my mind over this one. I have a method in my program which parses HTML. I want to include the inline images, and I am under the impression that using the Html.fromHtml(string, Html.ImageGetter, Html.TagHandler) will allow this to happen.
Since Html.ImageGetter doesn't have an implementation, it's up to me to write one. However, since parsing URLs into Drawables requires network access, I can't do this on the main thread, so it must be an AsyncTask. I think.
However, when you pass the ImageGetter as a parameter to Html.fromHtml, it uses the getDrawable method that must be overridden. So there's no way to call the whole ImageGetter.execute deal that triggers the doInBackground method, and so there's no way to actually make this asynchronous.
Am I going about it completely wrong, or worse, is this impossible? Thanks

I've done something very similar (I think) to what you want to do. What I needed to do back then is parse the HTML and set it up back to TextView and I needed to use Html.ImageGetter as well and having the same problem on fetching image on the main thread.
The steps that I did basically:
Create my own subclass for Drawable to facilitate redraw, I called it URLDrawable
Return the URLDrawable in getDrawable method of Html.ImageGetter
Once onPostExecute is called, I redraw the container of the Spanned result
Now the code for URLDrawable is as follow
public class URLDrawable extends BitmapDrawable {
// the drawable that you need to set, you could set the initial drawing
// with the loading image if you need to
protected Drawable drawable;
#Override
public void draw(Canvas canvas) {
// override the draw to facilitate refresh function later
if(drawable != null) {
drawable.draw(canvas);
}
}
}
Simple enough, I just override draw so it would pick the Drawable that I set over there after AsyncTask finishes.
The following class is the implementation of Html.ImageGetter and the one that fetches the image from AsyncTask and update the image
public class URLImageParser implements ImageGetter {
Context c;
View container;
/***
* Construct the URLImageParser which will execute AsyncTask and refresh the container
* #param t
* #param c
*/
public URLImageParser(View t, Context c) {
this.c = c;
this.container = t;
}
public Drawable getDrawable(String source) {
URLDrawable urlDrawable = new URLDrawable();
// get the actual source
ImageGetterAsyncTask asyncTask =
new ImageGetterAsyncTask( urlDrawable);
asyncTask.execute(source);
// return reference to URLDrawable where I will change with actual image from
// the src tag
return urlDrawable;
}
public class ImageGetterAsyncTask extends AsyncTask<String, Void, Drawable> {
URLDrawable urlDrawable;
public ImageGetterAsyncTask(URLDrawable d) {
this.urlDrawable = d;
}
#Override
protected Drawable doInBackground(String... params) {
String source = params[0];
return fetchDrawable(source);
}
#Override
protected void onPostExecute(Drawable result) {
// set the correct bound according to the result from HTTP call
urlDrawable.setBounds(0, 0, 0 + result.getIntrinsicWidth(), 0
+ result.getIntrinsicHeight());
// change the reference of the current drawable to the result
// from the HTTP call
urlDrawable.drawable = result;
// redraw the image by invalidating the container
URLImageParser.this.container.invalidate();
}
/***
* Get the Drawable from URL
* #param urlString
* #return
*/
public Drawable fetchDrawable(String urlString) {
try {
InputStream is = fetch(urlString);
Drawable drawable = Drawable.createFromStream(is, "src");
drawable.setBounds(0, 0, 0 + drawable.getIntrinsicWidth(), 0
+ drawable.getIntrinsicHeight());
return drawable;
} catch (Exception e) {
return null;
}
}
private InputStream fetch(String urlString) throws MalformedURLException, IOException {
DefaultHttpClient httpClient = new DefaultHttpClient();
HttpGet request = new HttpGet(urlString);
HttpResponse response = httpClient.execute(request);
return response.getEntity().getContent();
}
}
}
Finally, below is the sample program to demonstrate how things work:
String html = "Hello " +
"<img src='http://www.gravatar.com/avatar/" +
"f9dd8b16d54f483f22c0b7a7e3d840f9?s=32&d=identicon&r=PG'/>" +
" This is a test " +
"<img src='http://www.gravatar.com/avatar/a9317e7f0a78bb10a980cadd9dd035c9?s=32&d=identicon&r=PG'/>";
this.textView = (TextView)this.findViewById(R.id.textview);
URLImageParser p = new URLImageParser(textView, this);
Spanned htmlSpan = Html.fromHtml(html, p, null);
textView.setText(htmlSpan);

Pretty nice. However, The type DefaultHttpClient is deprecated. Try this on fetch method:
private InputStream fetch(String urlString) throws MalformedURLException, IOException {
URL url = new URL(urlString);
HttpURLConnection urlConnection = (HttpURLConnection) url.openConnection();
InputStream stream = urlConnection.getInputStream();
return stream;
}

I got a bit confused, is the HTML you want to render static and merely for formatting, or is it dynamic and coming from the web? If you wanted the latter, that is, to render the HTML and retrieve the images, well it's gonna be a bit of a pain (suggestion - just use a WebView?).
Anyway, you would first have to run the AsyncTask to retrieve the initial HTML. You would then pass those results into the Html.fromHtml() with the custom implementation for the Html.ImageGetter class. Then in that implementation you'd have to kick off an individual AsyncTask to retrieve each of the images (you probably want to implement some caching).
However, from reading the documentation (and I think I've seen some samples), it would seem to me that this is not what they meant the Html.ImageGetter for. I think it's meant for hardcoded HTML with references to internal drawables, but that's just my take.

if you using Picasso, change part of #momo code to
/***
* Get the Drawable from URL
* #param urlString
* #return
*/
public Drawable fetchDrawable(String urlString) {
try {
Drawable drawable = fetch(urlString);
drawable.setBounds(0, 0, 0 + drawable.getIntrinsicWidth(), 0
+ drawable.getIntrinsicHeight());
return drawable;
} catch (Exception e) {
return null;
}
}
private Drawable fetch(String urlString) throws MalformedURLException, IOException {
return new BitmapDrawable(c.getResources(), Picasso.with(c).load(urlString).get());
}

AsyncTask task = new AsyncTask (){
#Override
protected String doInBackground(Integer... params) {
span = Html.fromHtml(noticeList.get(0)
.getContent(), imgGetter, null);
return null;
}
#Override
protected void onPostExecute(String result) {
super.onPostExecute(result);
text.setMovementMethod(ScrollingMovementMethod
.getInstance());
if(span != null){
text.setText(span);
}
}
};
task.execute();