Board index » Android Tutorials with Source Code » Novice Tutorials

Skip to content

A android.widget.Gallery - Example

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

Postby JavaAndroid » Sat Oct 18, 2008 8:53 am

Yeah sure...

This is my Activity Class..
public class ImageApplication extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
((Gallery) findViewById(R.id.gallery))
.setAdapter(new ImageAdapter(this));
setContentView(R.layout.main);
}
}

And my Image Adapter class
public class ImageAdapter extends BaseAdapter {
/** The parent context */
private Context myContext;

/** All images to be displayed.
* Put some images to project-folder:
* '/res/drawable/uvw.xyz' .*/
private int[] myImageIds = {
R.drawable.image1


};
/** Simple Constructor saving the 'parent' context. */
public ImageAdapter(Context c) { this.myContext = c; }

/** Returns the amount of images we have defined. */
public int getCount() { return this.myImageIds.length; }

/* Use the array-Positions as unique IDs */
public Object getItem(int position) { return position; }
public long getItemId(int position) { return position; }

/** Returns a new ImageView to
* be displayed, depending on
* the position passed. */
public View getView(int position, View convertView, ViewGroup parent) {
ImageView i = new ImageView(this.myContext);

i.setImageResource(this.myImageIds[position]);
/* Image should be scaled as width/height are set. */
i.setScaleType(ImageView.ScaleType.FIT_XY);
/* Set the Width/Height of the ImageView. */
i.setLayoutParams(new Gallery.LayoutParams(150, 150));
return i;
}

/** Returns the size (0.0f to 1.0f) of the views
* depending on the 'offset' to the center. */
public float getScale(boolean focused, int offset) {
/* Formula: 1 / (2 ^ offset) */
return Math.max(0, 1.0f / (float)Math.pow(2, Math.abs(offset)));
}

}

main.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="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="DreamApp-----Gallery Example"
/>
<Gallery id="@+id/gallery"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="bottom"
/>
</LinearLayout>


i could not figure out the problem

Thanks in Advance

Thanks
JavaAndroid
JavaAndroid
Freshman
Freshman
 
Posts: 7
Joined: Wed Oct 15, 2008 8:02 am
Top
Top

Postby bino » Sat Oct 18, 2008 3:50 pm

@JavaAndroid
As I have wrote in my previous post. You should put the line setContentView(R.layout.main); before you call any findViewById :)
Please check again!
User avatar
bino
Freshman
Freshman
 
Posts: 9
Joined: Mon Oct 13, 2008 7:15 am
Top

Postby JavaAndroid » Sat Oct 18, 2008 4:15 pm

Hi Bino,
thanks for ur response....

even i tried that too..
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(R.layout.main);
((Gallery) findViewById(R.id.gallery))
.setAdapter(new ImageAdapter(this));

}

but still i m getting NullPointerException while instantiating ImageAdapter...

Thanks in Advance

JavaAndroid
JavaAndroid
Freshman
Freshman
 
Posts: 7
Joined: Wed Oct 15, 2008 8:02 am
Top

Postby bino » Sat Oct 18, 2008 6:21 pm

Ok, I have checked your source code, the problem is inside your layout file.

you should use <Gallery android:id="@+id/gallery" instead of <Gallery id="@+id/gallery"

It will work!

Regards,
Bino
User avatar
bino
Freshman
Freshman
 
Posts: 9
Joined: Mon Oct 13, 2008 7:15 am
Top

Postby JavaAndroid » Sat Oct 18, 2008 6:39 pm

Hi Bino,
Thanks a million....it worked atlast.....you have identified the problem correctly.....the problem is with android:id in main.xml file....

Thanks again

Thanks
JavaAndroid
JavaAndroid
Freshman
Freshman
 
Posts: 7
Joined: Wed Oct 15, 2008 8:02 am
Top

Postby perkal » Sun Nov 16, 2008 9:57 pm

Hi,

I see in the imagen of the example that the images which not are selected are smallest that the image selected, but when i test the example, the images (selected and not selected) have the same size. What is the property or function that makes that?

Thanks all!
perkal
Freshman
Freshman
 
Posts: 5
Joined: Mon Oct 27, 2008 11:04 am
Top
Top

Postby dipinpoovathel » Tue Dec 16, 2008 6:36 am

Hi perkal,

Did u solved the issue? Does anyone kow how to solve the issue mentioned by pwekal? (Scaling image in the gallery).
dipinpoovathel
Freshman
Freshman
 
Posts: 2
Joined: Thu Nov 27, 2008 12:58 pm
Top

i.setLayoutParams(new Gallery.LayoutParams(300, 400));

Postby weldrian » Fri Dec 19, 2008 3:45 am

dipinpoovathel wrote:Hi perkal,

Did u solved the issue? Does anyone kow how to solve the issue mentioned by pwekal? (Scaling image in the gallery).



i did that b4. here is the solution, hope its help.
change the layout parameter, you can refer the example below. or u can go to Apidemo>view>gallery. there have a very good example.

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

i.setImageResource(mImageIds[position]);
i.setScaleType(ImageView.ScaleType.FIT_XY);
i.setLayoutParams(new Gallery.LayoutParams(300, 400));

// The preferred Gallery item background
i.setBackgroundResource(mGalleryItemBackground);

return i;
}
weldrian
Junior Developer
Junior Developer
 
Posts: 23
Joined: Tue Dec 09, 2008 1:30 am
Top

Postby ernesto » Tue Feb 03, 2009 3:17 pm

I have a general question regarding the layout parameters:

When I develop a application I don't know in advance which layout parameters I should apply, because an Android display could come at any size and form. How can I solve that?

Edit: Oh and another question - when I try the example, all the images are the same size, not like shown in the example small - big - small.

Thanks in advance
greetings from Switzerland!

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

Rounded corners

Postby TAKEphONE » Mon Feb 16, 2009 11:48 pm

Hi,

Can I somehow show the gallery of images with images showing within rounded corners ?

TIA
TAKEphONE
Junior Developer
Junior Developer
 
Posts: 20
Joined: Mon Nov 03, 2008 11:35 am
Top

images from sd card

Postby kartikdo » Wed Feb 25, 2009 4:33 am

what if I want to load images from SD card or from phone using the above example.
Graduate student, USC
kartikdo
Freshman
Freshman
 
Posts: 2
Joined: Fri Feb 06, 2009 1:02 am
Location: Los Angeles, CA
Top

Postby Zachary » Fri Mar 06, 2009 12:24 pm

there is a problem, the getScale() and getAlpha are removed from 0.9 SDK, I can't show the image bigger or smaller when scrolling, the people who use the tutorial code should have this problem.
How can I do to walk around it, anybody has some suggestion?
Thanks a lot
Zachary
Freshman
Freshman
 
Posts: 5
Joined: Tue Feb 24, 2009 10:56 am
Top

Postby keiko11245 » Wed Mar 11, 2009 5:12 pm

I'm trying to change image size to.
And It works fine at initialization but not after.
I post my code.

main_gallery:
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1. <?xml version="1.0" encoding="utf-8"?>
  2.  
  3. <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
  4.  
  5.    android:orientation="vertical"
  6.  
  7.    android:layout_width="fill_parent"
  8.  
  9.    android:layout_height="fill_parent">
  10.  
  11.         <Gallery android:layout_height="wrap_content"
  12.  
  13.                 android:id="@+id/GalerieRss"
  14.  
  15.                 android:layout_x="5px"
  16.  
  17.                 android:layout_y="50px"
  18.  
  19.                 android:layout_width="fill_parent"
  20.  
  21.                 android:unselectedAlpha="0.5"
  22.  
  23.                 android:spacing="20px"/>
  24.  
  25. </AbsoluteLayout>
Parsed in 0.002 seconds, using GeSHi 1.0.8.4



RssMondeActivity:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2. public class RssMondeActivity extends Activity {
  3.  
  4.  
  5.  
  6.      private String listTitre[] = {"title 1","title 2", "title3"};
  7.  
  8.      private String listDate[] = {"11 mars 2009", "11 mars 2009", "11 mars 2009"};
  9.  
  10.      private String listImage[] = {
  11.  
  12.           "http://medias.lemonde.fr/mmpub/edt/ill/2009/03/11/h_1_ill_1122664_828640.jpg",
  13.  
  14.           "http://medias.lemonde.fr/mmpub/edt/ill/2009/03/11/h_1_ill_1122664_828641.jpg",
  15.  
  16.           "http://medias.lemonde.fr/mmpub/edt/ill/2009/03/11/h_1_ill_1122664_828642.jpg"
  17.  
  18.      };
  19.  
  20.  
  21.  
  22.      private String listDescription[] = {"description 1","description 2","description 3"};
  23.  
  24.        
  25.  
  26.        
  27.  
  28.      private Gallery gal;
  29.  
  30.        
  31.  
  32.     @Override
  33.  
  34.     public void onCreate(Bundle savedInstanceState) {
  35.  
  36.         super.onCreate(savedInstanceState);
  37.  
  38.        
  39.  
  40.         requestWindowFeature(Window.FEATURE_NO_TITLE);
  41.  
  42.        
  43.  
  44.         setContentView(R.layout.main_gallery);
  45.  
  46.        
  47.  
  48.         RssGalleryAdapter otla = new RssGalleryAdapter(this);
  49.  
  50.        
  51.  
  52.         for(int i = 0 ; i < listTitre.length; i ++){
  53.  
  54.         otla.addItem(new RssObject(listTitre[i], listDate[i], listImage[i], listDescription[i] ));
  55.  
  56.         }
  57.  
  58.          
  59.  
  60.         gal = (Gallery) findViewById(R.id.GalerieRss);
  61.  
  62.         gal.setAdapter(otla);        
  63.  
  64.     }  
  65.  
  66. }
  67.  
  68.  
Parsed in 0.037 seconds, using GeSHi 1.0.8.4


RssGalleryAdapter:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. public class RssGalleryAdapter  extends BaseAdapter {
  2.  
  3.         private Context mContext;
  4.  
  5.  
  6.  
  7.     private List<RssObject> mItems = new ArrayList<RssObject>();
  8.  
  9.  
  10.  
  11.     public RssGalleryAdapter(Context context) {
  12.  
  13.          mContext = context;
  14.  
  15.     }
  16.  
  17.  
  18.  
  19.     public void addItem(RssObject it) { mItems.add(it); }
  20.  
  21.  
  22.  
  23.     public void setListItems(List<RssObject> lit) { mItems = lit; }
  24.  
  25.  
  26.  
  27.     /** @return The number of items in the */
  28.  
  29.     public int getCount() { return mItems.size(); }
  30.  
  31.  
  32.  
  33.     public Object getItem(int position) { return mItems.get(position); }
  34.  
  35.  
  36.  
  37.     public boolean areAllItemsSelectable() { return false; }
  38.  
  39.  
  40.  
  41.  
  42.  
  43.     /** Use the array index as a unique id. */
  44.  
  45.     public long getItemId(int position) {
  46.  
  47.          return position;
  48.  
  49.     }
  50.  
  51.    
  52.  
  53.      
  54.  
  55.     public View getView(int position, View convertView, ViewGroup parent) {
  56.  
  57.         ImageView i;
  58.  
  59.  
  60.  
  61.         int selected = ((Gallery)parent).getSelectedItemPosition();
  62.  
  63.        
  64.  
  65.         if (convertView == null) {
  66.  
  67.             i = new ImageView(this.mContext);  
  68.  
  69.         } else { // Reuse/Overwrite the View passed
  70.  
  71.             // We are assuming(!) that it is castable!
  72.  
  73.             i = (ImageView) convertView;
  74.  
  75.         }
  76.  
  77.        
  78.  
  79.         i.setImageDrawable(mItems.get(position).getImage());
  80.  
  81.         /* Image should be scaled as width/height are set. */
  82.  
  83.         i.setScaleType(ImageView.ScaleType.CENTER);
  84.  
  85.         /* Set the Width/Height of the ImageView. */
  86.  
  87.         float scale = getScale((position-selected));
  88.  
  89.         i.setLayoutParams(new Gallery.LayoutParams(Math.round(90*scale),Math.round(60*scale)));
  90.  
  91.        
  92.  
  93.            
  94.  
  95.         return i;
  96.  
  97.     }
  98.  
  99.    
  100.  
  101.     public float getScale(int offset) {
  102.  
  103.         /* Formula: 1 / (2 ^ offset) */
  104.  
  105.           return Math.max(0, 1.0f / (float)Math.pow(2, Math.abs(offset)));
  106.  
  107.       }
  108.  
  109.  
  110.  
  111. }
  112.  
  113.  
Parsed in 0.037 seconds, using GeSHi 1.0.8.4


RssObject:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2. public class RssObject {
  3.  
  4.     private Drawable mImageRss;
  5.  
  6.     private String mUrlImageRss;
  7.  
  8.     private String mTitreRss;
  9.  
  10.     private String mDateRss;
  11.  
  12.     private String mDescription;
  13.  
  14.        
  15.  
  16.     public RssObject(String titre, String date, String urlImage, String description ){
  17.  
  18.         mTitreRss = titre;
  19.  
  20.         mDateRss = date;
  21.  
  22.         mDescription = description;
  23.  
  24.         mUrlImageRss = urlImage;
  25.  
  26.         downloadImageDrawable(urlImage);
  27.  
  28.     }
  29.  
  30.        
  31.  
  32.     public Drawable getImage() {
  33.  
  34.         return mImageRss;
  35.  
  36.     }
  37.  
  38.        
  39.  
  40.     public String getUrlImage() {
  41.  
  42.         return mUrlImageRss;
  43.  
  44.     }
  45.  
  46.        
  47.  
  48.     public String getTitre() {
  49.  
  50.         return mTitreRss;
  51.  
  52.     }
  53.  
  54.  
  55.  
  56.     public String getDate() {
  57.  
  58.         return mDateRss;
  59.  
  60.     }
  61.  
  62.  
  63.  
  64.     public String getDescription(){
  65.  
  66.         return mDescription;                   
  67.  
  68.     }
  69.  
  70.        
  71.  
  72.     public void downloadImageDrawable(String urlImage) {
  73.  
  74.         if(urlImage != ""){
  75.  
  76.             URL myFileUrl = null;
  77.  
  78.             try {
  79.  
  80.                 myFileUrl = new URL(urlImage);
  81.  
  82.             } catch (MalformedURLException e) {
  83.  
  84.                 Log.d("RssObject", e.toString());
  85.  
  86.             }
  87.  
  88.             try {
  89.  
  90.                 HttpURLConnection conn = (HttpURLConnection) myFileUrl.openConnection();
  91.  
  92.        
  93.  
  94.                 conn.connect();
  95.  
  96.        
  97.  
  98.                 InputStream is = conn.getInputStream();
  99.  
  100.                 mImageRss = Drawable.createFromStream(is, "src");              
  101.  
  102.                 is.close();
  103.  
  104.             } catch (IOException e) {
  105.  
  106.                 Log.d("RssObject", e.toString());
  107.  
  108.             }
  109.  
  110.         }
  111.  
  112.     }
  113.  
  114. }
Parsed in 0.039 seconds, using GeSHi 1.0.8.4




RssGalleryAdapter.getView is called only one time. I want to call it every time gallery's itemSelected changes.
I don't know if it's possible and how.
keiko11245
Freshman
Freshman
 
Posts: 7
Joined: Tue Mar 10, 2009 11:49 am
Top

Loop the gallery

Postby yesnto » Sat Mar 14, 2009 8:08 am

Does anyone know how to loop their gallery?
yesnto
Once Poster
Once Poster
 
Posts: 1
Joined: Sat Mar 14, 2009 8:05 am
Top

Postby Johan » Tue Mar 24, 2009 9:59 am

Hi,

I've made a gallery with images.
I added an onItemClickListener to the gallery to capture click events on the gallery items and perform an action when an image/item is clicked. But now (off course) the standard gallery behaviour (click on an image and it goes to the center of the screen) doesn't work anymore.
The behaviour I want is to perform an action when I click on the central image and the standard behaviour when I click on an other one. How do I do this?
Johan
Freshman
Freshman
 
Posts: 7
Joined: Fri Feb 20, 2009 3:30 pm
Top
Top
PreviousNext
Post a reply

Return to Novice Tutorials

Who is online

Users browsing this forum: No registered users and 4 guests

Board index The team • Delete all board cookies • All times are UTC + 1 hour