Breaking

Web View Template Android Studio Tutorial | Make Android App With Web Page





Step 1: in this step, Create a new project and name it WebViewExample or you can change the mane as you want.

Select File -> New -> New Project… then Fill the forms and click "Finish" button.

Step 2: Open res -> layout -> activity_main.xml (or) main.xml and add following code :
In this step, we will open an XML file and then we will add the code for displaying two buttons and a Webview in our xml file ( layout ). lets make it simple.
Description
<LinearLayout 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:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:weightSum="2">

        <Button
            android:id="@+id/loadWebPage"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginRight="10dp"
            android:layout_weight="1"
            android:background="#444"
            android:text="Load Web Page"
            android:textColor="#fff"
            android:textSize="14sp"
            android:textStyle="bold" />

        <Button
            android:id="@+id/loadFromStaticHtml"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_weight="1"
            android:background="#444"
            android:text="Load Static HTML"
            android:textColor="#fff"
            android:textSize="14sp"
            android:textStyle="bold" />
    </LinearLayout>

    <WebView
        android:id="@+id/simpleWebView"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_marginTop="20dp"
        android:scrollbars="none" />

</LinearLayout>


Step 3: Open src -> package -> MainActivity.java
In this step, open MainActivity and add the code to make connection the web view and two buttons. Out of those one button is used for displaying a web page in a webview and other one is used to load a static HTML page in webview.

package example.gb.webviewexample;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.ButtonBarLayout;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    WebView simpleWebView;
    Button loadWebPage, loadFromStaticHtml;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // initiate buttons and a web view
        loadFromStaticHtml = (Button) findViewById(R.id.loadFromStaticHtml);
        loadFromStaticHtml.setOnClickListener(this);
        loadWebPage = (Button) findViewById(R.id.loadWebPage);
        loadWebPage.setOnClickListener(this);
        simpleWebView = (WebView) findViewById(R.id.simpleWebView);

    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.loadFromStaticHtml:
                // define static html text
                String customHtml = "<html><body><h1>Hello, Nightwolfbd</h1>" +
                        "<h1>Heading 1</h1><h2>Heading 2</h2><h3>Heading 3</h3>" +
                        "<p>This is a sample paragraph of static HTML In Web view</p>" +
                        "</body></html>";
                simpleWebView.loadData(customHtml, "text/html", "UTF-8"); // load html string data in a web view
                break;
            case R.id.loadWebPage:
                simpleWebView.setWebViewClient(new MyWebViewClient());
                String url = "https://nightwolfbd.blogspot.com";
                simpleWebView.getSettings().setJavaScriptEnabled(true);
                simpleWebView.loadUrl(url); // load a web page in a web view
                break;
        }
    }

    private class MyWebViewClient extends WebViewClient {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            return true;
        }
    }

 
}


Step 4: Open manifests -> AndroidManifest.xml
In this step we will open Manifest file and also allow the internet permission for our app.
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="example.gb.webviewexample">
    <!-- define internet permission for our app -->
    <uses-permission android:name="android.permission.INTERNET" />
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme">
        <activity
            android:name=".MainActivity"
            android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

Output and result:
If everything goes well, Now start the AVD in Emulator and run the App. Choose either to open webpage or static HTML in WebView by clicking on Button. its done and simple way to make web page based android app. you can edit the website whenever you want you don't need to edit the content of the app.



People Come here For:

nightwoflbd, free softwares, online money making tricks, Earn Money Online, Easy Money, referal network, publisher, blog money earn, bangla tutorial, make money online, outsorcing, freelencing, template for youtube, video template, outro video template, entro video template, free bacground video, free music, free audio, bloggerhelp, blogger template, youtube tutorial, blogger tutorial, facebook help

Thanks for visiting this blog. If you like this post, please do at least one from the list 1.SHARE 2.COMMENT 3.JOIN SOCIAL MEDIA OR 4.BUY ME A BEER!.


No comments:

Post a Comment