Skip to main content

How to Make A Website An App on Android

In this blog you’ll learn How to Make A Website An App on Android. For this, you must have Android Studio installed on your PC or Mac.

How to Make A Website An App on Android

We'll use our website https://www.faultinmycode.com. To make an Android App of your website follow the steps given below:

1.Open Android Studio and create an Android Project

2. Create Empty Activity.

3. Open activity_main (search in the Project Panel on the left) and enter XML code for WebView inside layout tags. Code for this is as follows:

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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"
    android:orientation="vertical"
    tools:context="com.faultinmycode.website.faultinmycode.MainActivity">
    <WebView
        android:id="@+id/websiteload"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1">
    </WebView>

</android.support.constraint.ConstraintLayout>
 
3. Open AndroidManifest.xml and now insert code for ‘user-permission’ to access the Internet. It will be placed before or after <application> tag.

AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.faultinmycode.website.faultinmycode">

    <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/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
    <uses-permission android:name="android.permission.INTERNET"/>
</manifest>
 
4. Now Open MainActivity.java file and extend the class MainActivity to ‘Activity’ as shown below, this is done to remove the toolbar from your app as AppCompatActivity comes with a toolbar.
Now Copy paste the code shown below. Explanation is done after the code.

MainActivity.java
package com.faultinmycode.website.faultinmycode;

import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;

public class MainActivity extends Activity {

    private WebView webview;


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

        webview = findViewById(R.id.websiteload);
        WebSettings settings = webview.getSettings();
        settings.setJavaScriptEnabled(true);
        webview.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);

        webview.setWebViewClient(new WebViewClient() {
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }

            public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
                Toast.makeText(getApplicationContext(), "Oh no! " + description, Toast.LENGTH_SHORT).show();

            }

        });
        webview.loadUrl("https://faultinmycode.com");

        }
    }

Explaination:

In the code written in mainActivity.java file as shown above, following methods are used:
  1. WebSettings

    It manages the settings of the WebView, we have used it to enable JavaScript in our app WebView.
  2. setJavaScriptEnabled()

    Its used to enable or disable JavaScript ability in the WebView.
  3. shouldOverrideUrlLoading(WebView view, String url)

    We have used it to take the control of loading of the url in the WebView. It will load the url inside the WebView If the user navigates to some other page on the website.
  4. loadurl()

    This component is used to load the website in the WebView.
Try this tutorial on How to Make A Website An App on Android today and let us know in case faced any problem!

Comments

Popular posts from this blog

How To Open PDF File in Android Application Example Included

Want to know How To Open PDF File in Android Application Example. To open a PDF File in Android Application, your app can take help from Free Android library available on Github.

Here are few apps made from PDF Library you can look at, click here to know more.

By using Android Library you are not only leveraging the hard work from another developer but also making it easier and quicker to develop an android app.
How To Open PDF File in Android Application Example  In this tutorial series, we will teach you how to open a pdf file in Android Application Example included with the help of Android PDFViewer library developed by Barteksc.

Get inspirtion from here: Top 7 PDF Download for Mobile Android Apps

Before I proceed further, here is the screenshot of the kind of PDF Viewer that’ll be created using Android Studio.



 How To Open PDF File in Android Application Example

The app will open a specified pdf file which will be copied in the assets folder of your Android studio project. I'v…

Open Weather Map API Example | Create Android Weather App

In this tutorial blog, using open weather map API example, we will create an Android weather app. The Android App will able to access Open weather map website server and access weather details of particular location.

The App will look similar to the image shown below. It will fetch real time weather of the location provided in MainActivity.Java file.


Software / Files used:Android Studio (Version 3.x) Files Edited / Created:activity_main.xmlMainActivity.JavaWeather.JavaAndroidManifest.xml Steps Involved in Open Weather Map API Example: Here are the Steps you need to follow on ‘Open Weather map API Example’ to create Android Weather App:

1. Open the Open Weather map API link provided here. Sign up for Current Weather Data API key here.

2. Once the key is received, save it to notepad or on stick notes.

3. Open Android Studio and create a new Project with name, ‘FIMC Weather App’, we will select an empty activity in the wizard and wait for Gradle build.



4. Open AndroidManifest.xml…

Android Live Wallpaper Tutorial (using Android Studio 3.x) | FaultInMyCode

The Android Live Wallpapers are the way to redesign your mobile background into something amazing animated GIF using different effects and motions. Many novice developers are making good money by Henceforth here is Android Live Wallpaper tutorial for you to build your own Live wallpaper and start earning today as a developer!



This tutorial is a part of our Blog series on ‘Roadway to Android Development Course’, its suitable for Beginners to programming as well as the android enthusiast to learn about Android development and build their own apps.

In this tutorial for beginners, you’ll learn how by using Android Studio 3.0 and by having basic knowledge of Java, we will teach you to build your own Live wallpaper for Android which you may later publish in the Google Play Store. We assume you have some experience with Android studio, if not please check how to build your own calculator app and how to create simple login app in Android Studio 3.x tutorial.
How to build Android …