Gallery with remote Images

Basic Tutorials concerning: GUI, Views, Activites, XML, Layouts, Intents, ...

Gallery with remote Images

Postby plusminus » Sat Feb 02, 2008 12:48 pm

android.widget.Gallery with remote Images


What you learn: You will learn how to use the Gallery-Widget (android.widget.Gallery) to display a remote images.

:?: Problems/Questions: Write them right below...

Difficulty: 1 of 5 :)

Read before: :src: android.widget.Gallery - Example because this tutorial is differing just in some lines.

What it will look like:
Image


Description: The only real difference to the :src: android.widget.Gallery - Example-Tutorial is a single function in our Custom ImageAdapter. Before we were loading the images from our project resources with this line:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. i.setImageResource(this.myImageIds[position]);
Parsed in 0.030 seconds, using GeSHi 1.0.8.4

What we'll do now instead is the following:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.         /** URL-Strings to some remote images. */
  2.         private String[] myRemoteImages = {
  3.                         "http://www.anddev.org/images/tiny_tutheaders/weather_forecast.png",
  4.                         "http://www.anddev.org/images/tiny_tutheaders/cellidtogeo.png",
  5.                         "http://www.anddev.org/images/tiny_tutheaders/droiddraw.png"
  6.         };
  7.         //...
  8.  
  9.         public View getView(int position, View convertView, ViewGroup parent) {
  10.             ImageView i = new ImageView(this.myContext);
  11.             try {
  12.                                 /* Open a new URL and get the InputStream to load data from it. */
  13.                                 URL aURL = new URL(myRemoteImages[position]);
  14.                                 URLConnection conn = aURL.openConnection();
  15.                                 conn.connect();
  16.                                 InputStream is = conn.getInputStream();
  17.                                 /* Buffered is always good for a performance plus. */
  18.                                 BufferedInputStream bis = new BufferedInputStream(is);
  19.                                 /* Decode url-data to a bitmap. */
  20.                                 Bitmap bm = BitmapFactory.decodeStream(bis);
  21.                                 bis.close();
  22.                                 is.close();
  23.                                 /* Apply the Bitmap to the ImageView that will be returned. */
  24.                                 i.setImageBitmap(bm);
  25.                         } catch (IOException e) {
  26.                                 i.setImageResource(R.drawable.error);
  27.                                 Log.e("DEBUGTAG", "Remtoe Image Exception", e);
  28.                         }
  29.         //...
Parsed in 0.035 seconds, using GeSHi 1.0.8.4

Thats it :)

Full source:


"/res/layout/main.xml":
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.    android:orientation="vertical"
  4.    android:layout_width="fill_parent"
  5.    android:layout_height="fill_parent"
  6.    >
  7. <Gallery id="@+id/gallery"
  8.        android:layout_width="fill_parent"
  9.        android:layout_height="wrap_content"
  10.        android:gravity="bottom"
  11. />
  12. </LinearLayout>
Parsed in 0.002 seconds, using GeSHi 1.0.8.4


"/src/your_package_structure/GalleryExample.java":
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. package org.anddev.android.galleryexample;
  2.  
  3. import java.io.BufferedInputStream;
  4. import java.io.IOException;
  5. import java.io.InputStream;
  6. import java.net.URL;
  7. import java.net.URLConnection;
  8.  
  9. import android.app.Activity;
  10. import android.content.Context;
  11. import android.graphics.Bitmap;
  12. import android.graphics.BitmapFactory;
  13. import android.os.Bundle;
  14. import android.util.Log;
  15. import android.view.View;
  16. import android.view.ViewGroup;
  17. import android.widget.BaseAdapter;
  18. import android.widget.Gallery;
  19. import android.widget.ImageView;
  20.  
  21. public class GalleryExample extends Activity {
  22.     /** Called when the activity is first created. */
  23.     @Override
  24.     public void onCreate(Bundle icicle) {
  25.         super.onCreate(icicle);
  26.         setContentView(R.layout.main);
  27.  
  28.         /* Find the gallery defined in the main.xml
  29.          * Apply a new (custom) ImageAdapter to it. */
  30.         ((Gallery) findViewById(R.id.gallery))
  31.                         .setAdapter(new ImageAdapter(this));
  32.     }
  33.  
  34.     public class ImageAdapter extends BaseAdapter {
  35.         /** The parent context */
  36.         private Context myContext;
  37.  
  38.         /** URL-Strings to some remote images. */
  39.         private String[] myRemoteImages = {
  40.                         "http://www.anddev.org/images/tiny_tutheaders/weather_forecast.png",
  41.                         "http://www.anddev.org/images/tiny_tutheaders/cellidtogeo.png",
  42.                         "http://www.anddev.org/images/tiny_tutheaders/droiddraw.png"
  43.         };
  44.        
  45.         /** Simple Constructor saving the 'parent' context. */
  46.         public ImageAdapter(Context c) { this.myContext = c; }
  47.  
  48.         /** Returns the amount of images we have defined. */
  49.         public int getCount() { return this.myRemoteImages.length; }
  50.  
  51.         /* Use the array-Positions as unique IDs */
  52.         public Object getItem(int position) { return position; }
  53.         public long getItemId(int position) { return position; }
  54.  
  55.         /** Returns a new ImageView to
  56.          * be displayed, depending on
  57.          * the position passed. */
  58.         public View getView(int position, View convertView, ViewGroup parent) {
  59.             ImageView i = new ImageView(this.myContext);
  60.  
  61.             try {
  62.                                 /* Open a new URL and get the InputStream to load data from it. */
  63.                                 URL aURL = new URL(myRemoteImages[position]);
  64.                                 URLConnection conn = aURL.openConnection();
  65.                                 conn.connect();
  66.                                 InputStream is = conn.getInputStream();
  67.                                 /* Buffered is always good for a performance plus. */
  68.                                 BufferedInputStream bis = new BufferedInputStream(is);
  69.                                 /* Decode url-data to a bitmap. */
  70.                                 Bitmap bm = BitmapFactory.decodeStream(bis);
  71.                                 bis.close();
  72.                                 is.close();
  73.                                 /* Apply the Bitmap to the ImageView that will be returned. */
  74.                                 i.setImageBitmap(bm);
  75.                         } catch (IOException e) {
  76.                                 i.setImageResource(R.drawable.error);
  77.                                 Log.e("DEBUGTAG", "Remtoe Image Exception", e);
  78.                         }
  79.            
  80.             /* Image should be scaled as width/height are set. */
  81.             i.setScaleType(ImageView.ScaleType.FIT_CENTER);
  82.             /* Set the Width/Height of the ImageView. */
  83.             i.setLayoutParams(new Gallery.LayoutParams(150, 150));
  84.             return i;
  85.         }
  86.  
  87.         /** Returns the size (0.0f to 1.0f) of the views
  88.          * depending on the 'offset' to the center. */
  89.         public float getScale(boolean focused, int offset) {
  90.                 /* Formula: 1 / (2 ^ offset) */
  91.             return Math.max(0, 1.0f / (float)Math.pow(2, Math.abs(offset)));
  92.         }
  93.     }
  94. }
Parsed in 0.047 seconds, using GeSHi 1.0.8.4


Regards,
plusminus
Image
Image | Android Development Community / Tutorials
User avatar
plusminus
Site Admin
Site Admin
 
Posts: 2688
Joined: Wed Nov 14, 2007 8:37 pm
Location: Schriesheim, Germany

Top

Postby cabernet1976 » Sun Feb 03, 2008 4:24 am

Hi plusminus,

Thanks for your tutorials.
My doubt is: when the remote image is large, it will cost long time, right?
Upload2Flickr's blog: http://upload2flickr.blogspot.com
cabernet1976
Senior Developer
Senior Developer
 
Posts: 154
Joined: Fri Nov 16, 2007 2:34 am
Location: China

Postby plusminus » Sun Feb 03, 2008 11:06 am

Hello cabernet,

Probably yes.
I experienced, that images get only loaded, when they become visible on the screen.
Like when you have 1000 images in the Gallery only 3-4 ones get loaded at the beginning (depends on how many are visible). The rest is loaded "as its needed".

Regards,
plusminus
Image
Image | Android Development Community / Tutorials
User avatar
plusminus
Site Admin
Site Admin
 
Posts: 2688
Joined: Wed Nov 14, 2007 8:37 pm
Location: Schriesheim, Germany

Images

Postby baskar » Mon Feb 04, 2008 5:31 am

Hi,

How to store Images my local disk....

Regards,
Baskar
baskar
Developer
Developer
 
Posts: 46
Joined: Wed Dec 26, 2007 6:03 am
Location: India

Postby plusminus » Mon Feb 04, 2008 10:24 am

Hello baskar,

:idea: loading bitmaps to the emulator is done in the :src: Loading images from remote server/web-Tutorial.

Saving to file instead of displaying in ImageView is just one line away.

Regards,
plusminus
Image
Image | Android Development Community / Tutorials
User avatar
plusminus
Site Admin
Site Admin
 
Posts: 2688
Joined: Wed Nov 14, 2007 8:37 pm
Location: Schriesheim, Germany

Postby Jesmiatka » Mon May 05, 2008 2:26 pm

Hi,

I am trying to load images from a HTTPS server, but I do not know how to get an inputstream of that type..
When I try to use the code used for the "normal" download method I get an I/O Exception:

INFO/TAG(7914): java.io.IOException: Hostname <issues.xxx.xx> was not verified


When I use the URL in the browser, it opens the file just fine...
Has anyone got a solution for this?

Last used code to download the image:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.         private Drawable ImageOperations(String url) {
  2.                 try {
  3.                         HttpsURLConnection conn = (HttpsURLConnection) new URL(url).openConnection();
  4.             conn.connect();
  5.             InputStream is = conn.getInputStream();
  6.             BufferedInputStream bis = new BufferedInputStream(is);
  7.                         Drawable d = Drawable.createFromStream(bis, "src");
  8.                         bis.close();
  9.                         is.close();
  10.                         return d;
  11.                 } catch (MalformedURLException e) {
  12.                         Log.i("TAG", "Malformed");
  13.                         return null;
  14.                 } catch (IOException e) {
  15.                         Log.i("TAG", "IO" , e);
  16.                         return null;
  17.                 }
  18.         }
Parsed in 0.038 seconds, using GeSHi 1.0.8.4


Yours sincerely,
Mike

Update
I tried to do some other things as well, but it still does not work..
The following works with a HTTP URL, but when I change it to a HTTPS it fails..

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.         private Drawable ImageOperations(String url) {
  2.                 try {
  3.                         URL myUrl = new URL(url);
  4.                         HttpURLConnection conn = (HttpURLConnection) myUrl.openConnection();
  5.                         conn.connect();
  6.             InputStream is = conn.getInputStream();
  7.             BufferedInputStream bis = new BufferedInputStream(is);
  8.                         Drawable d = Drawable.createFromStream(bis, "src");
  9.                         bis.close();
  10.                         is.close();
  11.                         return d;
  12.                 } catch (MalformedURLException e) {
  13.                         Log.i("TAG", "Malformed", e);
  14.                         return null;
  15.                 } catch (IOException e) {
  16.                         Log.i("TAG", "IO" , e);
  17.                         return null;
  18.                 }
  19.         }
Parsed in 0.038 seconds, using GeSHi 1.0.8.4
Jesmiatka
Senior Developer
Senior Developer
 
Posts: 164
Joined: Mon Feb 04, 2008 3:37 pm
Location: Netherlands

Top

Postby Jesmiatka » Tue May 06, 2008 10:11 am

fixed with the following:

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.                         HttpsURLConnection conn = (HttpsURLConnection) myUrl.openConnection();
  2.  
  3.                         conn.setHostnameVerifier(new AllowAllHostnameVerifier());
Parsed in 0.035 seconds, using GeSHi 1.0.8.4
Jesmiatka
Senior Developer
Senior Developer
 
Posts: 164
Joined: Mon Feb 04, 2008 3:37 pm
Location: Netherlands

getScale()

Postby Txorl » Sat Jan 03, 2009 10:08 pm

The getScale Method of BaseAdapter does not work anymore on SDK 1.0. Does anyone have an idea how the actual picture of the gallery can be scaled with new SDK?

Oy maybe does someone have an idea how the central picture can be for example surrounded by a rectangle ?


Thanks in advance
Txorl
Junior Developer
Junior Developer
 
Posts: 16
Joined: Wed Sep 17, 2008 3:12 pm

Re: Gallery with remote Images

Postby ernesto » Tue Feb 03, 2009 9:59 am

plusminus wrote:
android.widget.Gallery with remote Images


What you learn: You will learn how to use the Gallery-Widget (android.widget.Gallery) to display a remote images.

Regards,
plusminus


Hey plusminus,

thanks for the tutorial. Little mistake I found: "You will learn how to use the Gallery-Widget android.widget.Gallery to display a remote image" (without the s at the ending, right? :-) )

Keep up the good work!
greetings from Switzerland!

ernesto
ernesto
Junior Developer
Junior Developer
 
Posts: 10
Joined: Tue Feb 03, 2009 9:41 am
Location: Switzerland

Postby dhaiwat » Fri Sep 18, 2009 6:11 am

and convert buffer to byte

byte[] bytesa=cursor.getBlob(int);

if(bytesa!= null){

ByteArrayInputStream imageStream = new ByteArrayInputStream(bytesa);
bmpimag = BitmapFactory.decodeStream(imageStream);
bmpimag = HomeScreen.resizeBitmap(bmpimag, 250, 250);
}

imageview.setImageBitmap(bmpimag);
Attachments
Httprequest.zip
to resize and convert into byte the image
(840 Bytes) Downloaded 527 times
dhaiwat
Developer
Developer
 
Posts: 28
Joined: Tue Feb 10, 2009 6:49 am

Postby rogerdodger » Sat Dec 05, 2009 5:20 pm

does anyone know how to make the gallery look like the wallpaper gallery?

my images are over lapping and i keep getting 20 or 30 pixel gaps between some of the images. I set the target to 1.6.

did i do something wrong?
rogerdodger
Junior Developer
Junior Developer
 
Posts: 21
Joined: Mon Nov 30, 2009 8:38 am

Re: getScale()

Postby garywang » Thu Jan 21, 2010 5:39 am

Txorl wrote:The getScale Method of BaseAdapter does not work anymore on SDK 1.0. Does anyone have an idea how the actual picture of the gallery can be scaled with new SDK?

Oy maybe does someone have an idea how the central picture can be for example surrounded by a rectangle ?


Thanks in advance


Dear all,

Any following up on above issue?
http://markmail.org/message/pgsdwbxmcb7 ... 0getScale()+page:1+mid:ixjukckr4xzcekin+state:results

Thanks!

Gary
User avatar
garywang
Junior Developer
Junior Developer
 
Posts: 19
Joined: Tue Sep 09, 2008 8:22 am
Location: Taipei, Taiwan

Null Pointer

Postby rogerdodger » Thu Jan 21, 2010 6:45 pm

i'm using this code to set "bm" to an image button. But I just realized that some times i get the error "NullPointer Exception"

and it appears to be pointing to "bm"

It seems sometimes an image doesn't load (for whatever reason) and this is causing my app to "Force Close" or just exit altogether.

How can I check for null and prevent this? The "catch{}" doesn't seem to be catching this error???
rogerdodger
Junior Developer
Junior Developer
 
Posts: 21
Joined: Mon Nov 30, 2009 8:38 am

R.drawable.error

Postby sharma33 » Wed Mar 10, 2010 1:44 pm

Hey
I'm a beginner and I'm getting an error
R.drawable.error cannot be resolved
So I changed it to - R.drawable.icon because I could see icon in the drawable folders..
The error went away but when I run the code onto the emulator in the program all I see is the 'icon' image 3 times over
That means its going into the exception right?
Why?
Please tell me as soon as possible! Any help will be appreciated!
sharma33
Once Poster
Once Poster
 
Posts: 1
Joined: Wed Mar 10, 2010 1:40 pm

left align gallery view

Postby saamyandroid » Thu Mar 18, 2010 6:08 am

i want to know , is it possible to left align gallery view ?

because it starts from center of the screen.
I want Gallery view always should start from left Corner of the screen.

thanks,
Saamy
saamyandroid
Experienced Developer
Experienced Developer
 
Posts: 84
Joined: Wed Sep 09, 2009 8:17 pm
Location: INDIA

Top
Next

Return to Novice Tutorials

Who is online

Users browsing this forum: No registered users and 3 guests