Creating Image Gallery using Drawable images in res folder

Question

I am new to android. I have a requirement now. I need to add around 10 images in the res/drawable folder and on running the app i should display this images on a listView.and on selecting any of the image i should display this image in the new activity should be able to zoom in and zoom out. Please help me out to figure out this with the sample code.

Thanks in advance.

Answer 1

this example for create Gallery, select one and set to selectedImageView. so after that you can do everything with selectedImageView.

  public class MyActivity extends Activity{

    private int selectedImagePosition = 0;
    private ImageView selectedImageView;
    private List<Drawable> drawables;
    private Gallery gallery;    


    @Override
    public void onCreate(Bundle savedInstanceState) {
      selectedImageView = (ImageView) view.findViewById(R.id.selected_imageview);
      getDrawablesList();

      gallery = (Gallery) view.findViewById(R.id.Gallery);
      gallery.setAdapter(new ImageAdapter(getActivity().getApplicationContext()));

      gallery.setOnItemClickListener(new OnItemClickListener() {
    public void onItemClick(AdapterView<?> parent, View v, final int position, long id) {

        setSelectedImage(selectedImagePosition);

    }
    });



     private void getDrawablesList() {
            drawables = new ArrayList<Drawable>();
            drawables.add(getResources().getDrawable(R.drawable.res1));
            drawables.add(getResources().getDrawable(R.drawable.res2));
            drawables.add(getResources().getDrawable(R.drawable.res3));
            drawables.add(getResources().getDrawable(R.drawable.res4));
        }

    private void setSelectedImage(int selectedImagePosition) {

            BitmapDrawable bd = (BitmapDrawable) drawables.get(selectedImagePosition);
            Bitmap b = Bitmap.createScaledBitmap(bd.getBitmap(), (int) (bd.getIntrinsicHeight() * 0.9), (int) (bd.getIntrinsicWidth() * 0.7), false);
            selectedImageView.setImageBitmap(b);
            selectedImageView.setScaleType(ScaleType.FIT_XY);

        }

Answer 2

You can use a GalleryView

Refer to the link below for more help:

http://mobiforge.com/designing/story/understanding-user-interface-android-part-3-more-views

Answer 3

    private ImageView selectedImageView;
    private TextView _nameTextView;
    private Gallery gallery;
    Integer[] imageIDs = { R.drawable.hbath, R.drawable.hfood,
        R.drawable.hmedicine, R.drawable.htherapy, R.drawable.htoilet,
        R.drawable.hother };

@Override
    public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            selectedImageView = (ImageView) findViewById(R.id.imageSwitcher1);
            _nameTextView = (TextView) findViewById(R.id.NameTextView);
            gallery = (Gallery) findViewById(R.id.gallery1);
            gallery.setAdapter(new ImageAdapter(this));
            gallery.setOnItemClickListener(new OnItemClickListener() {
            gallery.setOnItemSelectedListener(new OnItemSelectedListener() {

        public void onItemSelected(AdapterView<?> arg0, View arg1,
                int position, long arg3) {
            // TODO Auto-generated method stub

            if (position == 0) {
                selectedImageView
                        .setImageResource(R.drawable.hbathbackground);
                _nameTextView.setText("Toilet");
            } else if (position == 1) {
                selectedImageView
                        .setImageResource(R.drawable.hfoodbackground);
                _nameTextView.setText("Food");
            } else if (position == 2) {
                selectedImageView
                        .setImageResource(R.drawable.hmedicinebackground);
                _nameTextView.setText("Medicine");
            } else if (position == 3) {
                selectedImageView
                        .setImageResource(R.drawable.htherapybackground);
                _nameTextView.setText("Therapy");
            } else if (position == 4) {
                selectedImageView
                        .setImageResource(R.drawable.htoiletbackground);
                _nameTextView.setText("Bath");
            } else if (position == 5) {
                selectedImageView
                        .setImageResource(R.drawable.hotherbackground);
                _nameTextView.setText("Other");
            }

        }

        public void onNothingSelected(AdapterView<?> arg0) {
            // TODO Auto-generated method stub

        }
    });
}

and ImageAdapter

    public class ImageAdapter extends BaseAdapter {
    private Context context;
    private int itemBackground;

    public ImageAdapter(Context c) {
        context = c;
        // ---setting the style---
        TypedArray a = obtainStyledAttributes(R.styleable.Gallery1);
        itemBackground = a.getResourceId(
                R.styleable.Gallery1_android_galleryItemBackground, 0);
        a.recycle();
    }

    // ---returns the number of images---
    public int getCount() {
        return imageIDs.length;
    }

    // ---returns the ID of an item---
    public Object getItem(int position) {
        return position;
    }

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

    // ---returns an ImageView view---
    public View getView(int position, View convertView, ViewGroup parent) {
        ImageView imageView = new ImageView(context);
        imageView.setImageResource(imageIDs[position]);
        imageView.setBackgroundColor(0xFF000000);
        // imgView.setImageBitmap(bitmap);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        imageView.setLayoutParams(new Gallery.LayoutParams(155, 235));
        imageView.setBackgroundResource(R.drawable.customborder2);
        return imageView;
    }
}