2016-07-25 28 views
0

我想播放嵌入的YouTube视频在web视图中。我的问题是当我旋转屏幕和调整webview的高度,iframe没有改变它的高度。Android嵌入视频的iframe不调整大小的webview高度变化

String embedSrc = "https://www.youtube.com/embed/8SeRU_ZPDkE"; 
String iframe = "<html><body style=\"margin: 0; padding: 0; background: #000;\"><iframe width=\"100%\" height=\" 100% \" src=\"" + embedSrc + "frameborder=\"0\" allowfullscreen style=\"background: #000;\"></iframe></body></html>"; 

webView.loadData(iframe, "text/html", "utf-8"); 

WebSettings settings = webView.getSettings(); 
     settings.setJavaScriptEnabled(true); 
     settings.setBuiltInZoomControls(false); 
     settings.setDomStorageEnabled(true); 

     String userAgent = settings.getUserAgentString(); 
     if (userAgent != null) { 
      userAgent = userAgent.replace("Android", ""); 
      settings.setUserAgentString(userAgent); 
     } 

//code to update webview height 
webView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, newHeight)); 


//layout 
<LinearLayout 
    android:id="@+id/root_view" 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="#000" 
    android:orientation="vertical" 
    > 

    <WebView 
     android:id="@+id/webview" 
     android:layout_width="wrap_content" 
     android:layout_height="250dp" 
     android:scrollbars="none" 
     /> 

</LinearLayout> 

我已经尝试过这个

webview.getSettings().setUseWideViewPort(true); 
webview.getSettings().setLoadWithOverviewMode(true); 

但这个代码使YouTube的播放控制非常小。

+0

任何成功...? – AkhilGite

+0

这种情况仍然没有:( –

+0

我找到解决方案@AkhilGite,试试吧。 –

回答

0

使用此Responsive Iframe CSS tip像这样的WebView解决了这个问题的iframe:

<style> 
.video-container { 
position: relative; 
padding-bottom: 56.25%; 
padding-top: 35px; 
height: 0; 
overflow: hidden; 
} 
.video-container iframe { 
position: absolute; 
top:0; 
left: 0; 
width: 100%; 
height: 100%; 
} 
</style> 
<div class="video-container"> 
    <iframe src="http://www.youtube.com/embed/4aQwT3n2c1Q" allowfullscreen="" frameborder="0"> 
    </iframe> 
</div> 
相关问题