Example of WebView
Here is an example of how to utilize WebView Layout. It produces a simple web application that prompts you for a URL and loads that URL's website in the WebView.
The changed main activity file MainActivity.kt is shown below.
Code:
package com.codingninjas.ui
import android.os.Bundle
import android.view.View
import android.webkit.WebView
import android.webkit.WebViewClient
import android.widget.Button
import android.widget.EditText
import androidx.appcompat.app.AppCompatActivity
class MainActivity : AppCompatActivity() {
var button: Button? = null
var editText: EditText? = null
var webView: WebView? = null
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
button = findViewById<View>(R.id.btn) as Button
editText = findViewById<View>(R.id.eT) as EditText
webView = findViewById<View>(R.id.wV) as WebView
webView!!.webViewClient = MyBrowser()
button!!.setOnClickListener {
val url = editText!!.text.toString()
webView!!.settings.loadsImagesAutomatically = true
webView!!.settings.javaScriptEnabled = true
webView!!.scrollBarStyle = View.SCROLLBARS_INSIDE_OVERLAY
webView!!.loadUrl(url)
}
}
private class MyBrowser : WebViewClient() {
override fun shouldOverrideUrlLoading(view: WebView, url: String): Boolean {
view.loadUrl(url)
return true
}
}
}
Our main_activity.xml looks like the code snippet given below.
Code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="8dp"
android:paddingTop="8dp"
android:paddingRight="8dp"
android:paddingBottom="8dp"
tools:context=".MainActivity">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:text="WebView"
android:textSize="35sp" />
<EditText
android:id="@+id/eT"
android:layout_width="280dp"
android:layout_height="wrap_content"
android:layout_below="@+id/tv"
android:layout_alignParentStart="true"
android:layout_marginTop="16dp"
android:focusable="true"
android:hint="Enter URL"
android:importantForAutofill="auto"
android:inputType="text"
android:text="https://www.codingninjas.com/"
android:textColorHighlight="#FD8EB4"
android:textColorHint="#FF5252" />
<Button
android:id="@+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/eT"
android:layout_alignParentEnd="true"
android:layout_toEndOf="@+id/eT"
android:text="Enter" />
<WebView
android:id="@+id/wV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/btn"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true" />
</RelativeLayout>
And finally, we will use internet permission in our AndroidManifest.xml file to load URLs through the internet.
Code:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.codingninjas.ui">
<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.UI">
<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>
Output:
To launch the website, enter a URL in the URL area and press the browse button that appears. But first, please make sure you're connected to the internet.
WebView will load the URL that the user will provide in EditText and only load if that is a valid URL. There may be some cases when some features can be easily implemented on the Web but not possible in Android to use this WebView.
FAQs
-
Is WebView the same as Chrome?
Ans: Chrome on Android is not the same as WebView. They share the same code, including a JavaScript engine and rendering engine.
-
Which app uses WebView?
Ans: Many well-known digital solutions that are marketed as app platforms are WebView apps. While most businesses do not publish their technology, we know that Meta, LinkedIn, Slack, Twitter, Gmail, the Amazon Appstore, and many others are WebView apps.
-
What's the distinction between a WebView and a browser?
Ans: A WebView is an embeddable browser that can be used by a native application to show web material, whereas a web app adds functionality and interactivity. Web apps run in browsers such as Chrome or Safari and take up no storage space on the user's device.
Key Takeaways
In this article, we have extensively discussed WebView in Android and its essential methods.
You can head over to our Android Development Course on the Coding Ninjas Website to dive deep into Android Development and build future applications.
We hope that this blog has helped you enhance your knowledge regarding WebView and if you would like to learn more, check out our articles on VideoView. Do upvote our blog to help other ninjas grow. Happy Coding!
34+ registered 
