Tuesday, February 3, 2009

WebView with ZoomControls in Android

Here is an article on how to use WebView with ZoomControls enabled. First of all add an Internet permission to your manifest file.
<uses-permission android:name="android.permission.INTERNET">
</uses-permission>

Layout (webview.xml)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent" 
>
  <WebView
    android:id="@+id/webView"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
  />
</LinearLayout>


public class Main extends Activity {
  private WebView myWebView;
  private static final FrameLayout.LayoutParams ZOOM_PARAMS =
new FrameLayout.LayoutParams(
ViewGroup.LayoutParams.FILL_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT,
Gravity.BOTTOM);

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    this.setContentView(R.layout.webview);
    this.myWebView = (WebView) this.findViewById(R.id.webView);

    FrameLayout mContentView = (FrameLayout) getWindow().
    getDecorView().findViewById(android.R.id.content);
    final View zoom = this.myWebView.getZoomControls();
    mContentView.addView(zoom, ZOOM_PARAMS);
    zoom.setVisibility(View.GONE);

    this.myWebView.loadUrl("http://www.almondmendoza.com");
  }
}



Quick Explanation:
The stuff here were extracted from BrowserActivity, so if there is an error on my explanation, i apologize in advance.

FrameLayout mContentView = (FrameLayout) getWindow().getDecorView().findViewById(android.R.id.content);
-- According to Windows Decoration, this would retrieve the top-level window decor view.

final View zoom = this.myWebView.getZoomControls();
-- this would get the zoom controls of the webview object

mContentView.addView(zoom, ZOOM_PARAMS);
-- this would add the zoom controls to our our top-level window, the ZOOM_PARAMS was just copied from BrowserActivity, so i dont actually know what it means :)

zoom.setVisibility(View.GONE);
-- This would hide the zoom at the start, we do this because we want to show the zoom controls only when the user's scroll the browser.

this.myWebView.loadUrl("http://www.almondmendoza.com");
-- This would load the url to our webview.


Source:
The codes above are all the sources, you just have to import the right classes. In eclipse just highlight the errors and right click then Quick Fix.

Reference:
BrowserActivity
Post a Comment