Android SDK, Embed A WebView With The WebKit Engine

Android Application Development Training Tutorial
For more info visit http://www.zybotech.in
A7, Stephanos Tower, Eachamukku, Kakkanadu,Kochi
Android SDK: Embed a WebView with the WebKit Engine

Step 1: Preparation
Start off by creating a new Android SDK project in your IDE of choice. You can name the main activity, package root and project anything you want. Choose Android 1.6 as your platform to maintain broad compatibility.
Step 2: Setting up the WebView Widget

The WebView widget works just like any other Android SDK widget: you declare it in a layout file and can then access it from an Activity and tell it what to do. Open your main.xml layout file or create it if your IDE didnt already do so. Next, declare the WebView widget as a child of the LinearLayout element, making sure to specify an ID so you can access the widget later. As always, dont forget to declare the width and height or else your app will throw an exception. For demonstration purposes, were going to have the component fill up the whole screen by setting the android:layout_width and android:layout_height attributes to fill_parent.
view plaincopy to clipboardprint? 1. <?xml version="1.0" encoding="utf-8"?> 2. 3. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 4. android:orientation="vertical" 5. android:layout_width="fill_parent" 6. android:layout_height="fill_parent" 7. > 8. 9. <WebView android:id="@+id/web_engine" 10. android:layout_width="fill_parent" 11. android:layout_height="fill_parent" 12. /> 13. </LinearLayout>
Step 3: Requesting Internet Permission from the Android Manifest

Since were going to load a URL in the WebView widget, we have to make sure to request permission to access the Internet in AndroidManifest.xml
Open it up and declare a uses-permission element where you specify android.permission.INTERNET as the android:name attribute, like so (line 6):
view plaincopy to clipboardprint? 1. <?xml version="1.0" encoding="utf-8"?> 2. 3. <manifest xmlns:android="http://schemas.android.com/apk/res/android" 4. package="com.webkitdemo"> 5. 6. <uses-permission android:name="android.permission.INTERNET" /> 7. 8. <application android:icon="@drawable/icon" android:label="WebKitDemo"> 9. 10. <activity android:name=".WebKitDemo"> 11. <intent-filter> 12. <action android:name="android.intent.action.MAIN"/> 13. <category android:name="android.intent.category.LAUNCHER"/> 14. 15. </intent-filter> 16. </activity> 17. </application> 18. </manifest>
If you start your application in the Android emulator now, you will see a blank, white screen. Why? Well, we havent told WebView to render anything yet thats what well do next.
Step 4: Load a Web Page

Open up your main activity (com.webkitdemo.WebKitDemo in our case) and add the following code into the onCreate() method:
view plaincopy to clipboardprint? 1. WebView engine = (WebView) findViewById(R.id.web_engine); 2. engine.loadUrl("http://mobile.tutsplus.com");
This snippet of code accesses the WebView widget via its resource ID and invokes loadUrl(). Start the app in the emulator and view the result: it should display the site youre currently on!
Step 5: Render Custom Markup

Next, were going to replace the loadUrl() call with loadData(), which takes three arguments:
1. String htmlData 2. String mimeType 3. String encoding A7, Stephanos Tower, Eachamukku, Kakkanadu,Kochi
Comment out the engine.loadUrl() line and insert the following code underneath it:
view plaincopy to clipboardprint? 1. String data = "<html>" + 2. "<body><h1>Yay, Mobiletuts+!</h1></body>" + 3. "</html>"; 4. engine.loadData(data, "text/html", "UTF-8");
Compile and restart the application in the emulator and you should see this:
Technically, you can pass another type of data with its respective mime-type to this method, but most of the time youll be using text/html with a UTF-8 encoding. Dont forget that youre using WebKit, a powerful web engine; you can use CSS3, JavaScript etc. when you design your manuals or anything you want it to display. NOTE: One of WebViews peculiarities is the fact that JavaScript is disabled by default. The reason for this is that in most cases when youre embedding a WebView into your application, youre using it for a help manual or something that doesnt require JavaScript. Nevertheless, its easy to enable it if you do need it:
view plaincopy to clipboardprint? 1. engine.getSettings().setJavaScriptEnabled(true);
Extra features
You may have noticed that the widget doesnt have a toolbar. This is intended, as you would normally launch the native web browser app if you want navigation capabilities. There is, however, a way to control it programmatically. Try invoking one of the following methods on the instance of your widget:

reload(): Refreshes and re-renders the page. goForward(): Goes one step forward in browser history. goBack(): Goes one step back in browser history.
The API has a lot more to offer, but that goes beyond the scope of this Quick Tip.
Conclusion
You should now be familiar with the basic usage of the very useful Android WebView widget. You can use it to display an about web page for your application or a user manual all sorts of stuff. Technically, you can even write your application using JavaScript, CSS and HTML and display it using the widget, although that wouldnt be too practical Or would it?
A Dash Of Web and Mobile Development

Discussing trends and technologies in web and mobile development
Sending HTML Email With Android Intent

Its very easy to send email via an Android intent. Heres an example where we already have the subject and body prepared but want to let the user decide on the recipient:
view source print?
1 final Intent emailIntent = new Intent(android.content.Intent.ACTION_SEND); 2 emailIntent.setType("text/plain"); 3 emailIntent.putExtra(android.content.Intent.EXTRA_SUBJECT, subject); 4 emailIntent.putExtra(android.content.Intent.EXTRA_TEXT, body); 5 startActivity(Intent.createChooser(emailIntent, "Email:"));
(Its important to note that this should be attempted on a real device.) I ran into some trouble with sending HTML in an email because it was being interpreted as plain text both in the users email client and in the recipients. Simply changing the MIME type didnt help, but I eventually came across the solution:
view source print?
1 final Intent emailIntent = new Intent(android.content.Intent.ACTION_SEND); 2 emailIntent.setType("text/html"); 3 emailIntent.putExtra(android.content.Intent.EXTRA_SUBJECT, subject); 4 emailIntent.putExtra(android.content.Intent.EXTRA_TEXT, Html.fromHtml(body)); 5 startActivity(Intent.createChooser(emailIntent, "Email:"));
Note that both the MIME type is changed and the EXTRA_TEXT is now set as Html.fromHtml(body) instead of just being passed a string with HTML in it. So far Ive only tested this on a Nexus One running Android 2.1, but Ill give it a try on some other platforms and see if it works.

Android SDK, Embed A WebView With The WebKit Engine

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Android SDK, Embed A WebView With The WebKit Engine

Uploaded by

Copyright:

Available Formats

Android Application Development Training Tutorial

For more info visit http://www.zybotech.in

A7, Stephanos Tower, Eachamukku, Kakkanadu,Kochi

Android SDK: Embed a WebView with the WebKit Engine

Step 2: Setting up the WebView Widget

Step 3: Requesting Internet Permission from the Android Manifest

Step 4: Load a Web Page

Step 5: Render Custom Markup

A7, Stephanos Tower, Eachamukku, Kakkanadu,Kochi

A Dash Of Web and Mobile Development

Sending HTML Email With Android Intent

A7, Stephanos Tower, Eachamukku, Kakkanadu,Kochi

You might also like