How to Convert Website into Android App in android studio using WebView Android Studio

Hi Guys, Welcome to Proto Coders Point, In this Android Tutorial we will create an App that convert a website into an app.

For this we gonna use webview to display our website

What is Webview in android?

In android a webview is a component of android Operating system(OS) that allows our application to load and display any website into an application.

This tutorial will be short and simple to understand so let’s begin implementation to display website straight into our android applicaton.

How to Convert Website into Android App ? Follow the Steps.

you can even learn this from below video

Step 1: Create a new Android Project or open Existing Project.

OffCourse you need to create a new android project.

Go to File > New > New Project  name the project as “Loading Website android”  or as per your choice.

Step 2 : Add Internet Permission

Open AndroidManifest.xml file and add the <user-permission> INTERNET as we gonna load a URL into our android application we do need INTERNET PERMISSION to be set.

paste below inside <manifest> tag in AndroidManifest.xml

<uses-permission android:name="android.permission.INTERNET"/>

Step 3 : Add webview in activitymain.xml file

Now open activitymain.xml file, Here you need to add a widget WebView  here we will load the URL and display the website.

paste the below xml Code

activitymain.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>

Step 4: Java android Code to loadURL in webview

Then, Now open MainActivity.xml  and add the java code

package com.protocoderspoint.webviewexample;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class MainActivity extends AppCompatActivity {

    private WebView webView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        //find the view
        webView = (WebView)findViewById(R.id.webview);
        // to load all the web page in app itself use this
        webView.setWebViewClient(new WebViewClient());

        webView.loadUrl("https://protocoderspoint.com/");

        WebSettings webSettings =webView.getSettings();

        //if your website is using any javascript that needs to load some script then you need to enable javascript in android application
        webSettings.setJavaScriptEnabled(true);

    }

    @Override
    public void onBackPressed() {
        // if any previous webpage exist then onback pressed will take care of it

        if(webView.canGoBack())
        {
            webView.goBack();
        }else{

            //else it will exit the application
            super.onBackPressed();
        }

    }
}

 

If you are interested in Flutter Development then Check flutter tutorial to load website in app

 

3 Comments