PreviewSeekBar

介绍：

一个带预览视图的SeekBar，可以和ExoPlayer一起使用实现Google Play Movies那样的效果。

运行效果：

使用说明：

Build

dependencies {
    compile 'com.github.rubensousa:previewseekbar:0.3'
}

Add the following XML:

<com.github.rubensousa.previewseekbar.PreviewSeekBarLayout
      android:id="@+id/previewSeekBarLayout"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="vertical">
      <FrameLayout
          android:id="@+id/previewFrameLayout"
          android:layout_width="@dimen/video_preview_width"
          android:layout_height="@dimen/video_preview_height">
          <View
              android:id="@+id/videoView"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:layout_gravity="start"
              android:background="@color/colorPrimary" />
      </FrameLayout>
      <com.github.rubensousa.previewseekbar.PreviewSeekBar
          android:id="@+id/previewSeekBar"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_below="@id/previewFrameLayout"
          android:layout_marginTop="25dp"
          android:max="800" />
</com.github.rubensousa.previewseekbar.PreviewSeekBarLayout>

你需要在PreviewSeekBarLayout中至少添加一个PreviewSeekBar和一个FrameLayout，否则会出现异常。

PreviewSeekBarLayout继承自RelativeLayout因此还可以添加别的视图或者布局。

为seekBar添加一个标准的OnSeekBarChangeListener：

// setOnSeekBarChangeListener was overridden to do the same as below
seekBar.addOnSeekBarChangeListener(this);

实现你自己的预览逻辑：

@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
    // I can't help anymore
}

如何和ExoPlayer一起使用

为你的SimpleExoPlayerView添加一个自定义的controller

<com.google.android.exoplayer2.ui.SimpleExoPlayerView
    android:id="@+id/player_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:controller_layout_id="@layout/exoplayer_controls"/>

这里是sample中的exoplayer_controls： https://github.com/rubensousa/PreviewSeekBar/blob/master/sample/src/main/res/layout/exoplayer_controls.xml。

exoplayer_controls中的PreviewSeekBarLayout应该跟下面的代码类似：

<com.github.rubensousa.previewseekbar.PreviewSeekBarLayout
    android:id="@+id/previewSeekBarLayout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:orientation="vertical">
    <FrameLayout
        android:id="@+id/previewFrameLayout"
        android:layout_width="@dimen/video_preview_width"
        android:layout_height="@dimen/video_preview_height"
        android:background="@drawable/video_frame"
        android:padding="@dimen/video_frame_width">
        <com.google.android.exoplayer2.ui.SimpleExoPlayerView
            android:id="@+id/previewPlayerView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:controller_layout_id="@layout/exo_simple_player_view"
            app:surface_type="texture_view"
            app:use_artwork="false"
            app:use_controller="false" />
    </FrameLayout>
    <com.github.rubensousa.previewseekbar.PreviewSeekBar
        android:id="@+id/exo_progress"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/previewFrameLayout"
        android:layout_marginTop="10dp"
        android:max="800" />
</com.github.rubensousa.previewseekbar.PreviewSeekBarLayout>

使用下面的SimpleExoPlayerView作为预览：

<com.google.android.exoplayer2.ui.SimpleExoPlayerView
    android:id="@+id/previewPlayerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:controller_layout_id="@layout/exo_simple_player_view"
    app:surface_type="texture_view"
    app:use_artwork="false"
    app:use_controller="false" />

We need to specify another controller layout because the default one includes a SeekBar with the same id as ours.

Create a player with a custom TrackSelection and LoadControl

TrackSelection.Factory videoTrackSelectionFactory = new WorstVideoTrackSelection.Factory();
TrackSelector trackSelector = new DefaultTrackSelector(videoTrackSelectionFactory);
LoadControl loadControl = new PreviewLoadControl();
SimpleExoPlayer previewPlayer = ExoPlayerFactory.newSimpleInstance(previewPlayerView.getContext(),
        trackSelector, loadControl);
previewPlayer.setPlayWhenReady(false);

PreviewLoadControl and WorstVideoTrackSelection are used in the sample. Check the next section for some improvements notes.

Seek the player in onProgressChanged

@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
    if(fromUser){
        int offset = (float) progress / seekBar.getMax()
        // Round the offset before seeking. The sample uses 1% or 10% of the video per each thumbnail
        previewPlayer.seekTo((long) (offset * previewPlayer.getDuration()));
        previewPlayer.setPlayWhenReady(false);
    }
}