Archive

Archive for September 18, 2011

Using WebView as a Image Zoom View control

September 18, 2011 12 comments

Well, the built-in Google Android has supported for developers lots of things; however, many still don’t know how to make uses the best out of it. One example is about WebView control.

Reference on WebView control on Google Android Developers’ Page

Most of developers just know “WebView is a control that supports the functionality to browse and surf webs.” Yes, that’s totally true! But, hang on…what does it mean specifically?

Think of it! Just like any other browsers, Firefox, IE, Opera or Safari.. what are things  could be displayed on a web browser? – I say “HTML code“, that’s right, for developers. What are the things wrapped around by HTML code? – I say “lots of text and images“.

Hey dude, stop right there. “Text and Images” are things can be displayed seperatedly on a web browser. Hence, for an open and creative minds, by using WebView control, developers can create a simple application like: Text Reader or Image Viewer. That’s true! So for simple application, you don’t have to customize or create any complicated control, WebView control is a good option.

Just for a fun introduction, let’s head to our goal, make use of WebView as an Image Zoom View control.

The WebView control has supported the built-in functionality of zoom, so we don’t have to re-create an already-existed on.

WebView as Image Zoom View

WebView as Image Zoom View

By using a simple property of WebView, we make use of it:

package pete.study.android;

import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebView;

public class MainActivity extends Activity {
    // declare a WebView object first
	WebView mWebView = null;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        // load view
        mWebView = (WebView)findViewById(R.id.webView);
        // (*) this line make uses of the Zoom control
        mWebView.getSettings().setBuiltInZoomControls(true);
        // simply, just load an image
        mWebView.loadUrl("http://www.fanseries.fr/wp-content/gallery/allison-mack/allison-mack-01.jpg");
    }
}

It’s cool, isn’t it?

What I want to share with you all actually is that, sometimes we think too complicated while the solution is very simple right in front of our eyes. Just to see it with a clear point of view, you’ll find the best solution!

Hope you have a lot of fun in this article >^o^<

 

Cheers,

Pete Houston

 

Categories: Tutorials Tags: , , ,