【超详细】开源JZVideo饺子播放器播放器配置使用以及其自定义

文章目录

特点
配置
- 添加依赖
- 添加布局
- 添加逻辑
- 修改AndroidManifest.xml
- 小问题
- 展示图
自定义
- 自定义UI
- 编写自定义类
- 重新应用控件
- 应用
- 总结
参考链接

继续找播放器，找到了饺子播放器， JZVideo，据说它可以高度自定义，而且还可以结合ijkplayer的内核之类的。
这好像是之前的项目点击这里，已经10.2k star了，现在的项目在这里，最新版本应该是7.4.x了，但是新版本的源码不太好自定义，主要是我看的教程时6.4.2的，所以就换了。

特点

可以完全自定义UI和任何功能。
很容易切换播放引擎，支持的视频格式和协议取决于播放引擎，android.media.MediaPlayer或者ijkplayer等。
可以检测列表的滑动。
可以嵌入到多个控件中，比如ListView、Fragment，RecyclerView等等，多重嵌套也可以。
可以实现全屏播放和小窗播放。
可以在加载、暂停和播放等状态下切换全屏和退出全屏。
可以进行屏幕适配，铺满全屏或者全屏裁剪。
好像还支持重力感应自动横屏。
全屏后可以用手势修改进度和音量。
Home键退出界面暂停播放，返回界面的时候继续播放。
等等etc，应该还可以有很多很多，等待开发。

配置

下面配置一下，引入JZVideo到项目里。

添加依赖

在build.gradle中添加

dependencies {implementation fileTree(dir: 'libs', include: ['*.jar'])implementation 'com.android.support:appcompat-v7:26.1.0'implementation 'com.android.support.constraint:constraint-layout:1.1.3'testImplementation 'junit:junit:4.12'androidTestImplementation 'com.android.support.test:runner:1.0.2'androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'androidTestCompile('com.android.support:support-annotations:26.1.0') {force = true}......//饺子播放器compile 'cn.jzvd:jiaozivideoplayer:6.2.12'
}

好象这样也行implementation ‘cn.jzvd:jiaozivideoplayer:7.0.3’

添加布局

在layout文件中添加控件，外层最好添加一个Layout。

<LinearLayoutandroid:layout_width="400dp"android:layout_height="200dp"><cn.jzvd.JZVideoPlayerStandardandroid:id="@+id/video_view"android:layout_width="match_parent"android:layout_height="match_parent"></cn.jzvd.JZVideoPlayerStandard></LinearLayout>

添加逻辑

修改java代码，设置视频地址和缩略图等，缩略图可以用Glide传入，还需要重写一下声明周期方法里的东西。

JZVideoPlayerStandard VideoPlayer=findViewById(R.id.video_view);VideoPlayer.setUp("http://jzvd.nathen.cn/c6e3dc12a1154626b3476d9bf3bd7266/6b56c5f0dc31428083757a45764763b0-5287d2089db37e62345123a1be272f8b.mp4",JZVideoPlayerStandard.SCREEN_WINDOW_NORMAL,"饺子闭眼睛");JZVideoPlayer.SAVE_PROGRESS = false;try {VideoPlayer.thumbImageView.setImageResource(R.drawable.diamond);}catch(Exception e){e.printStackTrace();}@Overridepublic void onBackPressed() {if (JZVideoPlayer.backPress()) {return;}super.onBackPressed();}@Overrideprotected void onPause() {super.onPause();JZVideoPlayer.releaseAllVideos();}

修改AndroidManifest.xml

添加一下属性

<activity android:name=".VideoActivity"android:configChanges="orientation|keyboardHidden|screenSize">

这样子最基本的就搞定了，然后开始自定义。

小问题

因为我的软件是横屏的，在视频退出全屏后，会暂停，而且回到竖屏。

展示图

自定义

这里需要用到上面说的到的6.4.2版本源码，没有的话问题不大，我把代码放出来。

自定义UI

编写一个新的layout布局文件，作为我们自定义的控件，叫custon_videoview.xml，将JZVideo-6.4.2\jiaozivideoplayer\src\main\res\layout中的jz_layout_std.xml代码全部复制进来。
然后可以按照这个内容和布局，自己添加新的控件。

filename: custon_videoview.xml<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@android:color/black"android:descendantFocusability="afterDescendants"><FrameLayoutandroid:id="@+id/surface_container"android:layout_width="match_parent"android:layout_height="match_parent"></FrameLayout><ImageViewandroid:id="@+id/thumb"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_alignParentStart="true"android:layout_alignParentLeft="true"android:layout_alignParentBottom="true"android:background="#000000"android:scaleType="fitCenter" /><LinearLayoutandroid:id="@+id/layout_bottom"android:layout_width="match_parent"android:layout_height="50dp"android:layout_alignParentBottom="true"android:background="@drawable/jz_bottom_bg"android:gravity="center_vertical"android:orientation="horizontal"android:visibility="invisible"><TextViewandroid:id="@+id/current"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="14dp"android:text="00:00"android:textColor="#ffffff" /><SeekBarandroid:id="@+id/bottom_seek_progress"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:layout_weight="1.0"android:background="@null"android:max="100"android:maxHeight="1dp"android:minHeight="1dp"android:paddingLeft="12dp"android:paddingTop="8dp"android:paddingRight="12dp"android:paddingBottom="8dp"android:progressDrawable="@drawable/jz_bottom_seek_progress"android:thumb="@drawable/jz_bottom_seek_thumb" /><TextViewandroid:id="@+id/total"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="00:00"android:textColor="#ffffff" /><TextViewandroid:id="@+id/clarity"android:layout_width="wrap_content"android:layout_height="wrap_content"android:clickable="true"android:paddingLeft="20dp"android:text="clarity"android:textAlignment="center"android:textColor="#ffffff" /><ImageViewandroid:id="@+id/fullscreen"android:layout_width="52.5dp"android:layout_height="fill_parent"android:paddingLeft="14dp"android:paddingRight="14dp"android:scaleType="centerInside"android:src="@drawable/jz_enlarge" /></LinearLayout><ProgressBarandroid:id="@+id/bottom_progress"style="?android:attr/progressBarStyleHorizontal"android:layout_width="match_parent"android:layout_height="1.5dp"android:layout_alignParentBottom="true"android:max="100"android:progressDrawable="@drawable/jz_bottom_progress" /><ImageViewandroid:id="@+id/back_tiny"android:layout_width="24dp"android:layout_height="24dp"android:layout_marginLeft="6dp"android:layout_marginTop="6dp"android:background="@drawable/jz_click_back_tiny_selector"android:visibility="gone" /><RelativeLayoutandroid:id="@+id/layout_top"android:layout_width="match_parent"android:layout_height="48dp"android:layout_alignParentStart="true"android:layout_alignParentLeft="true"android:layout_alignParentTop="true"android:background="@drawable/jz_title_bg"android:paddingStart="10dp"android:paddingLeft="10dp"android:visibility="gone"><ImageViewandroid:id="@+id/back"android:layout_width="26dp"android:layout_height="26dp"android:layout_alignParentStart="true"android:layout_alignParentLeft="true"android:layout_alignParentTop="true"android:layout_marginTop="12dp"android:padding="3dp"android:scaleType="centerInside"android:src="@drawable/jz_click_back_selector" /><TextViewandroid:id="@+id/title"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerVertical="true"android:layout_marginEnd="12dp"android:layout_marginRight="12dp"android:layout_toLeftOf="@+id/battery_time_layout"android:layout_toEndOf="@+id/back"android:layout_toRightOf="@+id/back"android:ellipsize="end"android:maxLines="2"android:textColor="#ffffff"android:textSize="18sp" /><LinearLayoutandroid:id="@+id/battery_time_layout"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentEnd="true"android:layout_alignParentRight="true"android:layout_centerVertical="true"android:layout_marginEnd="14dp"android:layout_marginRight="14dp"android:gravity="center_vertical"android:orientation="vertical"android:visibility="invisible"><ImageViewandroid:id="@+id/battery_level"android:layout_width="23dp"android:layout_height="10dp"android:layout_gravity="center_horizontal"android:background="@drawable/jz_battery_level_10" /><TextViewandroid:id="@+id/video_current_time"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal"android:gravity="center_vertical"android:maxLines="1"android:textColor="#ffffffff"android:textSize="12.0sp" /></LinearLayout></RelativeLayout><ProgressBarandroid:id="@+id/loading"android:layout_width="@dimen/jz_start_button_w_h_normal"android:layout_height="@dimen/jz_start_button_w_h_normal"android:layout_centerHorizontal="true"android:layout_centerVertical="true"android:indeterminateDrawable="@drawable/jz_loading"android:visibility="invisible" /><LinearLayoutandroid:id="@+id/start_layout"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerHorizontal="true"android:layout_centerVertical="true"android:layout_gravity="center_vertical"><ImageViewandroid:id="@+id/start"android:layout_width="@dimen/jz_start_button_w_h_normal"android:layout_height="@dimen/jz_start_button_w_h_normal"android:src="@drawable/jz_click_play_selector" /></LinearLayout><TextViewandroid:id="@+id/replay_text"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@+id/start_layout"android:layout_centerHorizontal="true"android:layout_marginTop="6dp"android:text="@string/replay"android:textColor="#ffffff"android:textSize="12sp"android:visibility="invisible" /><LinearLayoutandroid:id="@+id/retry_layout"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerHorizontal="true"android:layout_centerVertical="true"android:gravity="center_horizontal"android:orientation="vertical"android:visibility="invisible"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="@string/video_loading_failed"android:textColor="@android:color/white"android:textSize="14sp" /><TextViewandroid:id="@+id/retry_btn"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginTop="15dp"android:background="@drawable/retry_bg"android:paddingLeft="9dp"android:paddingTop="4dp"android:paddingRight="9dp"android:paddingBottom="4dp"android:text="@string/click_to_restart"android:textColor="@android:color/white"android:textSize="14sp" /></LinearLayout>
</RelativeLayout>

然后把value/strings.xml中的一些字符串内容复制到我们的项目里。

编写自定义类

需要重新写一个类，叫CustomJZVideo，必须继承自JzvdStd，但是在我的项目里他是JZVideoPlayerStandard，问题不大。
在这个文件里，通过getLayoutId()方法传入我们刚才写好的布局文件，获取控件，对控件的点击事件进行监听。
代码如下，里面用到的一些方法都有写注释他是干嘛的，这几个挺有用的感觉。
注意了，这里的构造方法一定要把两个多态都写上，我开始为了偷懒只写了一个，然后就报错了

package com.example.k.bilibiliapi.video;import android.content.Context;
import android.content.pm.ActivityInfo;
import android.util.AttributeSet;
import android.view.View;
import android.widget.Toast;import com.example.k.bilibiliapi.MyApplication;
import com.example.k.bilibiliapi.R;import cn.jzvd.JZVideoPlayer;
import cn.jzvd.JZVideoPlayerStandard;/*** Created by kang on 2020/8/12.*/public class CustomJZVideo extends JZVideoPlayerStandard {Context context;public CustomJZVideo(Context context) {super(context);this.context=context;}public CustomJZVideo(Context context, AttributeSet attrs) {super(context, attrs);this.context = context;}@Overridepublic int getLayoutId() {return R.layout.custom_videoview;}@Overridepublic void init(Context context) {super.init(context);//获取自定义控件}@Overridepublic void onClick(View v) {super.onClick(v);//控件的单击事件}@Overridepublic void setUp(Object[] dataSourceObjects, int defaultUrlMapIndex, int screen, Object... objects) {super.setUp(dataSourceObjects, defaultUrlMapIndex, screen, objects);//设置播放时屏幕状态JZVideoPlayer.FULLSCREEN_ORIENTATION = ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE;JZVideoPlayer.NORMAL_ORIENTATION = ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE;}@Overridepublic void onAutoCompletion() {super.onAutoCompletion();//并播放完后这里切换下一个视频的url}@Overridepublic void startWindowFullscreen() {super.startWindowFullscreen();//进入全屏时的状态Toast.makeText(MyApplication.getContext(),"进入全屏",Toast.LENGTH_SHORT).show();}@Overridepublic void playOnThisJzvd() {super.playOnThisJzvd();//退出全屏时的状态Toast.makeText(MyApplication.getContext(),"退出全屏",Toast.LENGTH_SHORT).show();}
}

重新应用控件

在布局文件中，将原有的cn.jzvd.JZVideoPlayerStandard换成com.example.xxx.video.CustomJZVideo，可以在类中也修改一下，将JZVideoPlayerStandard或者JZVideoPlayer全部换成CustomJZVideo，毕竟是继承嘛。

应用

然后应用一下，现在全屏和退出全屏的时候回有Toast提示消息，而且退出全屏后，仍然是横屏，因为我们重写的方法里设置了播放状态一直是横屏。

总结

至此自定义完成了。
在我找了好几个开源项目，n多博客以后，终于找到一个可以比较好比较完美的可以自定义的播放器控件了。

参考链接

Android 使用超简单的多媒体播放器JiaoZiVideoPlayer - 程思扬
Android饺子播放器自定义 - 孙先森i