In this Android Studio article i want to show you how to Convert Website to Android Application, so for this purpose we are going to use android WebView, the WebView
class is an extension of Android’s View
class that allows you to display web pages as a part of your activity layout. It does not include any features of a fully developed web browser, such as navigation controls or an address bar. All that WebView
does, by default, is show a web page. also you can check my more android development articles in the below line.
Also you can read more android development articles
1: Android Development Articles
First of all create a new project in your Android Studio, and choose Empty Activity
also iam using API 22 for this project.
After creation of the project, we are going to create a new empty activity at name of
SplashActivity, because before loading of the website i want to have a splash screen.
now you need to open activity_splash.xml , and you need to add this code in that file,
basically iam going to add an ImageView with TextView and the layout is ContraintLayout.
make sure that you have copied an image in your drawable folder.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
<?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:background="@color/colorAccent" tools:context=".SplashActivity"> <ImageView android:id="@+id/imageView" android:layout_width="276dp" android:layout_height="225dp" android:layout_marginStart="8dp" android:layout_marginTop="28dp" android:layout_marginEnd="8dp" android:scaleType="centerCrop" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:srcCompat="@drawable/python" /> <TextView android:textSize="30sp" android:textColor="@android:color/white" android:textAlignment="center" android:id="@+id/textView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginStart="8dp" android:layout_marginEnd="8dp" android:layout_marginBottom="8dp" android:text="Welcome To Codeloop Website" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/imageView" /> </android.support.constraint.ConstraintLayout> |
After that we are going to open SplashActivity.java , and we are going to add
our splash screen code in their. so this will be the complete code for my SplashActivity.java.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
package com.forogh.parwiz.convertwebsite; import android.content.Intent; import android.os.Handler; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; public class SplashActivity extends AppCompatActivity { Handler handler; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_splash); handler = new Handler(); handler.postDelayed(new Runnable() { @Override public void run() { Intent intent = new Intent(SplashActivity.this, MainActivity.class); startActivity(intent); finish(); } }, 4000); } } |
Now we need to bring changes to our manifest file, because by default the launcher
activity is our MainActivity, but we need to change that to SplashActivity.
1 2 3 4 5 6 7 8 |
<activity android:name=".SplashActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".MainActivity"></activity> |
Because iam using internet in this application, i need to add internet permission in my
manifest file.
1 |
<uses-permission android:name="android.permission.INTERNET"/> |
So now the SplashActivity has been completed, now we are going to open our
activity_main.xml , and we need to add a WebView.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<?xml version="1.0" encoding="utf-8"?> <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <WebView android:id="@+id/webview" android:layout_width="0dp" android:layout_height="0dp" android:layout_marginStart="8dp" android:layout_marginTop="8dp" android:layout_marginEnd="8dp" android:layout_marginBottom="8dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </android.support.constraint.ConstraintLayout> |
After that you need to open your MainActivity.java and add the webview code.
1 2 3 4 5 6 7 8 |
webView = findViewById(R.id.webview); WebSettings webSettings = webView.getSettings(); webSettings.setJavaScriptEnabled(true); webView.loadUrl("https://codeloop.org/"); webView.setWebViewClient(new WebViewClient()); |
Also we need to override the onBackPressed method.
1 2 3 4 5 6 7 8 9 10 |
@Override public void onBackPressed() { if(webView.canGoBack()) { webView.goBack(); } else { super.onBackPressed(); } } |
Now this is the complete code for MainActivity.java.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
package com.forogh.parwiz.convertwebsite; import android.support.v7.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); webView = findViewById(R.id.webview); WebSettings webSettings = webView.getSettings(); webSettings.setJavaScriptEnabled(true); webView.loadUrl("https://codeloop.org/"); webView.setWebViewClient(new WebViewClient()); } @Override public void onBackPressed() { if(webView.canGoBack()) { webView.goBack(); } else { super.onBackPressed(); } } } |
If you run the code this will be the result
Also you can watch the complete video for this article
Subscribe and Get Free Video Courses & Articles in your Email