Pause the changing Images when Audio paused

Question

I am building an application in which images starts changing when audio is played. When audio is play (starts) onclick button, the images also start changing with different delays and i can pause my audio as well. The problem which i am facing and getting confuse is that, when i paused my audio,

How can i pause my images as well ,so that when i click the button again,my audio resumes and images starts changing next from where they were paused.

private Button btn_play;
MediaPlayer mp;
int duration;
private ImageView imageView;
Handler handler = new Handler();

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.layout_names);
    int resID = getResources().getIdentifier("audio", "raw", getPackageName());
    mp = MediaPlayer.create(NamesOfALLAH.this, resID);
    duration = mp.getDuration();
    btn_play = (Button) findViewById(R.id.btn_play);
    imageView = (ImageView) findViewById(R.id.imageView_Names);
    btn_play.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if (mp.isPlaying()) {

                mp.pause();
                btn_play.setText("Play");

            } else {
                mp.start();
                btn_play.setText("Pause");
                changeImage1();
                changeImage2();
                changeImage3();
                changeImage4();
                changeImage5();


            }


        }
    });

}


public void changeImage1() {

    handler.postDelayed(new Runnable() {
        @Override
        public void run() {

            imageView.setImageResource(R.drawable.a1);

        }

    }, 6000);

}

public void changeImage2() {


    handler.postDelayed(new Runnable() {
        @Override
        public void run() {
            imageView.setImageResource(R.drawable.a2);


        }
    }, 8000);

}

public void changeImage3() {




         handler.postDelayed(new Runnable() {
             @Override
             public void run() {
                 imageView.setImageResource(R.drawable.a3);


             }
         }, 10000);
     }




public void changeImage4() {

    handler.postDelayed(new Runnable() {
        @Override
        public void run() {
            imageView.setImageResource(R.drawable.a4);


        }
    }, 11000);

}

public void changeImage5() {

    handler.postDelayed(new Runnable() {
        @Override
        public void run() {
            imageView.setImageResource(R.drawable.a5);


        }
    }, 12000);
}

`

score 0 · Answer 1 · edited May 23 '17 at 11:59

Use an ImageSwitcher, it does some of the work for you. In any case, if you want to create the animation yourself, you must consider all the changes as a whole. For example, you can repost the runnable to the handler. Pseudo-code:

handler.postDelayed(new Runnable() {
         @Override
         public void run() {
             // set the image you want
             if (mustContinue)
                  handler.postDelayed(this, time);
         }
     }, 10000);

Toggle the boolean mustContinue every time you press the play/pause button.

EDIT: Check this as an example.

Pause the changing Images when Audio paused

1 Answers1