Android uses WebView to display Web pages

During the Android development process, you will encounter the need to display the Web page, or you need to use the WebView control to achieve an effect. I this period of time in the CSDN blog client, using WebView to display the content of the blog, one is because the analysis of the content of the blog is more difficult to match, and the effect is not ideal, and then think of the direct use of WebView to show, will blog the original presentation.

WebView is easier to use, but it requires a lot of groping to achieve the desired results. I do the Csdnblog client, now basic can be used, has been in the version iteration, but the blog post WebView display effect is still not satisfied, mainly because of the image of the scaling problem. Next, look at the code:

WebView = (WebView) Findviewbyid (r.id.article_content); Webview.setwebviewclient (new Mywebviewclient ()); Webview.getsettings (). Setdefaulttextencodingname ("Utf-8");//solve Chinese garbled problem webview.getsettings (). setappcacheenabled ( true);//Set Startup Cache Webview.getsettings (). Setcachemode (Websettings.load_cache_else_network); Boolean isloadimg = Csdnpreferences.getpreferencesetting (This, getString (r.string.pre_key_loadimg), true); LOG.I (TAG, "isloadimg=" + isloadimg); Webview.getsettings (). setloadsimagesautomatically (isloadimg);// Webview.getsettings (). Setjavascriptenabled (True);//webview.getsettings (). Setdisplayzoomcontrols (true);// Set the Display Zoom button//webview.getsettings (). Setsupportzoom (True); Supports scaling//webview.getsettings (). Setbuiltinzoomcontrols (true);//Method One://webview.getsettings (). Setusewideviewport ( true);//Let WebView read the page settings viewport,pc version of the page//webview.getsettings (). Setloadwithoverviewmode (true);// Method Two: Webview.getsettings (). Setlayoutalgorithm (layoutalgorithm.narrow_columns);//Fit Content Size//webview.getsettings (). Setlayoutalgorithm (layouTalgorithm.single_column);//Adaptation screen, content will be automatically scaled 

The use of WebView is mainly the configuration of its setting, some common methods of annotation written more clearly.

Blog has been written can be viewed offline, so do not need to enable caching, each time you open a new blog post, has taken the source of the Web page to capture the text content stored in the database.

At present, the problem is the image zoom: Open the page, the font display is OK, but the picture is too large, if the width of the picture is larger than the width of the screen, WebView can slide horizontally, so the experience is not very good, and to the user feel very consumption flow. Find a solution on the Internet, get the two methods of prompting in the code (in fact there is a method recommended), the first method, WebView will follow the PC page set viewport properties to load the page.

<name= "Viewport"  content= "Width=device-width" >

If you have one of these settings, you can fit on a mobile device, and if not, it will display the page for PC layout by default.

The second method, such as note writing, narrow_columns content, will be automatically wrapped according to the width of the screen, while the Single_column will let the content of the width, zoom, the effect is that the page is reduced to even text can not see.

The third method I have not tried, is based on different dpi, so that the corresponding zoom page. The feeling is unable to solve the problem, the concrete effect still has to try.

In fact, I want to modify the source of the Web page to change the properties of the image label, the width of the picture is set to the width of the screen, is preparing to try this way.

A client class needs to be replicated:

/** * Inherit webviewclient */class Mywebviewclient extends Webviewclient {//override shouldoverrideurlloading method so that clicking on the link does not open with another browser. @Override public boolean shouldoverrideurlloading (WebView view, String URL) {progressbar.setvisibility (Vie        w.visible);    String Bloger = constants.default_blog_user_id;    Pattern pattern = null;    System.out.println (URL); if (Url.matches (Constants.def_str_regex.    Regex_details)) {//link to csdn Blog content new Maintask (). Execute (URL); return true;} else if (url.matches (Constants.def_str_regex. Regex_blog)) {//blog Home Pattern = Pattern.compile (Constants.def_str_regex. Regex_blog);} else if (url.matches (Constants.def_str_regex. regex_category)//Blog list or category | | Url.matches (Constants.def_str_regex. Regex_bloglist) {pattern = Pattern.compile (Constants.def_str_regex). regex_list);}    else {return false;//let the system process the link request} Matcher Matcher = Pattern.matcher (URL);    if (Matcher.find ()) {Bloger = Matcher.group (1); } csdnapplication.getinstance (). Setcurrentblogerid (Bloger);        Mdb.savebloger (Bloger);    Intent Intent = new Intent ();    Intent.setclass (Blogcontentactivity.this, Maintabactivity.class); Intent.putextra (GetString (r.string.app_name), Constants.def_blog_type.    Blogerblog);    StartActivity (Intent);        BlogContentActivity.this.finish ();     Returns true if no other processing of the click-Link event is required, otherwise false return true;    } @Override public void onpagefinished (WebView view, String URL) {super.onpagefinished (view, URL);    LOG.I (TAG, "onpagefinished");    } @Override public void Onreceivederror (WebView view, int errorCode, string description, String failingurl) {    Super.onreceivederror (view, ErrorCode, description, Failingurl);    LOG.I (TAG, "onreceivederror");    There is no network or error handling, specifically can be based on the value of ErrorCode to judge, do with detailed processing. }}

Here the code is posted, mainly on the WebView Web page internal link processing, if it is Csdn blog, directly displayed in the current page, if it is the blog post list to exit to the previous screen to display, if it is the other web links directly through the Android default open mode processing.

WebView Other use techniques, wait until the great God came to the guidance.

Sincerely

Android uses WebView to display Web pages