autojs之小白带你一步一步定制播放器

效果展示

播放器功能

1. 截图
2. 倍速播放
3. 指定区域播放
4. 开始, 停止, 暂停
5. 播放电视cctv-1 cctv6
6. 播放网络视频
7. 播放本地视频

原理

atuojs调用七牛云直播sdk, 快速制作自己的播放器

七牛直播云官方文档

https://developer.qiniu.com/pili/1210/the-android-client-sdk\

PLDroidPlayer简介

PLDroidPlayer 是一个适用于 Android 平台的音视频播放器 SDK，可高度定制化和二次开发，为 Android 开发者提供了简单、快捷的接口，帮助开发者在 Android 平台上快速开发播放器应用。

步骤

1. 界面

   "ui";
   ui.layout(<vertical></vertical>);
   

2. 查看七牛云官方文档, 看看他们的sdk有什么功能

   1. 主流架构支持, 包括 arm64-v8a, armeabi-v7a 与 x86
   2. 后台播放, 退到后台只播放音频
   3. IP 地址播放, URL 格式：protocol://ip/path?domain=xxxx.com
   4. 设置播放封面, 在播放开始前显示封面 view
   5. …
   6. 以上这些都不是核心功能

3. 核心功能

   1. 播放视频
   2. 播放按钮
   3. 停止按钮
   4. 暂停按钮
   5. 倍速按钮
   6. 截图
   7. 暂时先实现以上功能, 其他功能可参考文档自行添加

4. 修改ui

   文档中对PLMediaPlayer的介绍

   PLDroidPlayer SDK 提供的 PLMediaPlayer 实现了一个媒体播放器的各种基础功能和接口，与 Android 官方的 MediaPlayer 的设计基本保持一致。

   PLMediaPlayer 不是一个 View 控件，因此，如果希望用它播放视频而不是纯音频的话，则需要在布局文件中自己定义一个 SurfaceView 或者 TextureView 控件，然后将 Surface 或者 SurfaceHolder 传递给 PLMediaPlayer

   所以我们要添加一个surfaceView, 以及几个控制按钮

   ui.layout(
     <vertical gravity="center">
       <vertical bg="#000000">
         <horizontal>
           <button id="start">start</button>
           <button id="stop">stop</button>
           <button id="pause">pause</button>
         </horizontal>
         <horizontal>
           <button id="slower">slower</button>
           <button id="normal">normal</button>
           <button id="faster">faster</button>
         </horizontal>
         <horizontal>
           <button id="captureImage">captureImage</button>
         </horizontal>
         <text
           text="作者: 牙叔"
           margin="10"
           textSize="38sp"
           textStyle="bold"
           gravity="center"
           textColor="#ddffffff"
         ></text>
       </vertical>
       <frame android:layout_width="wrap_content" android:layout_height="wrap_content" bg="#ff00ff">
         <android.view.SurfaceView android:id="surfaceView" android:layout_gravity="center" />
       </frame>
     </vertical>
   );
   
   

5. 创建PLMediaPlayer实例

   PLMediaPlayer mMediaPlayer = new PLMediaPlayer(mContext, mAVOptions);

   PLMediaPlayer这个类从哪里来?

   这个就是SDK, 包括两部分

   1. java类, 由adnroid studio 生成dex, dex中有我们需要的java类
   2. so, 官方仓库的releases文件夹中有
      1. libqcOpenSSL.so
      2. libQPlayer.so

6. 加载类

   let dexPath = "./classes_merge.dex";
   runtime.loadDex(dexPath);
   importClass(com.pili.pldroid.player.PLMediaPlayer);
   importClass(com.pili.pldroid.player.PLOnCompletionListener);
   importClass(com.pili.pldroid.player.PLOnErrorListener);
   ...
   

7. 加载so

   copyJniLibs();
   

8. 创建PLMediaPlayer实例

   mMediaPlayer = new PLMediaPlayer(activity, getAVOptions());
   

9. AVOptions

   PLDroidPlayer SDK 提供的 AVOptions 类，可以用来配置播放参数

   function getAVOptions() {
     mAVOptions = new AVOptions();
     // 超时
     mAVOptions.setInteger(AVOptions.KEY_PREPARE_TIMEOUT, 10 * 1000);
     ...
     return mAVOptions;
   }
   

10. 将 SurfaceHolder 传递给 PLMediaPlayer

    mMediaPlayer.setDisplay(mSurfaceView.getHolder());
    

11. 网上找一个直播地址cctv-6, 看着好像差不多了, 试着播放一下

    
    mMediaPlayer.setDataSource(mVideoPath);
    mMediaPlayer.prepareAsync();
    setTimeout(function () {
      mMediaPlayer.start();
    }, 3000);
    

12. 完美播放视频

13. 以上就是最autojs使用七牛云SDK最简单的代码, 实际上你可能对音视频有更多的控制需求,

    不过demo跑通了, 添加其他功能, 问题都不大

14. 播放视频代码仅仅150行, 相信你一定看的懂

微信公众号 AutoJsPro教程

QQ群

747748653

完整源码

点击查看