12/08/2018, 16:42

Giới thiệu GiraffePlayer2 thư viện video player

Trong bài viblo tháng này mình muốn giới thiệu với các bạn 1 thư viện video player mà mình hay dùng , khá tiện dụng và đơn giản đó là GiraffePlayer2. (https://github.com/tcking/GiraffePlayer2) Hiện nay mô hình mạng xã hội tích hợp nhiều tính năng đặc biệt là chat video, ảnh ... ; video call đang là ...

Trong bài viblo tháng này mình muốn giới thiệu với các bạn 1 thư viện video player mà mình hay dùng , khá tiện dụng và đơn giản đó là GiraffePlayer2. (https://github.com/tcking/GiraffePlayer2) Hiện nay mô hình mạng xã hội tích hợp nhiều tính năng đặc biệt là chat video, ảnh ... ; video call đang là xu hướng đồng thời cũng là khó khăn cho các lập trình viên như mình , vấn đề xử lí video , RMTP ... cũng như xử lí performance mất khá nhiều công sức. Mình thường sử dụng các thư viện ngoài và custom chúng hơn là việc sử dụng videoplayer của hệ thống , một trong những thư viện mình hay dùng là GiraffePlayer2. GiraffePlayer2 là thư viện xây dựng trên phiên bản ijkplayer 0.8.4 với các tính năng đa dạng :

  • Hỗ trợ RTMP , HLS (http & https) , MP4,M4A
  • Sử dụng gestures để điều chỉnh : âm thanh, ánh sáng (brightness) , forward or backward
  • Xem video full screen tự động theo sensor hoặc theo thiết lập với animation khá mượt mà
  • Tự động replay với live video
  • Thiết lập video scale type , lựa chọn chất lượng video
  • Hỗ trợ ListView/RecyclerView (in Activity or Fragment)
  • Hỗ trợ float window

Cách import thư viện

  • B1 : các bạn add jcenter vào root project trong build gradle file
repositories {
       ...
       jcenter()
   }
  • B2 : Add thư viện vào dependency
 compile 'com.github.tcking:giraffeplayer2:0.1.12'

   // if need more decoder using: compile 'com.github.tcking:giraffeplayer2:0.1.12-full'

Chú ý do thư viện có sử dụng thư viện .so nên nếu app của bản chỉ suport armeabi-v7a thì import như trên là đủ , nhưng nếu bạn muốn chạy máy ảo hoặc các ABI khác thì sử dụng các import sau

    compile 'com.github.tcking:ijkplayer-arm64:0.8.4' //support arm64
    compile 'com.github.tcking:ijkplayer-armv5:0.8.4' //support armv5
    compile 'com.github.tcking:ijkplayer-x86:0.8.4' //support x86 // build cho máy ảo bạn dùng complie này là được
    compile 'com.github.tcking:ijkplayer-x86_64:0.8.4' //support x86_64

Ứng dụng vào view

  • Bạn chỉ muốn play video fullscreen :
GiraffePlayer.play(getContext(), new VideoInfo("video url"));
  • Bạn muốn add vào layout (ListView/RecyclerView)

Trước hết bạn add trong xml file

<tcking.github.com.giraffeplayer2.VideoView
    android:id="@+id/video_view"
    android:layout_awidth="match_parent"
    android:layout_height="match_parent"/>

Trong activity (hoặc Fragment ) bạn get player và play rất đơn giản

VideoView videoView = (VideoView) findViewById(R.id.video_view);
videoView.setVideoPath(videoUri).getPlayer().start();

  • Sử dụng video player trong ListView hoặc RecyclerView

Chú ý bạn cần gọi hàm videoView.setFingerprint()

public void onBindViewHolder(VideoItemHolder holder, int position) {
        VideoItem videoItem = data.get(position);
        holder.name.setText(videoItem.name);
        holder.url.setText(videoItem.uri);
        holder.videoView.setVideoPath(videoItem.uri).setFingerprint(position);// or using:setFingerprint(videoItem.hashCode())
    }

Thiết lập Video player

Đây là 1 đoạn full code example cho phần thiết lập

//standalone player
VideoInfo videoInfo = new VideoInfo("http://xxx.mp4")
                            .setTitle("test video") //config title
                            .setAspectRatio(aspectRatio) //aspectRatio
                            .setShowTopBar(true) //show mediacontroller top bar
                            .setPortraitWhenFullScreen(true);//portrait when full screen

GiraffePlayer.play(getContext(), videoInfo);

//in RecyclerView or embed player
public void onBindViewHolder(VideoItemHolder holder, int position) {
        VideoItem videoItem = data.get(position);
        holder.name.setText(videoItem.name);
        holder.url.setText(videoItem.uri);
        holder.videoView.getVideoInfo().setBgColor(Color.GRAY).setAspectRatio(VideoInfo.AR_MATCH_PARENT);//config player
        holder.videoView.setVideoPath(videoItem.uri).setFingerprint(position);
    }

Toàn bộ thiết lập VideoInfo như sau

* videoInfo.setAspectRatio() // cài đặt aspect radio
* videoInfo.setFingerprint() // bắt buộc gọi trong list item
* videoInfo.addOption // add player init option
* videoInfo.setPortraitWhenFullScreen() // điều khiển view full screen mode portrait 
* videoInfo.setRetryInterval() 
* videoInfo.setShowTopBar() 
* videoInfo.VideoInfo() // video title
* videoInfo.setUri() // video Uri
* videoInfo.setBgColor() // video background
* videoInfo.setPlayerImpl() 
* videoInfo.addOption() 
* videoInfo.setFullScreenAnimation()// enable anim khi show full screen (chú ý API>=19,  setPortraitWhenFullScreen(false))

Quản lí video player

Sau đây là 1 số api thư viện cung cấp để chúng ta control dễ dàng hơn, mình chỉ đề cập 1 số hàm hay dùng

GiraffePlayer

1. player.start()
2. player.pause()
3. player.seekTo()
4. player.setPlayerListener()
5. player.stop()
6. player.release()
7. player.setVolume()
8. player.setMute()
9. player.isMute()
10. player.getCurrentState()

VideoView

1. videoView.getPlayer()
2. videoView.setFingerprint()
3. videoView.setVideoPath()
4. videoView.setPlayerListener()

PlayerListener

1. void onPreparing();
2. void onCompletion(GiraffePlayer giraffePlayer);
3. void onSeekComplete(GiraffePlayer giraffePlayer);
4. void onPause(GiraffePlayer giraffePlayer);
5. boolean onError(GiraffePlayer giraffePlayer,int what, int extra);
6. void onStart(GiraffePlayer giraffePlayer);

1 số hình ảnh demo

List video :

Chọn lựa chất lượng video :

Float window

Trên đây mình gửi đến các bạn 1 thư viện video player mình đang sử dụng rất mong giúp ích được các bạn .

0