前面几个类基本上没啥用，为了代码完整性才把它贴了出来，关键的类是MyLayoutManager ，把它替换我们平常用的LinearLayoutManager就可以了，播放器我随便用的，当然你也可以换成其它播放器。播放器不是重点。
MainActivity
package com.dongnao.dn_vip_ui_22_2;
import android.annotation.TargetApi;
import android.media.MediaPlayer;
import android.net.Uri;
import android.os.Build;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.OrientationHelper;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.VideoView;
public class MainActivity extends AppCompatActivity {
private RecyclerView mRecyclerView;
private MyLayoutManager myLayoutManager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initListener();
}
private void initView() {
mRecyclerView = findViewById(R.id.recycler);
myLayoutManager = new MyLayoutManager(this,OrientationHelper.VERTICAL,false);
mRecyclerView.setLayoutManager(myLayoutManager);
mRecyclerView.setAdapter(new MyAdapter());
// mRecyclerView.getChildAt(0);
}
private void initListener() {
myLayoutManager.setOnViewPagerListener(new OnViewPagerListener() {
@Override
public void onPageRelease(View itemView) {
releaseVideo(itemView);
}
@Override
public void onPageSelected(View itemView) {
playVideo(itemView);
}
});
}
class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder>{
private int[] imgs = {R.mipmap.img_video_1,R.mipmap.img_video_2,R.mipmap.img_video_1,R.mipmap.img_video_2,R.mipmap.img_video_1,R.mipmap.img_video_2};
private int[] videos = {R.raw.video_1,R.raw.video_2,R.raw.video_1,R.raw.video_2,R.raw.video_1,R.raw.video_2};
public MyAdapter(){
}
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_view_pager,parent,false);
return new ViewHolder(view);
}
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
holder.img_thumb.setImageResource(imgs[position]);
holder.videoView.setVideoURI(Uri.parse("android.resource://"+getPackageName()+"/"+ videos[position]));
}
@Override
public int getItemCount() {
return 6;
}
public class ViewHolder extends RecyclerView.ViewHolder{
ImageView img_thumb;
VideoView videoView;
ImageView img_play;
RelativeLayout rootView;
public ViewHolder(View itemView) {
super(itemView);
img_thumb = itemView.findViewById(R.id.img_thumb);
videoView = itemView.findViewById(R.id.video_view);
img_play = itemView.findViewById(R.id.img_play);
rootView = itemView.findViewById(R.id.root_view);
}
}
}
/**
* 停止播放
* @param itemView
*/
private void releaseVideo(View itemView){
final VideoView videoView = itemView.findViewById(R.id.video_view);
final ImageView imgThumb = itemView.findViewById(R.id.img_thumb);
final ImageView imgPlay = itemView.findViewById(R.id.img_play);
videoView.stopPlayback();
imgThumb.animate().alpha(1).start();
imgPlay.animate().alpha(0f).start();
}
/**
* 开始播放
* @param itemView
*/
@TargetApi(Build.VERSION_CODES.JELLY_BEAN_MR1)
private void playVideo(View itemView) {
final VideoView videoView = itemView.findViewById(R.id.video_view);
final ImageView imgPlay = itemView.findViewById(R.id.img_play);
final ImageView imgThumb = itemView.findViewById(R.id.img_thumb);
final RelativeLayout rootView = itemView.findViewById(R.id.root_view);
final MediaPlayer[] mediaPlayer = new MediaPlayer[1];
videoView.start();
videoView.setOnInfoListener(new MediaPlayer.OnInfoListener() {
@Override
public boolean onInfo(MediaPlayer mp, int what, int extra) {
mediaPlayer[0] = mp;
mp.setLooping(true);
imgThumb.animate().alpha(0).setDuration(200).start();
return false;
}
});
videoView.setOnPreparedListener(new MediaPlayer.OnPreparedListener() {
@Override
public void onPrepared(MediaPlayer mp) {
}
});
imgPlay.setOnClickListener(new View.OnClickListener() {
boolean isPlaying = true;
@Override
public void onClick(View v) {
if (videoView.isPlaying()){
imgPlay.animate().alpha(1f).start();
videoView.pause();
isPlaying = false;
}else {
imgPlay.animate().alpha(0f).start();
videoView.start();
isPlaying = true;
}
}
});
}
}
布局
package com.dongnao.dn_vip_ui_22_2;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.VideoView;
public class CustomVideoView extends VideoView {
public CustomVideoView(Context context) {
super(context);
}
public CustomVideoView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomVideoView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int width = getDefaultSize(0, widthMeasureSpec);
int height = getDefaultSize(0, heightMeasureSpec);
setMeasuredDimension(width, height);
}
}
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/root_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.dongnao.dn_vip_ui_22_2.CustomVideoView
android:id="@+id/video_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="false"
android:focusable="false"
/>
<ImageView
android:id="@+id/img_thumb"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:clickable="false"
android:focusable="false"
android:visibility="visible"
/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:gravity="center_horizontal"
>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentTop="true"
android:src="@mipmap/header_icon_2"
app:civ_border_color="@android:color/white"
app:civ_border_width="2dp" />
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:background="@drawable/circle_big_red"
android:src="@mipmap/add_icon"
android:tint="@android:color/white"
android:scaleType="centerInside"
android:layout_centerHorizontal="true"
android:layout_marginTop="40dp"
/>
</RelativeLayout>
<TextView
android:layout_width="50dp"
android:layout_height="50dp"
android:drawableTop="@mipmap/heart_icon"
android:layout_marginTop="16dp"
android:text="1.6w"
android:textColor="@android:color/white"
android:gravity="center"
/>
<TextView
android:layout_width="50dp"
android:layout_height="50dp"
android:drawableTop="@mipmap/msg_icon"
android:layout_marginTop="16dp"
android:text="1.6w"
android:textColor="@android:color/white"
android:gravity="center"
/>
<TextView
android:layout_width="50dp"
android:layout_height="50dp"
android:drawableTop="@mipmap/share_icon"
android:layout_marginTop="16dp"
android:text="1.6w"
android:textColor="@android:color/white"
android:gravity="center"
/>
</LinearLayout>
<ImageView
android:id="@+id/img_play"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@drawable/play_arrow"
android:clickable="true"
android:focusable="true"
android:alpha="0"
android:layout_centerInParent="true"
/>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="25dp"
android:orientation="horizontal"
android:layout_marginTop="56dp"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_centerHorizontal="true"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="推荐"
android:textColor="@android:color/white"
android:textSize="18sp"
android:textStyle="bold"
android:layout_marginRight="16dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="附近"
android:textColor="#f2f2f2"
android:textSize="17sp"
android:textStyle="bold"
/>
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/search_icon"
android:layout_alignParentRight="true"
android:tint="#f2f2f2"
android:layout_marginRight="16dp"
/>
</RelativeLayout>
<VideoView
android:id="@+id/line_bottom"
android:layout_width="match_parent"
android:layout_height="1px"
android:layout_above="@+id/bottom"
android:background="@android:color/white"
/>
<LinearLayout
android:id="@+id/bottom"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:layout_alignParentBottom="true"
android:orientation="horizontal"
android:gravity="center_vertical"
>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_weight="1"
android:textColor="@android:color/white"
android:text="首页"
android:textSize="18sp"
android:textStyle="bold"
/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:textColor="#f2f2f2"
android:text="关注"
android:textSize="17sp"
android:textStyle="bold"
/>
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="@mipmap/add_bg"
/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:textColor="#f2f2f2"
android:text="消息"
android:textSize="17sp"
android:textStyle="bold"
/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:textColor="#f2f2f2"
android:text="我"
android:textSize="17sp"
android:textStyle="bold"
/>
</LinearLayout>
</RelativeLayout>
关键的类来了
package com.dongnao.dn_vip_ui_22_2;
import android.content.Context;
import android.support.annotation.NonNull;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.PagerSnapHelper;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import android.view.View;
//控制RecyclerView是不是滑动的是LayoutManager
public class MyLayoutManager extends LinearLayoutManager implements RecyclerView.OnChildAttachStateChangeListener {
//根据这个参数来判断当前是上滑 还是下滑
private int mDrift;
//传进来的监听接口类
private OnViewPagerListener onViewPagerListener;
//解决吸顶或者洗低的对象
private PagerSnapHelper pagerSnapHelper;
public MyLayoutManager(Context context) {
super(context);
}
/**
*
* @param context
* @param orientation 布局方向
* @param reverseLayout 是从头到尾布局还是从尾到头布局
*/
public MyLayoutManager(Context context, int orientation, boolean reverseLayout) {
super(context, orientation, reverseLayout);
pagerSnapHelper = new PagerSnapHelper();//初始化PagerSnapHelper
}
/**
* 当MyLayoutManager完全放入到RecyclerView中的时候会被调用
* @param view
* 表示LayoutManager初始化完毕
*/
@Override
public void onAttachedToWindow(RecyclerView view) {
//这里的view就是当前的RecyclerView,可以在这里设置监听
view.addOnChildAttachStateChangeListener(this);
//与RecyclerView绑定
pagerSnapHelper.attachToRecyclerView(view);
super.onAttachedToWindow(view);
}
//监听RecyclerView的滑动，是上滑还是下滑，dy是滑动的距离，向上滑动是正数，向下滑动是负数
@Override
public int scrollVerticallyBy(int dy, RecyclerView.Recycler recycler, RecyclerView.State state) {
mDrift = dy;
return super.scrollVerticallyBy(dy, recycler, state);
}
@Override
public boolean canScrollVertically() {
return true;//返回true可以滑动，返回false不可以滑动
}
/**
* 将Item添加进来的时候 调用这个方法，RecyclerView.OnChildAttachStateChangeListener的方法，不要写在Activity中
* 因为该方法是在LinearLayoutManager初始化完毕的时候生效。
* @param view itemView
*/
@Override
public void onChildViewAttachedToWindow(@NonNull View view) {
if(mDrift >0){
//向上滑
if(onViewPagerListener !=null){
//如果是向上滑动的时候 就选中当前itemView下一个item
onViewPagerListener.onPageSelected(view);
}
}else{
//向下滑
if(onViewPagerListener !=null){
//如果是向上滑动的时候 就选中当前itemView下一个item
onViewPagerListener.onPageSelected(view);
}
}
}
/**
* 监听滑动的状态，解决松开不播放，滑动一点点就播放的bug
* @param state
*/
@Override
public void onScrollStateChanged(int state) {
switch (state){
case RecyclerView.SCROLL_STATE_IDLE://滑动停止
//现在拿到的就是当前显示的这个item
View snapView = pagerSnapHelper.findSnapView(this);//获取当前屏幕选中的ItemView
assert snapView != null;
if(onViewPagerListener !=null){
onViewPagerListener.onPageSelected(snapView);
}
break;
}
super.onScrollStateChanged(state);
}
/**
* 将Item移除出去的时候 调用这个方法
* @param view ItemView
*/
@Override
public void onChildViewDetachedFromWindow(@NonNull View view) {
Log.e("EEEEEEEEE","22222222222222222");
if(mDrift >=0){
//向上滑
if(onViewPagerListener !=null){
onViewPagerListener.onPageRelease(view);
}
}else{
//向下滑
if(onViewPagerListener !=null){
onViewPagerListener.onPageRelease(view);
}
}
}
public void setOnViewPagerListener(OnViewPagerListener onViewPagerListener) {
this.onViewPagerListener = onViewPagerListener;
}
}
package com.dongnao.dn_vip_ui_22_2;
import android.view.View;
public interface OnViewPagerListener {
//停止播放的监听方法
void onPageRelease(View itemView);
//播放的监听方法
void onPageSelected(View itemView);
}
运行效果
