一天開發一個播放器Demo：PLDroidPlayer實戰

沉默的範大叔發表於2017-12-11
播放器

一天開發一個播放器Demo：PLDroidPlayer實戰
上次對播放器ijkPlayer和PLDroidPlayer進行了評測，總體來說：

  1. ijkPlayer可以自己裁剪編譯，靈活性較好；
  2. PLDroidPlayer不能裁剪，所以不需要編譯，整合簡單
  3. PLDroidPlayer首開速度要快
  4. PLDroidPlayer在軟解碼條件下CPU和記憶體消耗較少

這次，我們和PLDroidPlayer玩耍了一下，整合了PLDroidPlayer的SDK，並且PLDroidPlayer的基礎上自定義了播放器介面，整體體驗如下：

  1. 由於官方文件十分詳細，所以整合SDK僅僅花費了幾分鐘時間，就能使用PLDroidPlayer播放視訊了；
  2. 整合過程中發現比較特別的功能，如DNS解析優化，本地快取等；
  3. 自定義UI介面花費時間較多，有很多細節需要處理。

整合SDK

下載SDK

PLDroidPlayer的SDK掛載在Github:github.com/pili-engine…，我們選擇最新SDK下載。希望官方能夠提供Gradle依賴，這樣會方便很多。

匯入SDK

下載下來的SDK提供了幾種CPU型別的so庫，這裡為了減少apk的體積，只選擇armeabi和armeabi-v7a的庫。然後將jar包匯入到項libs目錄下，匯入結果如下圖：

一天開發一個播放器Demo：PLDroidPlayer實戰

匯入完成後，記得同步一下，這樣就能呼叫SDK裡面的API了。

清單檔案配置

在清單檔案中新增4個許可權：

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WAKE_LOCK" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
複製程式碼
  1. 網路許可權
  2. 讀取外部磁碟許可權：在需要快取視訊檔案時需要（在6.0以上版本需要動態申請）
  3. 喚醒鎖許可權：播放視訊控制不黑屏使用
  4. 獲取網路狀態許可權：在需要判斷網路連線狀態時使用

程式碼混淆配置

如果打包apk開啟了程式碼混淆，還需要配置一下proguard-rules.pro檔案，防止SDK的類被混淆掉。

-keep class com.pili.pldroid.player.** { *; }
-keep class com.qiniu.qplayer.mediaEngine.MediaPlayer{*;}
複製程式碼

PLVideoView使用

一天開發一個播放器Demo：PLDroidPlayer實戰

一天開發一個播放器Demo：PLDroidPlayer實戰

PLVideoView使用SurfaceView作為視訊的渲染層。

佈局

在佈局中新增PLVideoView，並新增一個ProgressBar作為PLVideoView載入視訊的進度條。PLVideoView在佈局檔案中配置屬性keepScreenOn為true，讓螢幕保持常亮。當然，我們也可以使用相關API完成螢幕的點亮與熄滅。

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:layout_width="match_parent"
             android:layout_height="match_parent"
    android:background="@android:color/black">

    <com.pili.pldroid.player.widget.PLVideoView
        android:id="@+id/pl_video_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:keepScreenOn="true">
    </com.pili.pldroid.player.widget.PLVideoView>

    <ProgressBar
        android:id="@+id/progress_bar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"/>
</FrameLayout>
複製程式碼

初始化

我們可以呼叫PLVideoView的API進行初始化設定，如視訊路徑，各種播放監聽器，MediaController(如圖所示)，視訊預覽模式（原始尺寸、適應螢幕、全屏鋪滿、16:9、4:3）等。

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_pl_video_view);

    mPlVideoView = findViewById(R.id.pl_video_view);
    String path = "http://hc.yinyuetai.com/uploads/videos/common/2B40015FD4683805AAD2D7D35A80F606.mp4?sc=364e86c8a7f42de3&br=783&rd=Android";
    //設定Video的路徑
	mPlVideoView.setVideoPath(path);
    //設定MediaController，這裡是拷貝官方Demo的MediaController，當然可以自己實現一個
    mPlVideoView.setMediaController(new MediaController(this));
    //設定視訊預覽模式
    mPlVideoView.setDisplayAspectRatio(PLVideoView.ASPECT_RATIO_PAVED_PARENT);
	//設定載入進度的佈局
    mPlVideoView.setBufferingIndicator(findViewById(R.id.progress_bar));

}
複製程式碼

生命週期管理

@Override
protected void onResume() {
    super.onResume();
    mPlVideoView.start();//開始播放
}

@Override
protected void onPause() {
    super.onPause();
    mPlVideoView.pause();//暫停播放
}

@Override
protected void onDestroy() {
    super.onDestroy();
    mPlVideoView.stopPlayback();//釋放資源
}
複製程式碼

橫豎屏切換

當橫豎屏切換時，為了不讓Activity重新建立，我們需要配置AndroidManifest.xml。

<activity
    android:name=".PLVideoViewActivity"
    android:configChanges="orientation|screenSize|keyboardHidden"
    android:theme="@style/AppTheme.FullScreen"/>
複製程式碼

PLVideoTextureView

PLVideoTextureView與PLVideoView的API幾乎一模一樣，由於PLVideoTextureView內部使用TextureView作為視訊渲染控制元件，所以它還具備旋轉、映象變換的功能。

一天開發一個播放器Demo：PLDroidPlayer實戰

mPlVideoView.setRotation(180);
複製程式碼

一天開發一個播放器Demo：PLDroidPlayer實戰

mPlVideoView.setMirror(true);
複製程式碼

自定義UI

一天開發一個播放器Demo：PLDroidPlayer實戰
PLDroidPlayer只提供比較簡單的播放控制元件PLVideoView和PLVideoTextureView，這可能還不能完全滿足專案需求，一般還需要自己定義一套播放UI介面。這裡，我們自定義一個組合式控制元件VideoView，它的內部包含最基本的播放控制元件，還有載入進度條，播放進度條，播放時間，播放暫停按鈕。當然如果想要做的更完美一些，還可以加一些手勢進行音量、亮度等控制。

配置進度條樣式

一天開發一個播放器Demo：PLDroidPlayer實戰

<ProgressBar
    android:id="@+id/progress_bar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:indeterminateDrawable="@drawable/loading"
    android:layout_gravity="center"/>
複製程式碼

在ProgressBar裡面配置一個indeterminateDrawable屬性，指定為drawable檔案loading。

<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/loading_bg"
    android:fromDegrees="0.0"
    android:pivotX="50.0%"
    android:pivotY="50.0%"
    android:toDegrees="360.0" />
複製程式碼

而loading檔案是一個roate的動畫，裡面配置360度旋轉一張圖片。

播放暫停按鈕

在VideoView中間放置一個播放暫停按鈕，預設是隱藏的，當開始播放時顯示成暫停的按鈕，等待5s後自動隱藏，當使用者觸控VideoView時又顯示出來，鬆開之後延時5s又隱藏掉。

//視訊準備監聽器
private PLMediaPlayer.OnPreparedListener mOnPreparedListener = new PLMediaPlayer.OnPreparedListener() {
    @Override
    public void onPrepared(PLMediaPlayer plMediaPlayer, int i) {
		//顯示播放按鈕
        mPlay.setVisibility(View.VISIBLE);
		//開始延時5s
        postDelayed(mHider, HIDE_DELAY);
    }
};

//延時5s後執行該Runnable
private Runnable mHider = new Runnable() {
    @Override
    public void run() {
		//隱藏播放按鈕
        mPlay.setVisibility(View.GONE);
    }
};

//處理觸控事件
@Override
public boolean onTouchEvent(MotionEvent event) {
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            if (mProgressBar.getVisibility() == View.GONE) {
                //顯示播放器
                mPlay.setVisibility(VISIBLE);
				//延時5s隱藏
                postDelayed(mHider, HIDE_DELAY);
            }
            break;
    }
    return super.onTouchEvent(event);
}

//處理播放暫停按鈕點選事件
private void togglePlay() {
    if (mTextureView.isPlaying()) {
        mTextureView.pause();//暫停
        mPlay.setImageResource(R.drawable.play_selector);
        removeCallbacksAndMessages(null);//清空訊息迴圈

    } else {
        mTextureView.start();//播放
        mPlay.setVisibility(View.GONE);
        mPlay.setImageResource(R.drawable.pause_selector);
    }
}
複製程式碼

播放進度

當視訊準備好開始播放時，我們更新播放總時長，然後開啟一個訊息迴圈，每隔一段時間更新已播放時長。

private PLMediaPlayer.OnPreparedListener mOnPreparedListener = new PLMediaPlayer.OnPreparedListener() {
    @Override
    public void onPrepared(PLMediaPlayer plMediaPlayer, int i) {

        mProgressBar.setVisibility(View.GONE);

        long duration = mTextureView.getDuration();
		//格式化總時間長並更新
        mDuration.setText(TimeUtils.stringForTime(duration));
		//設定SeekBar進度
        mSeekBar.setMax((int) duration);
		//開始訊息迴圈，更新已播放時長
        postDelayed(mTicker, DELAY);
    }
};

private Runnable mTicker = new Runnable() {

    @Override
    public void run() {
		//更新已播放時長
        mCurrentTime.setText(TimeUtils.stringForTime(mTextureView.getCurrentPosition()));
		//更新SeekBar進度
        mSeekBar.setProgress((int) mTextureView.getCurrentPosition());
		//延時再次重新整理
        postDelayed(mTicker, DELAY);
    }
};
複製程式碼

當使用者暫停播放時停止訊息迴圈，開始播放時，重新開啟訊息迴圈。

private void togglePlay() {
    if (mTextureView.isPlaying()) {
		//移除訊息佇列裡面的mTicker，停止訊息迴圈
        removeCallbacks(mTicker);
    } else {
		//重啟訊息迴圈
        postDelayed(mTicker, DELAY);
    }
}
複製程式碼

拖動進度條處理

private SeekBar.OnSeekBarChangeListener mOnSeekBarChangeListener = new SeekBar.OnSeekBarChangeListener() {
    @Override
    public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
		//如果是使用者操作
        if (fromUser) {
			//設定播放進度
            mTextureView.seekTo(progress);
        }
    }
};
複製程式碼

播放結束處理

播放結束時，重置播放按鈕圖片，重置已播放時長，停止定時更新進度

private PLMediaPlayer.OnCompletionListener mOnCompletionListener = new PLMediaPlayer.OnCompletionListener() {
    @Override
    public void onCompletion(PLMediaPlayer plMediaPlayer) {
        mPlay.setImageResource(R.drawable.play_selector);
        mCurrentTime.setText("00:00");
        removeCallbacks(mTicker);
    }
};
複製程式碼

意外退出處理

當使用者在播放過程中直接退出Activity時，我們在onDetachedFromWindow中做一些清理工作。

@Override
protected void onDetachedFromWindow() {
    super.onDetachedFromWindow();
    mTextureView.stopPlayback();//停止播放
    removeCallbacks(mTicker);//移除定時更新進度
    removeCallbacks(mHider);//移除定時隱藏
}
複製程式碼

小結

事實上，如果對播放器的核心沒有特殊自定義需求，直接使用PLDroidPlayer是個不錯的選擇，整合簡單，節省不少時間成本，並且效能不錯。當然對於PLDroidPlayer也有一些不足的地方：

  1. 沒有提供Gradle依賴來下載SDK相關檔案，需要自己去Github下載。
  2. 其實PLDroidPlayer還可以提供一套可預設的UI層的庫，這樣開發者如果對UI沒有定製化需求，那麼簡直不要太簡單。
  3. 在使用過程中還存在一些小Bug，比如會出現已播放時長超過視訊總時長的情況，不知道是不是我的使用姿勢問題還是SDK的問題。
  4. 我還嘗試過將PLDroidPlayer放在列表中想做一個類似今日頭條的視訊列表效果，但並不成功，不知道是不是我的姿勢問題還是SDK沒有考慮過這方面的需求。

相關文章