android: how to let js code to change the webview's size

Issue

I'm developing an android application with API 19(android4.4).I have a linearLayout view nested another linearLayout view. Now I want change this linearLayout's height by js code, but it doesn't work.

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 test code:

...
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.html js code

<script>
function callHtml(method){
    case 'show':
        setTimeout(function(){
            bridge.expand();//call app to expand after 5s
        },5000);
        break;
}
</script>

log shows that layoutParams.height has changed to 500, but nothing happens in my emulator, something I make wrong? In addition, if i click a button to change the layoutParams's height, it works.

Solution

I have resolved this issue, just change JsInteraction code to below:

class JsInteraction{
    @JavascriptInterface
    public void expand(final int height){
        runOnUiThread(new Runnable(){
            @Override
            public void run(){
                //change size here
            }
        }   
    }
}

Answered By - cityvoice