Question

I currently have implemented an ImageSwitcher in my app, which slides through an array of pictures. Now I want to have a ProgressBar under the picture which shows on which position we are in the collection so the user gets a feeling of how much pictures are left.

Is this possible? Can I have some advices on how I might implement this?

Picture:

progress
[–|——–]

My ImageSwticher:

package com.example.cfaslides;

import android.app.Activity;
 import android.os.Bundle;
 import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.ViewSwitcher.ViewFactory;
import android.util.Log;
import android.view.MotionEvent;
import android.widget.ProgressBar;
import android.widget.ViewSwitcher;
import android.widget.Gallery;
import android.widget.Gallery.LayoutParams;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.view.Window;
import android.content.Context;


public class l2_AltInvestActivity extends Activity implements ViewFactory {


ImageSwitcher imageSwitcher;

Integer[] imageList = {
R.drawable.av_01,
R.drawable.av_02,
R.drawable.av_03,
R.drawable.av_04,
R.drawable.av_05
};

int curIndex=0;
int maxIndex = 4; //# imageList -1
int downX, upX;

private Animation mIn1, mOut1, mIn2, mOut2;

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.slider);
    final ProgressBar mProgressBar = (ProgressBar) findViewById(R.id.progressB);

mProgressBar.setProgress(0);
    mProgressBar.setMax(maxIndex);
    mProgressBar.setVisibility(View.VISIBLE);

     mIn1 =   AnimationUtils.loadAnimation(l2_AltInvestActivity.this,android.R.anim.slide_in_left);
     mOut1 = AnimationUtils.loadAnimation(l2_AltInvestActivity.this,android.R.anim.slide_out_right);
     mIn2 = AnimationUtils.loadAnimation(l2_AltInvestActivity.this,R.anim.slide_in_right);
     mOut2 = AnimationUtils.loadAnimation(l2_AltInvestActivity.this,R.anim.slide_out_left);

     AnimationListener mAnimListener = new AnimationListener() {
         public void onAnimationEnd(Animation animation) {
                // the in animation has ended so update the ProgressBar with the new 
                // progress
                mProgressBar.setProgress(curIndex); // I don't know your progress?!? 
            }   
         @Override
          public void onAnimationStart(Animation animation) {
           // TODO Auto-generated method stub

          }

          @Override
          public void onAnimationRepeat(Animation animation) {
           // TODO Auto-generated method stub

          }
             // rest of the callbacks
     };  
     //set this listener for the both of the in animations 
     mIn1.setAnimationListener(mAnimListener);  
     mIn2.setAnimationListener(mAnimListener);
     // rest of the onCreate method


    imageSwitcher = (ImageSwitcher) findViewById(R.id.switcher);
    imageSwitcher.setFactory(this);
    imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,android.R.anim.fade_in));
    imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this,android.R.anim.fade_out));
    imageSwitcher.setImageResource(imageList[curIndex]);
    imageSwitcher.setOnTouchListener(new OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            if (event.getAction() == MotionEvent.ACTION_DOWN) {
                downX = (int) event.getX();
                Log.i("event.getX()", " downX " + downX);
                return true;
            }
            else if (event.getAction() == MotionEvent.ACTION_UP) {
                upX = (int) event.getX();
                Log.i("event.getX()", " upX " + downX); 

                if (upX - downX > 100) {
                    imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(l2_AltInvestActivity.this,android.R.anim.slide_in_left));
                    imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(l2_AltInvestActivity.this,android.R.anim.slide_out_right));
                    //curIndex  current image index in array viewed by user
                    curIndex--;
                    if (curIndex < 0) {
                        curIndex = maxIndex; //maximum
                    }

                    //imageList :-image list array
                    imageSwitcher.setImageResource(imageList[curIndex]);
                    //GalleryActivity.this.setTitle(curIndex);
                }
                else if (downX -upX > -100) {
                    curIndex++;
                    if (curIndex > maxIndex) {
                        curIndex = 0;
                    }
                    imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(l2_AltInvestActivity.this,R.anim.slide_in_right));
                    imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(l2_AltInvestActivity.this,R.anim.slide_out_left));
                    imageSwitcher.setImageResource(imageList[curIndex]);
                    //GalleryActivity.this.setTitle(curIndex);
                }
            return true;
            }
        return false;
        }
    });
} //END onCreate

@Override
public View makeView() {
    ImageView i = new ImageView(this);
    i.setScaleType(ImageView.ScaleType.FIT_CENTER);
    i.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));
    i.setBackgroundColor(0xFF000000);
    return i;   
} //END makeView

} // END Class

Slider:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="@+id/widget32"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ProgressBar
    android:id="@+id/progressB"
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

<ImageSwitcher android:id="@+id/switcher"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
>

</ImageSwitcher>


</RelativeLayout>

Answer 1

now i like to have an progress bar under the picture which shows on
which position we are in the collection. so that someone gets a
feeling how much pictures are left.

1. Place a ProgressBar in your R.layout.slider layout file

2. Make the four different Animations that you used for the ImageSwitcher‘s transitions as fields in your Activity and also set an AnimationListener for each of them:

   //...
   private Animation mIn1, mOut1, mIn2, mOut2;
   
   @Override
   public void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.slider);
       final ProgressBar = (ProgressBar) findViewById(R.id.theIdOfTheProgressBar);
       mIn1 =   AnimationUtils.loadAnimation(l2_AltInvestActivity.this,android.R.anim.slide_in_left);
       mOut1 = AnimationUtils.loadAnimation(l2_AltInvestActivity.this,android.R.anim.slide_out_right);
       mIn2 = AnimationUtils.loadAnimation(l2_AltInvestActivity.this,R.anim.slide_in_right);
       mOut2 = AnimationUtils.loadAnimation(l2_AltInvestActivity.this,R.anim.slide_out_left);
       AnimationListener mAnimListener = new AnimationListener() {
   
       public void onAnimationEnd(Animation animation) {
           // the in animation has ended so update the ProgressBar with the new 
           // progress
           mProgressBar.setProgress(curIndex); // I don't know your progress?!? 
       }   
        // rest of the callbacks
       });  
       //set this listener for the both of the in animations 
       mIn1.setAnimationListener(mAnimListener);  
       mIn2.setAnimationListener(mAnimListener);
       // rest of the onCreate method
   

3. In the onTouch method update the ImageSwitcher with the proper animations(from mIn1, mOut1, mIn2, mOut2)