android: 如何让js代码改变webview的大小
android: how to let js code to change the webview's size
我正在使用 API 19(android4.4) 开发一个 android 应用程序。我有一个 linearLayout 视图嵌套了另一个 linearLayout 视图。现在想通过js代码改变这个linearLayout的高度,但是不行
active_main.xml
<LinearLayout xmlns="...." ...
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@id/sContainer"
tools:context=".MainActivity">
</LinearLayout>
java 测试代码:
...
private LinearLayout webViewContainer;
...
private void initView(){
LinearLayout container=(LinearLayout)findViewById(R.id.sContainer);
//add a child linearLayout
webViewContainer=new LinearLayout(this);
LinearLayout.LayoutParams layoutParams=new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,200);
webViewContainer.setLayoutParams(layoutParams);
//add a child webview in this linearlayout
WebView webview=(WebView)new WebView(this);
LinearLayout.LayoutParams webParams=new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,LinearLayout.LayoutParams.MATCH_PARENT);
webview.setLayoutParams(webParams);
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webView.addJavascriptInterface(new JsInteraction(), "bridge");
webView.loadUrl("http://xxxx/index.html");
webView.setWebViewClient(new WebViewClient(){
@Override
public void onPageFinished(WebView view, String url){
view.loadUrl("javascript:callHtml('show')");
}
});
webViewContainer.addView(webview);
container.addView(webViewContainer);
}
class JsInteraction{
@JavascriptInterface
public void expand(){
LinearLayout.LayoutParams layoutParams=webViewContainer.getLayoutParams();
layoutParams.height = 500;
webViewContainer.setLayoutParams(layoutParams);
Log.v("height", layoutParams.height+"");
}
}
index.htmljs代码
<script>
function callHtml(method){
case 'show':
setTimeout(function(){
bridge.expand();//call app to expand after 5s
},5000);
break;
}
</script>
log 显示 layoutParams.height 已更改为 500,但我的模拟器没有任何反应,我做错了什么?
此外,如果我单击一个按钮来更改 layoutParams 的高度,它会起作用。
那是 "probably",因为您还没有调用 requestLayout
,这是在您进行布局更改(视图的布局失效)后需要调用的
Call this when something has changed which has invalidated the layout of this view. This will schedule a layout pass of the view tree. This should not be called while the view hierarchy is currently in a layout pass (isInLayout(). If layout is happening, the request may be honored at the end of the current layout pass (and then layout will run again) or after the current frame is drawn and the next layout occurs.
所以,在改变高度之后,你应该调用requestLayout
...
linearLayout.requestLayout();
我已经解决了这个问题,只需将 JsInteraction 代码更改为以下:
class JsInteraction{
@JavascriptInterface
public void expand(final int height){
runOnUiThread(new Runnable(){
@Override
public void run(){
//change size here
}
}
}
}
我正在使用 API 19(android4.4) 开发一个 android 应用程序。我有一个 linearLayout 视图嵌套了另一个 linearLayout 视图。现在想通过js代码改变这个linearLayout的高度,但是不行
active_main.xml
<LinearLayout xmlns="...." ...
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@id/sContainer"
tools:context=".MainActivity">
</LinearLayout>
java 测试代码:
...
private LinearLayout webViewContainer;
...
private void initView(){
LinearLayout container=(LinearLayout)findViewById(R.id.sContainer);
//add a child linearLayout
webViewContainer=new LinearLayout(this);
LinearLayout.LayoutParams layoutParams=new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,200);
webViewContainer.setLayoutParams(layoutParams);
//add a child webview in this linearlayout
WebView webview=(WebView)new WebView(this);
LinearLayout.LayoutParams webParams=new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,LinearLayout.LayoutParams.MATCH_PARENT);
webview.setLayoutParams(webParams);
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webView.addJavascriptInterface(new JsInteraction(), "bridge");
webView.loadUrl("http://xxxx/index.html");
webView.setWebViewClient(new WebViewClient(){
@Override
public void onPageFinished(WebView view, String url){
view.loadUrl("javascript:callHtml('show')");
}
});
webViewContainer.addView(webview);
container.addView(webViewContainer);
}
class JsInteraction{
@JavascriptInterface
public void expand(){
LinearLayout.LayoutParams layoutParams=webViewContainer.getLayoutParams();
layoutParams.height = 500;
webViewContainer.setLayoutParams(layoutParams);
Log.v("height", layoutParams.height+"");
}
}
index.htmljs代码
<script>
function callHtml(method){
case 'show':
setTimeout(function(){
bridge.expand();//call app to expand after 5s
},5000);
break;
}
</script>
log 显示 layoutParams.height 已更改为 500,但我的模拟器没有任何反应,我做错了什么? 此外,如果我单击一个按钮来更改 layoutParams 的高度,它会起作用。
那是 "probably",因为您还没有调用 requestLayout
,这是在您进行布局更改(视图的布局失效)后需要调用的
Call this when something has changed which has invalidated the layout of this view. This will schedule a layout pass of the view tree. This should not be called while the view hierarchy is currently in a layout pass (isInLayout(). If layout is happening, the request may be honored at the end of the current layout pass (and then layout will run again) or after the current frame is drawn and the next layout occurs.
所以,在改变高度之后,你应该调用requestLayout
...
linearLayout.requestLayout();
我已经解决了这个问题,只需将 JsInteraction 代码更改为以下:
class JsInteraction{
@JavascriptInterface
public void expand(final int height){
runOnUiThread(new Runnable(){
@Override
public void run(){
//change size here
}
}
}
}