If we want to deliver a web application (or just a web page) as a part of a client application, we can do it using WebView. The WebView class is an extension of Android's View class that allows you to display web pages as a part of your activity layout. It does not include any features of a fully developed web browser, such as navigation controls or an address bar. All that WebView does, by default, is show a web page.
A common scenario in which using WebView is helpful is when you want to provide information in your app that you might need to update, such as an end-user agreement or a user guide. Within your Android app, you can create an Activity that contains a WebView, then use that to display your document that's hosted online.
To add a WebViewto your app in the layout, add the following code to your activity's layout XML file:
<WebView
android:id="@+id/webview"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
To load a web page in the WebView, use loadUrl(). For example in Java :
WebView myWebView = (WebView) findViewById(R.id.webview);
myWebView.loadUrl("http://www.example.com");
in Kotlin :
val myWebView: WebView = findViewById(R.id.webview)
myWebView.loadUrl("http://www.example.com")
All links the user clicks load in your WebView.
If you want more control over where a clicked link loads, create your own WebViewClient that overrides the shouldOverrideUrlLoading() method. The following example assumes that MyWebViewClient is an inner class of Activity. In Java :
private class MyWebViewClient extends WebViewClient {
@Override
public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
if ("www.example.com".equals(request.getUrl().getHost())) {
// This is my website, so do not override; let my WebView load the page
return false;
}
// Otherwise, the link is not for a page on my site, so launch another Activity that handles URLs
Intent intent = new Intent(Intent.ACTION_VIEW, request.getUrl());
startActivity(intent);
return true;
}
}
In Kotlin :
private class MyWebViewClient : WebViewClient() {
override fun shouldOverrideUrlLoading(view: WebView?, url: String?): Boolean {
if (Uri.parse(url).host == "www.example.com") {
// This is my web site, so do not override; let my WebView load the page
return false
}
// Otherwise, the link is not for a page on my site, so launch another Activity that handles URLs
Intent(Intent.ACTION_VIEW, Uri.parse(url)).apply {
startActivity(this)
}
return true
}
}
Here is an example basic project android studio with Webview
1. Create New Project
The first thing we have to do is of course create a new project in android studio. In this tutorial I named the project "My Application".
2. Create desain user interface
Open activity_main.xml in the folder layout, then add element as follows
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_marginTop="100dp">
<Button
android:id="@+id/btn_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Go to Website 1"/>
<Button
android:id="@+id/btn_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Go to Website 2"/>
</LinearLayout>
</RelativeLayout>
Right click on layout folder then select "New" and "Layout resource file " and then fill the file name with webview_activity , then add element as follows
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:id="@+id/webView"
/>
<ProgressBar
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="110dp"
android:id="@+id/progressBar2"
/>
</RelativeLayout>
4. Add Java File
Open MainActivity in java folder, then copy the code below
package com.nano.mywebview;
import androidx.appcompat.app.AppCompatActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
public class MainActivity extends AppCompatActivity {
Button btn1,btn2;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
btn1=findViewById(R.id.btn_1);
btn2=findViewById(R.id.btn_2);
btn1.setOnClickListener(web1);
btn2.setOnClickListener(web2);
}
private final View.OnClickListener web1 = v -> {
Intent theIntent = new Intent(this, WebViewActivity.class);
theIntent.putExtra("url", "https://nanokaryamandiri.com");
startActivity(theIntent);
};
private final View.OnClickListener web2 = v -> {
Intent theIntent = new Intent(this, WebViewActivity.class);
theIntent.putExtra("url", "https://www.thrizthan.com");
startActivity(theIntent);
};
}
Right click on java folder then select "New" and "Java Class File" and then fill the file name with "WebViewActivity" then copy the code below
package com.nano.mywebview;
import androidx.appcompat.app.AppCompatActivity;
import android.annotation.SuppressLint;
import android.graphics.Bitmap;
import android.os.Bundle;
import android.util.Log;
import android.view.KeyEvent;
import android.view.View;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
public class WebViewActivity extends AppCompatActivity {
WebView webView;
ProgressBar progressBar;
String dataUrl;
@SuppressLint("SetJavaScriptEnabled")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_web_view);
webView = findViewById(R.id.webView);
progressBar= findViewById(R.id.progressBar2);
webView.setWebViewClient(new myWebclient());
webView.getSettings().setJavaScriptEnabled(true);
getIntent2();
Log.e("testwebview",dataUrl);
webView.loadUrl(dataUrl);
WebViewClient webViewClient = new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
Log.e("PAGE_URL", url);
if(url.equals(dataUrl)){
finish();
}
}
};
}
private void getIntent2() {
dataUrl = getIntent().getStringExtra("url");
};
public class myWebclient extends WebViewClient{
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
progressBar.setVisibility(View.GONE);
}
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
}
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return super.shouldOverrideUrlLoading(view, url);
}
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if((keyCode==KeyEvent.KEYCODE_BACK) && webView.canGoBack()){
finish();
webView.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}
@Override
public void onBackPressed() {
finish();
}
}
5. Edit AndroidManifest XML
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.nano.mywebview">
<uses-permission android:name="android.permission.INTERNET"/>
<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/Theme.MyWebView">
<activity
android:name=".WebViewActivity"
android:exported="false" />
<activity
android:name=".MainActivity"
android:exported="true">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
6. Run the project
7. Then click "Go To Website 1"
Then Click back and Then click "Go To Website 2"
Okay, that's enough for now from me, if you have any questions, please comment in the comments column. If something goes wrong I apologize. Hopefully helpful, and thank you.