Automatically playing videos in a RecyclerView like Instagram does

Question

I want to be able to play and pause videos by scrolling recycler view like instagram. I already saw a lot of questions at stackoverflow about this theme but i don't know how to implement the solutions on my code. So I have a Recycler Adapter where I can get all of the user info from firebase and display it on my app.

public class FeedRecyclerAdapter extends RecyclerView.Adapter<FeedRecyclerAdapter.ViewHolder> {

private List<Feed>feedList;
private FirebaseFirestore firebaseFirestore;
public Context context;

private FirebaseAuth firebaseAuth;

public FeedRecyclerAdapter(List<Feed> feedList){
    this.feedList = feedList;

}



@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

    View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.feed_row, parent, false);
    context = parent.getContext();
    firebaseFirestore = FirebaseFirestore.getInstance();
    firebaseAuth = FirebaseAuth.getInstance();
    return new ViewHolder(view);
}

@Override
public void onBindViewHolder(final ViewHolder holder, int position) {

    holder.setIsRecyclable(false);

    final String feedPostId = feedList.get(position).FeedPostId;
    final String currentUserId = firebaseAuth.getCurrentUser().getUid();

    String desc_data = feedList.get(position).getDesc();
    holder.setDesc(desc_data);

    String video_url = feedList.get(position).getVideo_url();
    holder.setFeedVideo(video_url);








}

@Override
public int getItemCount() {
    return feedList.size();
}

public  class ViewHolder extends RecyclerView.ViewHolder{

    private TextView desc;
    private View mView;
    private VideoView videoView;
    private TextView username;





    public ViewHolder(View itemView) {
        super(itemView);
        mView=itemView;


    }
    public void setDesc(String descText){
        desc = mView.findViewById(R.id.post_desc);
        desc.setText(descText);
    }
    public void setFeedVideo(final String downloadUri){
        videoView = mView.findViewById(R.id.postVideo);
        videoView.setVideoPath(downloadUri);
        videoView.setOnPreparedListener(new MediaPlayer.OnPreparedListener() {
            @Override
            public void onPrepared(MediaPlayer mediaPlayer) {
                mediaPlayer.setLooping(true);

            }
        });
        videoView.start();

}



}

I have a library to address this use case, you can try it here: https://ene.im/2017/07/09/toro-101-how-to-1/ — Nguyễn Hoài Nam, Jan 11 '19 at 01:14

score 0 · Answer 1 · answered Sep 07 '18 at 08:03

First set your RecyclerView with this ShapeHelper like below

SnapHelper snapHelper = new PagerSnapHelper(); snapHelper.attachToRecyclerView(recyclerView);

Then Get RecyclerView visible Position with the help of LayoutManager like below

GridLayoutManager layoutManager = ((GridLayoutManager)mRecyclerView.getLayoutManager());
int firstVisiblePosition = layoutManager.findFirstVisibleItemPosition();

Change LayoutManger with your lyaout manager here i use GridLayoutManager.

For more reference here is link

Could you explain the second part of your solution on how we can use the firstVisiblePosition to Play the video when visible and pause when not visible? It would be of great help. — Arjun, Jul 24 '19 at 12:58

Automatically playing videos in a RecyclerView like Instagram does

1 Answers1