I’m trying to display an image and a text at a certain time of reproduction of an mp3, but when i start the player and want to show the image along with text for each image, the mp3 plays correctly from a URL, and text is displayed, but the images (found locally in the application) has a lag two seconds with respect to its rightful text, I am performing this task as follows;
public class WCourse extends Activity implements OnClickListener, OnTouchListener, OnCompletionListener, OnBufferingUpdateListener{
//mp3 player
private ImageButton buttonPlayPause;
private Button buttonTaketest;
private SeekBar seekBarProgress;
public EditText editTextSongURL;
public TextView subtitles;
//intent get the course title
public static TextView TextViewTopTitle;
//Slider
public int currentimageindex=0;
Timer timer;
TimerTask task;
ImageView slidingimage;
//images ids
private int[] IMAGE_IDS = {
R.drawable.c5_d1, R.drawable.c5_d2, R.drawable.c5_d3, R.drawable.c5_d4, R.drawable.c5_d5,
R.drawable.c5_d6, R.drawable.c5_d7, R.drawable.c5_d8, R.drawable.c5_d9, R.drawable.c5_d10,
R.drawable.c5_d11, R.drawable.c5_d12, R.drawable.c5_d13, R.drawable.c5_d14, R.drawable.c5_d15,
R.drawable.c5_d16, R.drawable.c5_d17, R.drawable.c5_d18, R.drawable.c5_d19, R.drawable.c5_d20,
R.drawable.c5_d21, R.drawable.c5_d22, R.drawable.c5_d23, R.drawable.c5_d24, R.drawable.c5_d25,
R.drawable.c5_d26, R.drawable.c5_d27, R.drawable.c5_d28, R.drawable.c5_d29, R.drawable.c5_d30,
R.drawable.c5_d31, R.drawable.c5_d32, R.drawable.c5_d33, R.drawable.c5_d34, R.drawable.c5_d35,
R.drawable.c5_d36, R.drawable.c5_d37, R.drawable.c5_d38, R.drawable.c5_d39, R.drawable.c5_d40,
R.drawable.c5_d41, R.drawable.c5_d42, R.drawable.c5_d43, R.drawable.c5_d44, R.drawable.c5_d45,
R.drawable.c5_d46
};
private MediaPlayer mediaPlayer;
private int mediaFileLengthInMilliseconds; // this value contains the song duration in milliseconds. Look at getDuration() method in MediaPlayer class
private final Handler handler = new Handler();
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.watch_course);
//intent
TextViewTopTitle = (TextView) findViewById(R.id.TextViewTopTitle);
Bundle bundle = getIntent().getExtras();
TextViewTopTitle.setText(bundle.getString("RESULT2")+" ");
getText(bundle.getString("RESULT2"));
subtitles = (TextView) findViewById(R.id.subs);
// handler of slider
final Handler mHandler = new Handler();
initView();
// Create runnable for posting
final Runnable mUpdateResults = new Runnable() {
public void run() {
AnimateandSlideShow();
}
};
Timer timer = new Timer();
timer.scheduleAtFixedRate(new TimerTask() {
public void run() {
mHandler.post(mUpdateResults);
}
}, 0, 500); }
// Helper method to start the animation on the splash screen
public void AnimateandSlideShow() {
//abc = mediaPlayer.getCurrentPosition();
slidingimage = (ImageView)findViewById(R.id.ImageView3_Left);
slidingimage.setImageResource(IMAGE_IDS[currentimageindex%IMAGE_IDS.length]);
int abc = mediaPlayer.getCurrentPosition();
if(abc > 0 && abc < 18000 ){
currentimageindex=0;
//slidingimage.getAnimation();
subtitles.setText(this.getString(R.string.t1));
}
if(abc >= 18001 && abc < 26000){
currentimageindex=1;
subtitles.setText(this.getString(R.string.t2));
}
if(abc >= 24000 && abc < 32000){
currentimageindex=2;
subtitles.setText(this.getString(R.string.t3));
}
if(abc >= 30000 && abc < 37000){
currentimageindex=3;
subtitles.setText(this.getString(R.string.t4));
}
if(abc >= 35000 && abc < 41000){
currentimageindex=4;
subtitles.setText(this.getString(R.string.t5));
}
if(abc >= 39000 && abc < 46000){
currentimageindex=5;
subtitles.setText(this.getString(R.string.t6));
}
if(abc >= 44000 && abc < 50000){
currentimageindex=6;
subtitles.setText(this.getString(R.string.t7));
}
}
private void initView() {
buttonTaketest = (Button)findViewById(R.id.taketest);
buttonTaketest.setOnClickListener(this);
buttonPlayPause = (ImageButton)findViewById(R.id.ButtonTestPlayPause);
buttonPlayPause.setOnClickListener(this);
seekBarProgress = (SeekBar)findViewById(R.id.SeekBarTestPlay);
seekBarProgress.setMax(99); // It means 100% .0-99
seekBarProgress.setOnTouchListener(this);
editTextSongURL = (EditText)findViewById(R.id.EditTextSongURL);
editTextSongURL.setText(R.string.c5);
mediaPlayer = new MediaPlayer();
mediaPlayer.setOnBufferingUpdateListener(this);
mediaPlayer.setOnCompletionListener(this);
}
/** Method which updates the SeekBar primary progress by current song playing position*/
private void primarySeekBarProgressUpdater() {
seekBarProgress.setProgress((int)(((float)mediaPlayer.getCurrentPosition()/mediaFileLengthInMilliseconds)*100)); // This math construction give a percentage of "was playing"/"song length"
if (mediaPlayer.isPlaying()) {
Runnable notification = new Runnable() {
public void run() {
primarySeekBarProgressUpdater();
}
};
handler.postDelayed(notification,1000);
}
}
public void onClick(View v) {
if(v.getId() == R.id.ButtonTestPlayPause){
//ImageButton onClick event handler. Method which start/pause mediaplayer playing
try {
mediaPlayer.setDataSource(editTextSongURL.getText().toString()); // setup song from http:// URL to mediaplayer data source
mediaPlayer.prepare(); // call this method after setup the datasource in setDataSource method. After calling prepare() the instance of MediaPlayer starts load data from URL to internal buffer.
/**slidingimage = (ImageView)findViewById(R.id.ImageView3_Left);
slidingimage.setImageResource(IMAGE_IDS[currentimageindex%IMAGE_IDS.length]); // setup song from http:// URL to mediaplayer data source
currentimageindex++;
slidingimage.getAnimation();*/
} catch (Exception e) {
e.printStackTrace();
}
mediaFileLengthInMilliseconds = mediaPlayer.getDuration(); // gets the song length in milliseconds from URL
if(!mediaPlayer.isPlaying()){
mediaPlayer.start();
buttonPlayPause.setImageResource(R.drawable.button_pause);
}
else {
mediaPlayer.pause();
buttonPlayPause.setImageResource(R.drawable.button_play);
//slidingimage.wait();
//button on pause
}
/**if(!slidingimage.isShown()){
slidingimage.getAnimation();
buttonPlayPause.setImageResource(R.drawable.button_pause); //button on playing
}else {
slidingimage.clearAnimation();
buttonPlayPause.setImageResource(R.drawable.button_play); //button on pause
}*/
primarySeekBarProgressUpdater();
}
if(v.getId() == R.id.taketest){
//Go to WebView
Intent i = new Intent("com.mariposatraining.courses.WebViewTest");
startActivity(i);
}
}
public boolean onTouch(View v, MotionEvent event) {
if(v.getId() == R.id.SeekBarTestPlay){
// Seekbar onTouch event handler. Method which seeks MediaPlayer to seekBar primary progress position
if(mediaPlayer.isPlaying()){
SeekBar sb = (SeekBar)v;
int playPositionInMillisecconds = (mediaFileLengthInMilliseconds / 100) * sb.getProgress();
mediaPlayer.seekTo(playPositionInMillisecconds);
}
}
return false;
}
public void onCompletion(MediaPlayer mp) {
// MediaPlayer onCompletion event handler. Method which calls then song playing is complete
buttonPlayPause.setImageResource(R.drawable.button_play);
}
public void onBufferingUpdate(MediaPlayer mp, int percent) {
// Method which updates the SeekBar secondary progress by current song loading from URL position
seekBarProgress.setSecondaryProgress(percent);
}
//get Course Text
private void getText(String string) {
Button backButton = (Button)this.findViewById(R.id.back2);
backButton.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
finish();
}
});
}
@Override
protected void onStop()
{
super.onStop();
mediaPlayer.stop();
currentimageindex=0;
finish();
}}
which actually try to compensate for the times shown to display images, but does not work! any idea to solve the problem of time lag of two seconds?
ok, i solved this, with this code, maybe is not perfect, but is a solution for my app:
Very simple yep..
Hope this help others…