ఏదైనా ఒక వెబ్ సైటును మొబైల్ యాప్ గా కన్వర్ట్ చేయాలంటే, (WebView) వెబ్ వ్యూ విడ్జెట్ ఉపయోగిస్తారు. ఈ (WebView) వెబ్ వ్యూ లో యుఆర్ఎల్ ద్వారా ఏదైనా వెబ్ సైటు స్క్రీనుపై చూపవచ్చును.

(WebView) వెబ్ వ్యూ ఉపయోగించి మొబైల్ యాప్ చేయడానికి ముందుగా ఆండ్రాయిడ్ స్టూడియో ఓపెన్ చేయండి. ఈ క్రింది ఇమేజ్ చూడండి.

పై ఇమేజులో లెఫ్ట్ సైడులో గతంలో క్రియేట్ చేసిన ప్రొజెక్టులు ఉన్నాయి. ఒక వేళ మీరు కొత్తగా ఆండ్రాయిడ్ స్టూడియో ఓపెన్ చేస్తే, ప్రొజెక్టు పేర్లు కనబడవు. గతంలో ఏవైనా ప్రొజెక్టులు ఓపెన్ చేసి ఉంటే, పైచిత్రం మాదిరి ఉంటాయి. ఇక పై చిత్రంలో + Start a new Android Studio project అని గల ఆంగ్ల అక్షరాలపై క్లిక్ చేయండి. కొత్త ప్రొజెక్టు క్రియేషన్ కోసం, నెక్స్ట్ స్క్రీనుకు మూవ్ అవుతంది. తర్వాతి స్క్రీను ఈ క్రింది ఇమేజులో చూడండి.

పై ఇమేజులో ఉన్నట్టుగా మీకు స్క్రీను వస్తే, అందులో Empty Activity ని ఎంపిక చేయండి. ఆ తరువాత Next బటన్ పై క్లిక్ చేయండి. తరువాతి స్క్రీను ఈ క్రింది విధంగా ఉంటుంది.

పై ఇమేజులో Name ఆంగ్ల అక్షరాల క్రింద ఉన్న బాక్సులో Type Your App Name అను అక్షరాలు గలవు. అలాగే మీకు ఆండ్రాయిడ్ స్టూడియోలో అయితే My Application అనే ఆంగ్ల అక్షరాలు వస్తాయి. వాటి బదులు మీకు కావాల్సిన పేరు లేదా మీ వెబ్ సైటు పేరును అక్కడ టైపు చేయండి. దాని క్రిందగా Package name అనే ఆంగ్ల అక్షరాల క్రింద బాక్సులో మీరు ప్యాకేజి నేమ్ ఎంపిక చేయండి. ప్యాకేజి నేమ్ లో మొదటిగా వెబ్ సైట అడ్రస్ ఎక్స్ టెన్షన్, తర్వాత వెబ్ సైట్ నేమ్, ఆ తర్వాత యాప్ నేమ్ మూడు పదాలు ఉంటాయి. మూడు పదాల మద్యలో డాట్స్ ఉంటాయి.

ఉదా: telugureads.com ఒక వెబ్ సైటు… దీనిని మొబైల్ యాప్ గా మార్చడానికి ప్యాకేజి నేమ్ మొదటి రెండు పదాలు తప్పనిసరిగా ఈ క్రిందివిధంగా ఉండాలి.

com.telugureads.appname ఈ ఆంగ్ల అక్షరాలలో మొదటి com. డొమైన్ ఎక్సెటెన్షన్ అయితే రెండవది telugureads. వెబ్ సైటు నేమ్ మూడవది ఎంపిక చేసుకున్న యాప్ పేరును వ్రాయాలి. ఆ విధంగా ప్యాకేజి నేమ్ సెట్ చేసుకోవాలి.

మరొక ముఖ్యమైన ఆప్షన్ టార్గెట్ వెర్షన్ ఎంపిక: పై ఇమేజులో Minimum SDK అనే ఆంగ్ల అక్షరాల ప్రక్కగా బాక్కులో డ్రాప్ డౌన్ పై క్లిక్ చేసి, ఆండ్రాయిడ్ వెర్షన్ ఎంపిక చేయాలి. ఏ వెర్షన్ ఎంపిక చేస్తే, ఆ వెర్షన దగ్గరనుండి పైవెర్షన్లలో మాత్రమే మీ మొబైల్ యాప్ అందుబాటులో ఉంటుంది. మీరు కిట్ కాట్ వెర్షన్ అంటే ఆండ్రాయిడ్ 4.0 ఎంపిక చేస్తే, మీ మొబైల్ యాప్ ఆండ్రాయిడ్ 4 నుండి లేటెస్ట్ వెర్షన్ వరకు సపోర్ట్ చేస్తుంది.

ఆండ్రాయిడ్ స్టూడియోలో మొబైల్ యాప్ కోసం ఆండ్రాయిడ్ వెర్షన్ కూడా ఎంపిక చేసి, ఫినిష్ బటన్ క్లిక్ చేసిన కొన్ని నిమిషాలకు ఆండ్రాయిడ్ ప్రొజెక్టు బిల్డ్ పూర్తవుతుంది. ఆండ్రాయిడ్ స్టూడియో గ్రాడిల్స్, ప్రొజెక్టు ఫైల్స్ లోడ్ కాగానే మీకు మొదటిగా ఒక యాక్టివిటి ఓపెన్ అవుతంది. అదే డిఫాల్డ్ ప్రొజెక్టు యాక్టివిటి మెయిన్ యాక్టివిటి.

గమనిక

ఒక యాక్టివిటి యొక్క జావా క్లాసు పేరులో ఉన్న పదాలు, లేఅవుట్ ఫైలుకు రివర్సులో ఉంటాయి. ఉదా: MysiteWebviewActivity.java అని ఒక యాక్టివిటి ఆండ్రాయిడ్ స్టూడియోలో సృష్టిస్తే, దాని లేఅవుట్ ఫైల్ activity_webview_mysite.xml గా జనరేట్ అవుతుంది.

ఈ మెయిన్ యాక్టివిటీలో రెండు రకాల ఫైల్స్ ఓపెన్ అయి ఆండ్రాయిడ్ స్టూడియో కనబడుతుంది. ఒకటి ఎక్స్ఎంఎల్ లేఅవుట్ ఫైల్, రెండు జావా క్లాస్ ఫైల్. ఎక్స్ఎంఎల్ లేఅవుటులో డిజైన్, చేస్తే దానికి కోడ్ జావాక్లాసు ఫైల్లో వ్రాయాలి. ఈ క్రింది కోడ్స్ గమనించండి. కొత్తగా ప్రాజెక్టు సృష్టించాక, మెయిన్ యాక్టివిటి ఈ క్రింది ఫైల్స్ రూపంలో ఓపెన్ అవుతుంది.

ముందుగా ఆండ్రాయిడ్ మేనిఫెస్ట్ ఫైల్లో ఈ క్రింది పర్మిషన్ యాడ్ చేయండి.

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

అలాగే వాల్యూస్ ఫోల్డరులో గల స్టైల్స్.ఎక్స్ఎంఎల్ ఫైల్లో మొదటి లైన్ ఈ క్రింది విధంగా ఉంటుంది.

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">  ఈ ఒక్క లైనును ఈ క్రింది విధంగా మార్చండి.
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

activity_main.xml యాక్టివిటీ మెయిన్ ఎక్స్ఎంఎల్ ఫైల్

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity.java మెయిన్ యాక్టివిటీ జావా క్లాస్ ఫైల్

package com.gt.myapplication;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

ఇప్పుడు మీరు క్రింది ఇచ్చిన కోడ్ ఆధారంగా ఆండ్రాయిడ్ స్టూడియోలో activity_main.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"
    android:orientation="vertical"
    tools:context=".MainActivity">
   <com.google.android.material.appbar.AppBarLayout
       android:layout_width="match_parent"
       android:layout_height="?attr/actionBarSize"
       android:background="@color/design_default_color_primary">

      <androidx.appcompat.widget.Toolbar
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:id="@+id/toolBar"
          app:popupTheme="@style/Theme.AppCompat.DayNight.NoActionBar">

         <RelativeLayout
             android:layout_width="match_parent"
             android:layout_height="match_parent">
            <TextView
                android:id="@+id/appName"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:gravity="center_vertical"
                android:layout_alignParentLeft="true"
                android:textSize="24sp"
                android:text="@string/app_name"/>
            <ImageView
                android:id="@+id/refreshImg"
                android:layout_width="24dp"
                android:layout_height="24dp"
                android:layout_marginRight="15dp"
                android:layout_centerVertical="true"
                android:layout_alignParentRight="true"
                android:src="@drawable/ic_refresh"/>
         </RelativeLayout>

      </androidx.appcompat.widget.Toolbar>

   </com.google.android.material.appbar.AppBarLayout>
   <ProgressBar
       android:id="@+id/progressBar"
       style="?android:attr/progressBarStyleHorizontal"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:indeterminate="true" />


   <WebView
       android:id="@+id/webView"
       android:layout_width="match_parent"
       android:layout_height="match_parent"/>

</LinearLayout>

అలాగే జావా క్లాసు కూడా ఈ క్రింది కోడును అనుసరించి, ఈ పోస్టు చివరలో ఉన్న వీడియో ద్వారా మార్పులు చేయగలరు. MainActivity.java మెయిన్ యాక్టివిటీ జావా క్లాస్ ఫైల్. ఎల్లో కలర్లో ఉన్న కోడ్ మాత్రమే మీరు కాపీ చేయగలరు.

MainAcitivity.java మెయిన్ యాక్టివిటీ జావా క్లాస్ ఫైల్

import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.Toolbar;

import android.content.Intent;
import android.graphics.Bitmap;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ImageView;
import android.widget.ProgressBar;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    WebView webView;
    ProgressBar progressBar;
    private String url  = "https://telugureads.com"; // ఇక్కడ మీ వెబ్ సైటు url టైపు చేయండి.
    Toolbar toolbar;
    ImageView imgRef;
    TextView tvTitle;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        webView = findViewById(R.id.webView);
        progressBar = findViewById(R.id.progressBar);
        imgRef=findViewById(R.id.refreshImg);
        tvTitle=findViewById(R.id.appName);

        toolbar = findViewById(R.id.toolBar);
        setSupportActionBar(toolbar);

        webView.setWebViewClient(new myWebViewClient());
        webView.getSettings().setJavaScriptEnabled(true);

        webView.loadUrl(url);

        imgRef.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                webView.reload();
            }
        });

        tvTitle.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
                startActivity(getIntent());
            }
        });
    }

    private class myWebViewClient extends WebViewClient {
            @Override
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
                super.onPageStarted(view, url, favicon);
                progressBar.setVisibility(View.VISIBLE);

            }

            @Override
            public void onPageFinished(WebView view, String url) {
                progressBar.setVisibility(View.GONE);
                super.onPageFinished(view, url);

            }
        }
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (event.getAction() == KeyEvent.ACTION_DOWN){
            switch (keyCode){
                case KeyEvent.KEYCODE_BACK:
                    if (webView.canGoBack()){
                        webView.goBack();
                    }else {
                        finish();
                    }
                    return true;
            }
        }
        return super.onKeyDown(keyCode, event);
    }
}