In android, WebView is an extension of View class and it is used to show the static HTML web pages content or remote web pages content with URL in android applications as a part of our activity layout.
Generally, in android the WebView will act as an embedded browser to include the web pages content in our activity layout and it won’t contain any features of normal browser, such as address bar, navigation controls, etc.
Following is the pictorial representation of WebView in android applications.
Generally, in android WebView is useful to include and show the content of other web pages or application content in our required pages, such as an end-user agreements, etc.
Android WebView Example
Following is the example of showing a static HTML content in WebView in android applications.
Create a new android application using android studio and give names as WebView. In case if you are not aware of creating an app in android studio check this article Android Hello World App.
Now open an activity_main.xml file from /res/layout path and write the code like as shown below
activity_main.xml
<?xml version="1.0" encoding="utf-8"?><WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
android:id="@+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
Once we are done with adding a WebView to the layout, now we will show the static HTML content in WebView, for that open main activity file MainActivity.java from \java\com.tutlane.webview path and write the code like as shown below.
MainActivity.java
package com.tutlane.webview;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.webkit.WebView;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView wv = (WebView) findViewById(R.id.webview);
String customHtml = "<html><body><h1>Welcome to Tutlane</h1>" +
"<h2>Welcome to Tutlane</h2><h3>Welcome to Tutlane</h3>" +
"<p>It's a Static Web HTML Content.</p>" +
"</body></html>";
wv.loadData(customHtml, "text/html", "UTF-8");
}
}
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView wv = (WebView) findViewById(R.id.webview);
String customHtml = "<html><body><h1>Welcome to Tutlane</h1>" +
"<h2>Welcome to Tutlane</h2><h3>Welcome to Tutlane</h3>" +
"<p>It's a Static Web HTML Content.</p>" +
"</body></html>";
wv.loadData(customHtml, "text/html", "UTF-8");
}
}
If you observe above code, we are calling our layout using setContentView method in the form of R.layout.layout_file_name. Here our xml file name is activity_main.xml so we used file name activity_main and trying to show the static HTML content in WebView.
Generally, during the launch of our activity, onCreate() callback method will be called by android framework to get the required layout for an activity.
Output of Android WebView Example
When we run above example using android virtual device (AVD) we will get a result like as shown below.
This is how we can show the static HTML content using WebView in android applications based on our requirements.
Android Show Web URL Content in WebView Example
Generally, in android WebView will act as an embedded browser to show the static or remote web page content in our android applications.
Now we will see how to load remote URL content in WebView with example in android application.
By using WebView LoadURL property we can load remote URL content in our android applications. To show the remote URL content in webview modify MainActivity.java file code like as shown below.
ManiActivity.java
package com.tutlane.webview;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.webkit.WebView;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView webView = (WebView) findViewById(R.id.webview);
webView.getSettings().setJavaScriptEnabled(true);
webView.loadUrl("http://tutlane.com");
}
}
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView webView = (WebView) findViewById(R.id.webview);
webView.getSettings().setJavaScriptEnabled(true);
webView.loadUrl("http://tutlane.com");
}
}
If you observe above example, we are trying to load the remote URL (http://tutlane.com) content in our android application using WebView and we set a property setJavaScriptEnabled() to enable JavaScript because by default the JavaScript is disabled in WebView.
Generally, the web page which we are loading in WebView might use JavaScript. In case if we won’t enable the JavaScript, the functionality which related to JavaScript in web page won’t work that’s the reason we are enabling the JavaScript using setJavaScriptEnabled()
To load the remote web URL content, our application must have an access to the internet. We need to set the internet access permissions like as shown below.
<manifest ……>
……
<uses-permission android:name="android.permission.INTERNET" />
……
<uses-permission android:name="android.permission.INTERNET" />
……
</manifest>
</manifest>
Now open our application AndroidManifest.xml file in /manifests directory and write the code like as shown below
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.tutlane.webview">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
<uses-permission android:name="android.permission.INTERNET" />
</manifest>
package="com.tutlane.webview">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
<uses-permission android:name="android.permission.INTERNET" />
</manifest>
Once we are done with required settings, now we will run and see the result of our application.
Output of Android WebView Example
When we run above example using android virtual device (AVD) we will get a result like as shown below.
This is how we can show the remote URL web pages content using WebView in android applications based on our requirements.
No comments:
Post a Comment