I have a WebView in Android (4.2) which loads a local html with javascript (placed in the assets folder).
My Problem is, I can’t scroll in my WebView whatsoever. I Tried a lot of things and suggestions by similiar SO questions but nothing worked.
My Html is just a simple div-Tag which is used by the Kinetic-js framework to draw a picture and some canvas on top of it.
XML Layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="@dimen/text_size_smed_16sp"
android:textColor="@android:color/white"
android:text="@string/ui_floor_plan_building_textView" />
<Spinner android:id="@+id/floor_plan_building_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="@dimen/text_size_smed_16sp"
android:textColor="@android:color/white"
android:text="@string/ui_floor_plan_level_textView" />
<Spinner android:id="@+id/floor_plan_level_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<AutoCompleteTextView android:id="@+id/floor_plan_room_autoTextView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:completionThreshold="1"
android:hint="@string/ui_floor_plan_autocomplete_hint"
android:inputType="number"
android:imeOptions="actionSearch" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<WebView android:id="@+id/floor_plan_webView"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
</LinearLayout>
Java onCreate:
this.webView = (WebView) findViewById(R.id.floor_plan_webView);
this.webView.getSettings().setJavaScriptEnabled(true);
this.webView.getSettings().setLoadWithOverviewMode(true);
this.webView.getSettings().setUseWideViewPort(true);
this.webView.setScrollBarStyle(View.SCROLLBARS_OUTSIDE_OVERLAY);
this.webView.setScrollbarFadingEnabled(false);
this.webView.setVerticalScrollBarEnabled(true);
this.webView.setHorizontalScrollBarEnabled(true);
this.webView.getSettings().setSupportZoom(true);
this.webView.getSettings().setLightTouchEnabled(true);
this.webView.setWebViewClient(new WebViewClient(){
private boolean initialLoad = true;
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
if(this.initialLoad){
this.initialLoad = false;
drawFloorPlan();
}
}
});
this.webView.loadUrl(PATH_FLOOR_PLAN_HTML);
HTML file:
<html>
<head>
<title>Floor Plans</title>
<meta charset="UTF-8">
<script type="text/javascript" src="floor_plan.js"></script>
<script type="text/javascript" src="kinetic-v4.0.5.js"></script>
</head>
<body onload="initialize()" style="margin:0px; padding:0px; width:100%; height:100%">
<div id="container"></div>
</body>
</html>
Observation:
When the displayed image (html file) is smaller than the webview it is possible to scroll vertical and horizontal as long as the touch event is “outside” the shown html. Normally my picture is very large so there is no chance at all to touch outside and scroll.
I am not sure if its a problem within WebView itself or the html page. Any ideas how i can get the scrolling back to work?
I greatly appreciate every answer =) Thanks in advance!
I found a solution:
I implemented my own onTouchListener and do the scrolling on my own. Got the idea from another SO quesition/answer (Android: Scrolling an Imageview)
Thought this might be helpful to others as it seems to be a little buggy in the WebView with certain html files, loaded from file:///…