How to stop playing video on view pager swipe in android?

Question

I am using View Pager showing image and video, I am able to show image and video properly but I have problem, when I swipe for video, then video is playing, but I swipe next or previous then video is still playing on just next or previous screen but when I move two slide next or previous then video is being stop, but why not on next or previous slide.

I search it more but I did not get any solution, any help will be appreciable. Thanks in advance.

Here is my adapter code:

public class SelectedMediaViewPagerAdapter extends PagerAdapter {
private final Context context;
private final LayoutInflater layoutInflater;
public ArrayList<MediaItem> mediaItems;
PlayerView playerView;
SimpleExoPlayer player;

public String path = "";

public SelectedMediaViewPagerAdapter(Context context, ArrayList<MediaItem> mediaItems) {

    this.mediaItems = mediaItems;
    this.context = context;
    layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    DefaultTrackSelector trackSelector = new DefaultTrackSelector();
    player = ExoPlayerFactory.newSimpleInstance(context, trackSelector);

}

@Override
public int getCount() {
    return mediaItems.size();
}

@Override
public boolean isViewFromObject(View view, Object object) {
    return (view == object);
}

@Override
public Object instantiateItem(final ViewGroup container, int position) {
    RelativeLayout layout = (RelativeLayout) layoutInflater.inflate(R.layout.item_selected_media_view_pager, container, false);
    RelativeLayout vidView= layout.findViewById(R.id.vidView);
    ImageView imgView = layout.findViewById(R.id.imgView);
    if (mediaItems.get(position).isVideo()) {
        imgView.setVisibility(View.GONE);
        vidView.setVisibility(View.VISIBLE);
        String video_url;
        playerView = layout.findViewById(R.id.player_view);
        final ProgressBar progressBar = layout.findViewById(R.id.progresbar_video_play);
        progressBar.setVisibility(View.VISIBLE);

        playerView.setPlayer(player);

        DataSource.Factory dataSourceFactory = new DefaultDataSourceFactory(context,
                Util.getUserAgent(context, context.getResources().getString(R.string.app_name)));
        // This is the MediaSource representing the media to be played.
        MediaSource videoSource = new ExtractorMediaSource.Factory(dataSourceFactory)
                .createMediaSource(Uri.parse(mediaItems.get(position).getPath()));
        // Prepare the player with the source.
        player.prepare(videoSource);
        player.setPlayWhenReady(false);
        player.addListener(new Player.DefaultEventListener() {
            @Override
            public void onPlayerStateChanged(boolean playWhenReady, int playbackState) {
                if (playWhenReady) {
                    progressBar.setVisibility(View.GONE);
                }
                super.onPlayerStateChanged(playWhenReady, playbackState);
            }
        });
    }else {
        // path = drawable.get(drawable.size() - position - 1);
        imgView.setVisibility(View.VISIBLE);
        vidView.setVisibility(View.GONE);
        Glide.with(context).load("file://" + mediaItems.get(position).getPath()).into(imgView);
    }
    container.addView(layout);
    return layout;
}



@Override
public void destroyItem(ViewGroup container, int position, Object object) {
    container.removeView((RelativeLayout) object);
}

}

Answer 1

This is happening because ViewPager keeps a number of fragments "alive" (in Resumed State) before and after the current item. The default is 1 on each side. The property that determines this is ViewPager.offScreenPageLimit. This is done to facilitate the nice sliding in of the next/previous view as you swipe.

You could use something like below to determine when the page changes. Then you would need to notify a viewModel or service that each of your paged fragments have access to so they can determine whether they should pause or continue playing their media:

viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener {
    @Override
    public void onPageSelected(int position) {
       // find your player and pause it if it's not in the current view
       // Ideally you notify a viewModel that is shared between your paged
       // fragments here and let each one determine if it needs to pause 
       // its player.
    }
    @Override
    public void onPageScrollStateChanged(int state) { // do nothing }

    @Override
    public void onPageScrolled(int position, float offset, int offsetInPixels) { // do nothing }
})

Answer 2

The idea is to keep reference to the current selected page in viewpager and stop the previous viewHolder's player before saving the new position. Here is how: In your fragment:

private var currentPage = 0

private val onPageScrolledListener = object : ViewPager2.OnPageChangeCallback() {
    override fun onPageSelected(position: Int) {
        super.onPageSelected(position)
        getViewHolder(currentPage)?.stopVideo()
        currentPage = position
    }
}

before saving the new position i find the previous Holder and call stop on it.

Here is getViewHolder() method

    fun getViewHolder(position: Int): VideoViewHolder =
    (binding.pager.getChildAt(0) as? RecyclerView)?.let {
        it.findViewHolderForAdapterPosition(position)?.let { mediaViewHolder ->
            (mediaViewHolder as? MediaViewHolder.VideoViewHolder)
        }
    }

and inside your ViewHolder make this method

    fun stopVideo() {
        player?.stop()
    }

don't forget to register the listener in onViewCreated()

pager.registerOnPageChangeCallback(onPageScrolledListener)

and unregister it in onDestroy()

binding.pager.unregisterOnPageChangeCallback(onPageScrolledListener)