Html5视频本地在Android webview中不起作用

时间:2014-12-06 12:56:18

标签: android html5 video webview

我在webview android中播放html5内容的html5视频。它工作正常。视频继续播放我移动到另一个活动。所以视频活动就完成了。然后我来到视频活动并播放视频,视频没有播放。它显示视频的缩略图。我点击视频的播放图标。但是视频没有播放。它再次显示视频的缩略图。我按照此处的代码在Android的Webview中播放一次视频。请帮帮我

这是我的HTML代码:

HTML

<body onload="func()">
    <video id='video' src='video/real.mp4' controls /></video>
    <div class="video_player">
        <img id="image" src="video/vid.jpg" onclick="playVideo()" style="width:100%;height:100%"/>
    </div>

脚本

    <script type="text/javascript">
        function func(){
            document.getElementById("video").style.display="none";

        }

**播放视频的功能**

        function playVideo(){
            var myVideo = document.getElementById("video");
            myVideo.style.display="block";
            document.getElementById("image").style.display="none";

            new MediaElement('video', {
                enablePluginDebug: false,
                plugins: ['flash','silverlight'],
                type: '',
                pluginPath: 'js/johndyer-mediaelement-c4dae2f/',
                flashName: 'flashmediaelement.swf',
                silverlightName: 'silverlightmediaelement.xap',
                defaultVideoWidth: 1280,
                defaultVideoHeight: 720,
                pluginWidth: -1,
                pluginHeight: -1,
                timerRate: 250,
                success: function (mediaElement, domObject) { 
                    mediaElement.addEventListener('timeupdate', function(e) {
                        var time = mediaElement.currentTime;
                    }, false);
                    mediaElement.play();
                },
                error: function () { 
                }
            });
        }

**视频结束后执行动作**

        var videos = document.getElementById("video");
        videos.addEventListener("ended",closeVideo,true);
        function closeVideo(){
            //videos.style.display="none";
            document.getElementById("image").style.display="block";
            document.location.href = "03_video.html"
        }

    </script>
</body>

我只是重新加载了03_video.html

的html页面

1 个答案:

答案 0 :(得分:0)

试试这个,使用这个自定义的HTML5 WebView。希望它能解决你的问题

 public class HTML5WebView extends WebView {

private Context mContext;
private MyWebChromeClient mWebChromeClient;
private View mCustomView;
private FrameLayout mCustomViewContainer;
private WebChromeClient.CustomViewCallback mCustomViewCallback;

private FrameLayout mContentView;
private FrameLayout mBrowserFrameLayout;
private FrameLayout mLayout;

static final String TAG = "HTML5WebView";

private void init(Context context) {
    mContext = context;
    Activity a = (Activity) mContext;

    mLayout = new FrameLayout(context);

    mBrowserFrameLayout = (FrameLayout) LayoutInflater.from(a).inflate(
            R.layout.custom_screen, null);
    mContentView = (FrameLayout) mBrowserFrameLayout
            .findViewById(R.id.main_content);
    mCustomViewContainer = (FrameLayout) mBrowserFrameLayout
            .findViewById(R.id.fullscreen_custom_content);

    mLayout.addView(mBrowserFrameLayout, COVER_SCREEN_PARAMS);

    mWebChromeClient = new MyWebChromeClient();
    setWebChromeClient(mWebChromeClient);

    setWebViewClient(new MyWebViewClient());

    // Configure the webview
    WebSettings s = getSettings();
    s.setBuiltInZoomControls(true);
    s.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NARROW_COLUMNS);
    s.setUseWideViewPort(true);
    s.setLoadWithOverviewMode(true);
    s.setSavePassword(true);
    s.setSaveFormData(true);
    s.setJavaScriptEnabled(true);

    // enable navigator.geolocation
    s.setGeolocationEnabled(true);
    s.setGeolocationDatabasePath("/data/data/com.example.vimeotest/databases/");

    // enable Web Storage: localStorage, sessionStorage
    s.setDomStorageEnabled(true);

    mContentView.addView(this);
}

public HTML5WebView(Context context) {
    super(context);
    init(context);
}

public HTML5WebView(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(context);
}

public HTML5WebView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    init(context);
}

public FrameLayout getLayout() {
    return mLayout;
}

public boolean inCustomView() {
    return (mCustomView != null);
}

public void hideCustomView() {
    mWebChromeClient.onHideCustomView();
}

@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
    if (keyCode == KeyEvent.KEYCODE_BACK) {
        if ((mCustomView == null) && canGoBack()) {
            goBack();
            return true;
        }
    }
    return super.onKeyDown(keyCode, event);
}

private class MyWebChromeClient extends WebChromeClient {
    private Bitmap mDefaultVideoPoster;
    private View mVideoProgressView;

    @Override
    public void onShowCustomView(View view,
            WebChromeClient.CustomViewCallback callback) {

        HTML5WebView.this.setVisibility(View.GONE);

        // if a view already exists then immediately terminate the new one
        if (mCustomView != null) {
            callback.onCustomViewHidden();
            return;
        }

        mCustomViewContainer.addView(view);
        mCustomView = view;
        mCustomViewCallback = callback;
        mCustomViewContainer.setVisibility(View.VISIBLE);
    }

    @Override
    public void onHideCustomView() {

        if (mCustomView == null)
            return;

        // Hide the custom view.
        mCustomView.setVisibility(View.GONE);

        // Remove the custom view from its container.
        mCustomViewContainer.removeView(mCustomView);
        mCustomView = null;
        mCustomViewContainer.setVisibility(View.GONE);
        mCustomViewCallback.onCustomViewHidden();

        HTML5WebView.this.setVisibility(View.VISIBLE);

    }

    @Override
    public boolean onConsoleMessage(ConsoleMessage consoleMessage) {

        return true;
    }

    @Override
    public Bitmap getDefaultVideoPoster() {

        if (mDefaultVideoPoster == null) {
            mDefaultVideoPoster = BitmapFactory.decodeResource(
                    getResources(), R.drawable.default_video_poster);
        }
        return mDefaultVideoPoster;
    }

    @Override
    public View getVideoLoadingProgressView() {

        if (mVideoProgressView == null) {
            LayoutInflater inflater = LayoutInflater.from(mContext);
            mVideoProgressView = inflater.inflate(
                    R.layout.video_loading_progress, null);
        }
        return mVideoProgressView;
    }

    @Override
    public void onReceivedTitle(WebView view, String title) {

        ((Activity) mContext).setTitle(title);
    }

    @Override
    public void onProgressChanged(WebView view, int newProgress) {

        ((Activity) mContext).getWindow().setFeatureInt(
                Window.FEATURE_PROGRESS, newProgress * 100);
    }

    @Override
    public void onGeolocationPermissionsShowPrompt(String origin,
            GeolocationPermissions.Callback callback) {
        callback.invoke(origin, true, false);
    }
}

private class MyWebViewClient extends WebViewClient {
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {

        // don't override URL so that stuff within iframe can work properly
        // view.loadUrl(url);
        return false;
    }

    @Override
    public void onLoadResource(WebView view, String url) {

        super.onLoadResource(view, url);
    }

}

static final FrameLayout.LayoutParams COVER_SCREEN_PARAMS = new FrameLayout.LayoutParams(
        ViewGroup.LayoutParams.MATCH_PARENT,
        ViewGroup.LayoutParams.MATCH_PARENT);

}

PlayerActvity:

  public class VimeoVideoActivity extends Activity {
private final String TAG = "MainActivity";
private HTML5WebView mWebView;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // requestWindowFeature(Window.FEATURE_NO_TITLE);

    mWebView = new HTML5WebView(this);

    // Auto playing vimeo videos in Android webview
    mWebView.getSettings().setJavaScriptEnabled(true);
    mWebView.getSettings().setAllowFileAccess(true);
    mWebView.getSettings().setAppCacheEnabled(true);
    mWebView.getSettings().setDomStorageEnabled(true);
    mWebView.getSettings().setPluginState(PluginState.OFF);
    mWebView.getSettings().setAllowFileAccess(true);
    mWebView.loadUrl("URL");
    // mWebView.loadUrl("http://player.vimeo.com/api/examples/simple");
    // F mWebView.loadUrl("http://vimeo.com/watch");
    // mWebView.loadUrl("http://192.168.1.4:9090/playground.html");
    // mWebView.loadUrl("http://ua.brad.is");
    setContentView(mWebView.getLayout());
}

@Override
public void onBackPressed() {
    // TODO Auto-generated method stub
    super.onBackPressed();

    mWebView.stopLoading();
}

}