android

YoutubePlayerView 소개

sieunju 2021. 7. 22. 10:14
반응형

안녕하세요 안드로이드 개발자 SieunJu 입니다.
최근에 유튜브 플레이어 라이브러리를 만들어서 한번 간략히 소개 할까 합니다.
유튜브 플레이어 깃 주소

1. 계기

우선 아주 예전에 만들어진 자체 유튜브 API가 jar 있었습니다.
하지만 그건 현재 사용하기에는 많은 어려움이 있고 무엇보다 androidx 가 없습니다.
그래서 이거를 대응하기위해 어떤 외국인이 만든 라이브러리 보통 사용합니다.
이 라이브러리는 사람들이 많이 사용하고 되게 잘 만들었긴 했지만,
기본 베이스가 WebView를 처음에 초기화를 하기 때문에 RecyclerView 에다가 바로 넣으면 버벅이는 이슈가 있었습니다. 그래서 따로 커스텀하게 만들어서 사용해야 한다는 단점이 있었습니다.
그래서 유튜브 라이브러리 한번 만들어 볼까? 라는 생각을 가지고
만들게 되었습니다.

2. 라이브러리 컨셉

  • 최대한 외부 라이브러리 사용하지 않기
  • 최대한 내부에서 알아서 처리 가능하도록 하기

3. 기능

  • 유튜브 재생, 일시중지, 중지
  • 공유하기 및 Youtube 앱으로 재생하기
  • 전체화면
  • 현재 진행 상황 표시 및 원하는 시간으로 이동
  • 해당 진행한 시간 조회

4. 사용법

사용법은 되게 간단합니다. 라이브러리를 추가 후 아래와 같이 입력하시면 됩니다. 썸네일? 기본적으로 알아서 처리 합니다.

.xml

<com.hmju.youtubeplayer.YoutubePlayerView
    android:id="@+id/youtubeView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

만약에 썸네일이미지를 사용자가 직접 처리 한다면 YoutubePlayerView에 속성값으로 썸네일 아이디 값을 입력해주시면 됩니다.
(YoutubePlayerView 밖에서 이미지뷰를 만드는 경우 동작하지 않습니다.)
.xml

<com.hmju.youtubeplayer.YoutubePlayerView
    android:id="@+id/youtubeView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:youtubeThumbnailId="@id/imgThumb">

<androidx.appcompat.widget.AppCompatImageView
    android:id="@+id/imgThumb"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
</com.hmju.youtubeplayer.YoutubePlayerView>

.java or .kt

youtubePlayerView.setYoutubeUrl("유튜브 주소")

기본적인 UI 화면 구성은 아래와 같고, 저기서 우측 상단은 공유하기
우측 하단에는 전체화면, 유튜브 앱에서 실행하기 기능을 가진 버튼들입니다.
마찬가지로 해당 버튼들은 클릭시 알아서 동작하도록 만들었습니다.
_ps. 전체화면 기능을 제대로 동작하려면 Manifest > Activity > configChanges orientation|screenSize 를 넣으셔야 합니다. _

예시 화면

5. 라이브러리 추가 하는 방법

7. 후기

  • 퇴근후에 이것저것 만들다 보니 이제서야 완성된 느낌이 있었습니다. 쫌더 부지런해야 할거 같습니다.
  • 유튜브 플레이어 만드는데 신경쓸께 한두가지가 아니라서 되게 귀찮고 짜증났지만, 만들고 나니 뿌듯함 :D
  • 앞으로 좀더 다듬어야 할게 눈에 보여서 귀차니즘이 발동(?) 될거 같지만 그래도 해야 할거 같다....

이상 포스팅을 마치도록 하겠습니다~ 읽어주셔서 감사합니다 :)

반응형