안드로이드 웹뷰에서 Youtube 동영상 전체화면

     




예전에 만들었던 앱에서 웹뷰 사용시 유투브 동영상을 볼 때, 전체화면 버튼이 없거나 전체화면을 눌렀을 때 오류가 나는 경우가 있었습니다.


오류를 수정하려고 커스텀 웹뷰도 만들어보고, 옵션도 설정해 봤지만 실패..


하지만 드디어 방법을 알았습니다. 바로 WebChromeClient를 이용하는 것인데요,


하지만 단순히 크롬클라이언트만 사용할 경우 전체화면은 되지만, 앱 내부의 웹뷰가 아니라 새로운 크롬 창이 뜨면서 실행되는 단점이 있었습니다. 하지만 이게... 구지 웹클라이언트를 하나만 써야되는게 아니더라구요..?

무슨 소리냐면..




위에 보시면 WebChromeClient와 WebViewClient가 하나의 웹뷰에 Set된 것을 알 수 있습니다. 저는 이게 하나씩만 되는줄 알았거든요.... @_@


물론 이렇게 두개를 선언한다고 되는 것은 아닙니다. 코드를 보시면 WebViewClient의 경우 그냥 new를 때려서 새로 만들었지만, WebChromClient의 경우 커스텀 클래스를 만들어서 사용했습니다. 커스텀으로 만든 WebChromeClient는 아래와 같습니다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
package cho.gameRel;
 
import android.app.Activity;
import android.content.Context;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.widget.FrameLayout;
 
public final class ChromeClient extends WebChromeClient {
    private View mCustomView;
    private Activity mActivity;
    
    public ChromeClient(Activity activity) {
        this.mActivity = activity;
    }
    
    @Override
    public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
        result.confirm();
        return super.onJsAlert(view, url, message, result);
    }
    
     private int mOriginalOrientation;
     private FullscreenHolder mFullscreenContainer;
     private CustomViewCallback mCustomViewCollback;
 
     @Override
     public void onShowCustomView(View view, CustomViewCallback callback) {
 
         if (mCustomView != null) {
             callback.onCustomViewHidden();
             return;
         }
 
         mOriginalOrientation = mActivity.getRequestedOrientation();
 
         FrameLayout decor = (FrameLayout) mActivity.getWindow().getDecorView();
 
         mFullscreenContainer = new FullscreenHolder(mActivity);
         mFullscreenContainer.addView(view, ViewGroup.LayoutParams.MATCH_PARENT);
         decor.addView(mFullscreenContainer, ViewGroup.LayoutParams.MATCH_PARENT);
         mCustomView = view;
         mCustomViewCollback = callback;
         mActivity.setRequestedOrientation(mOriginalOrientation);
 
     }
 
     @Override
     public void onHideCustomView() {
         if (mCustomView == null) {
             return;
         }
 
         FrameLayout decor = (FrameLayout) mActivity.getWindow().getDecorView();
         decor.removeView(mFullscreenContainer);
         mFullscreenContainer = null;
         mCustomView = null;
         mCustomViewCollback.onCustomViewHidden();
    
         mActivity.setRequestedOrientation(mOriginalOrientation);
     }
 
 
     static class FullscreenHolder extends FrameLayout {
 
         public FullscreenHolder(Context ctx) {
             super(ctx);
             setBackgroundColor(ctx.getResources().getColor(android.R.color.black));
         }
    
         @Override
         public boolean onTouchEvent(MotionEvent evt) {
             return true;
         }
    }
}
cs

위와같이 ChromeClient에 전체화면에 대한 설정을 해야합니다.


유투브 전체화면 만들기 성공~!

반응형

댓글

Designed by JB FACTORY