How to convert a website to an Android application in 2019 part 2

Adding Splash Screen and Push notification button to android application

Adding Splash Screen on the android application

See How to convert a website to an android App part 1

1. Go to res>>>drawable>>.Righ Click>>>Show Explorer add your splash image inside drawable folder. this is splash image you prepared in Step 2 part one.

2. Go to app > res > drawable, right click the drawable folder and go new > Drawable resource file and name it launch_screen and click ok.

Add below code launch_screen

 launch_screen.xml

<?xml version=”1.0″ encoding=”utf-8″?> <!– The android:opacity=”opaque” line — this is critical in preventing a flash of black as your theme transitions. –><layer-list xmlns:andro android:opacity=”opaque”> <item android:drawable=”@color/colorPrimaryDark”/> <item> <bitmap android:src=”@drawable/logo” android:gravity=”center”/> </item></layer-list>

3. Go to>>> app >> res > values > styles.xml
<resources>

  add

 <style name=”AppTheme.Launcher”>
      <item name=”android:windowBackground”>@drawable/launch_screen</item>
    </style>

 under this code
        <item name=”colorAccent”>@color/colorAccent</item>
    </style>

styles.xml will look like below 

<!– Base application theme. –> </resources>

4 app > manifests > AndroidManifest.xml, line android:theme=”@style/AppTheme and add (.Launcher) as seen below

AndroidManifest.xml

<?xml version=”1.0″ encoding=”utf-8″?><manifest xmlns:andro package=”com.carton.zombie”> <uses-permission android:name=”android.permission.INTERNET” /> <uses-permission android:name=”android.permission.ACCESS_NETWORK_STATE”/> <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.Launcher”> <activity android:name=”.MainActivity”> <intent-filter> <action android:name=”android.intent.action.MAIN” /> <category android:name=”android.intent.category.LAUNCHER” /> </intent-filter> </activity> </application> </manifest>

5. Activate new post notifications on your android app.

Held to firebase and create new project and follow the instruction.
Download .jason file that you will include in your app folder.
Click to change app to projects

Go to Project>>Zombie>>app>>Right Click>>Show in Explorer past the .jason file in side folder
Go back to firebase and click next.

 Project-level build.gradle

You add  this code      
        classpath ‘com.google.gms:google-services:4.0.1’
below this code
classpath ‘com.android.tools.build:gradle:3.2.0’

as in the picture

Or copy and replace all  Project-level build.gradle from below box

// Top-level build file where you can add configuration options common to all sub-projects/modules. buildscript { repositories { google() jcenter() } dependencies { classpath ‘com.android.tools.build:gradle:3.2.0’ classpath ‘com.google.gms:google-services:4.0.1’ // NOTE: Do not place your application dependencies here; they belong // in the individual module build.gradle files } } allprojects { repositories { google() jcenter() } } task clean(type: Delete) { delete rootProject.buildDir }

App-level build.gradle
You add these code
    implementation ‘com.google.firebase:firebase-core:16.0.1’
    implementation ‘com.google.firebase:firebase-messaging:17.3.3’

below androidTestImplementation ‘com.android.support.test.espresso:espresso-core:3.0.2’
as in picture below

Or copy and replace all  App-level build.gradle from below box
apply plugin: ‘com.android.application’ android { compileSdkVersion 28 defaultConfig { applicationId “com.carton.zombie” minSdkVersion 21 targetSdkVersion 28 versionCode 1 versionName “1.0” testInstrumentationRunner “android.support.test.runner.AndroidJUnitRunner” } buildTypes { release { minifyEnabled false proguardFiles getDefaultProguardFile(‘proguard-android.txt’), ‘proguard-rules.pro’ } } } dependencies { implementation fileTree(dir: ‘libs’, include: [‘*.jar’]) implementation ‘com.android.support:appcompat-v7:28.0.0’ implementation ‘com.android.support.constraint:constraint-layout:1.1.3’ testImplementation ‘junit:junit:4.12’ androidTestImplementation ‘com.android.support.test:runner:1.0.2’ androidTestImplementation ‘com.android.support.test.espresso:espresso-core:3.0.2’ implementation ‘com.google.firebase:firebase-core:16.0.1’ implementation ‘com.google.firebase:firebase-messaging:17.3.3’ } apply plugin: ‘com.google.gms.google-services’

6. Open MainActivity, right click the domain folder > new > Java Class and name it MyFirebaseMessagingService

MyFirebaseMessagingService
package com.carton.zombie; import android.app.NotificationManager; import android.app.PendingIntent; import android.content.Context; import android.content.Intent; import android.support.v4.app.NotificationCompat; import android.support.v4.content.LocalBroadcastManager; import com.google.firebase.messaging.FirebaseMessagingService; import com.google.firebase.messaging.RemoteMessage; import java.util.Map; public class MyFirebaseMessagingService extends FirebaseMessagingService { @Override public void onMessageReceived(RemoteMessage remoteMessage) { Intent intent = new Intent(this, MainActivity.class); intent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP); PendingIntent pendingIntent = PendingIntent.getActivity(this,0,intent,PendingIntent.FLAG_ONE_SHOT); NotificationCompat.Builder notificationBuilder = new NotificationCompat.Builder(this); notificationBuilder.setContentTitle(“FCM NOTIFICATION”); notificationBuilder.setContentText(remoteMessage.getNotification().getBody()); notificationBuilder.setAutoCancel(true); notificationBuilder.setSmallIcon(R.mipmap.ic_launcher); notificationBuilder.setContentIntent(pendingIntent); NotificationManager notificationManager = (NotificationManager) getSystemService(Context.NOTIFICATION_SERVICE); notificationManager.notify(0,notificationBuilder.build()); //Change URL section String url = remoteMessage.getData().get(“url”); //url is the key to be used in firebase for data intent.putExtra(“url”,url); LocalBroadcastManager localBroadcastManager = LocalBroadcastManager.getInstance(this); localBroadcastManager.sendBroadcast(intent); } }

7.  Open MainActivity, right click the domain folder > >new >> Java Class and this time name it MyFireBaseInstanceIDService.

MyFireBaseInstanceIDService
package com.carton.zombie; import android.util.Log; import com.google.firebase.iid.FirebaseInstanceId; import com.google.firebase.iid.FirebaseInstanceIdService; public class MyFireBaseInstanceIDService extends FirebaseInstanceIdService { private static final String REG_TOKEN = “REG_TOKEN”; @Override public void onTokenRefresh() { String recent_token = FirebaseInstanceId.getInstance().getToken(); Log.d(REG_TOKEN,recent_token); } }

8 You have to add the full MainActivity.java code below

 package com.carton.zombie; import android.app.AlertDialog; import android.content.Context; import android.content.DialogInterface; import android.graphics.Bitmap; import android.net.ConnectivityManager; import android.net.NetworkInfo; import android.support.v4.widget.SwipeRefreshLayout; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.util.Log; import android.view.View; import android.webkit.WebChromeClient; import android.webkit.WebView; import android.webkit.WebViewClient; import android.widget.ProgressBar; import com.google.firebase.messaging.FirebaseMessaging; public class MainActivity extends AppCompatActivity { String websiteURL = “https://www.google.com”; // sets web url private WebView webview; SwipeRefreshLayout mySwipeRefreshLayout; private ProgressBar progressBar; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); FirebaseMessaging.getInstance().subscribeToTopic(“notifications”); //This sets the webview URL from push notifications. if(getIntent().getExtras() != null){ for(String key: getIntent().getExtras().keySet()){ if(key.equals((“url”))){ websiteURL = getIntent().getExtras().getString(key); // Toast.makeText(getApplicationContext(),”Opening The Notification Page”,Toast.LENGTH_LONG).show(); } } } if( ! CheckNetwork.isInternetAvailable(this)) //returns true if internet available { //if there is no internet do this //setContentView(R.layout.activity_main); //Toast.makeText(this,”No Internet Connection, Chris”,Toast.LENGTH_LONG).show(); new AlertDialog.Builder(this) //alert the person knowing they are about to close .setTitle(“You need an internet connection to use this app”) .setMessage(“Check to see if you’re mobile data is on or you are connected to a wi-fi network.”) .setPositiveButton(“Okay”, new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { finish(); } }) //.setNegativeButton(“No”, null) .show(); } else { //Webview stuff webview = findViewById(R.id.webView); webview.getSettings().setJavaScriptEnabled(true); webview.getSettings().setDomStorageEnabled(true); webview.setOverScrollMode(WebView.OVER_SCROLL_NEVER); webview.loadUrl(websiteURL); webview.setWebViewClient(new WebViewClientDemo()); webview.setWebChromeClient(new WebChromeClientDemo()); } //Swipe to refresh functionality mySwipeRefreshLayout = this.findViewById(R.id.swipeContainer); mySwipeRefreshLayout.setOnRefreshListener( new SwipeRefreshLayout.OnRefreshListener() { @Override public void onRefresh() { webview.reload(); } } ); //Progress bar variables progressBar = findViewById(R.id.progressBar); progressBar.setMax(100); } private class WebViewClientDemo extends WebViewClient { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; } @Override public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); progressBar.setVisibility(View.GONE); progressBar.setProgress(100); mySwipeRefreshLayout.setRefreshing(false); } @Override public void onPageStarted(WebView view, String url, Bitmap favicon) { super.onPageStarted(view, url, favicon); progressBar.setVisibility(View.VISIBLE); progressBar.setProgress(0); } } private class WebChromeClientDemo extends WebChromeClient { public void onProgressChanged(WebView view, int progress) { progressBar.setProgress(progress); } } //set back button functionality @Override public void onBackPressed() { //if user presses the back button do this if (webview.isFocused() && webview.canGoBack()) { //check if in webview and the user can go back webview.goBack(); //go back in webview } else { //do this if the webview cannot go back any further new AlertDialog.Builder(this) //alert the person knowing they are about to close .setTitle(“You are about to close the application”) .setMessage(“You cannot go back any further, would you like to close?”) .setPositiveButton(“Yes”, new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { finish(); } }) .setNegativeButton(“No”, null) .show(); } } } class CheckNetwork { private static final String TAG = CheckNetwork.class.getSimpleName(); public static boolean isInternetAvailable(Context context) { NetworkInfo info = (NetworkInfo) ((ConnectivityManager) context.getSystemService(Context.CONNECTIVITY_SERVICE)).getActiveNetworkInfo(); if (info == null) { Log.d(TAG,”no internet connection”); return false; } else { if(info.isConnected()) { Log.d(TAG,” internet connection available…”); return true; } else { Log.d(TAG,” internet connection”); return true; } } } }  

 

How to convert a website to an Android app Part 1 and How to convert a website to an Android app Part 2

Watch How to convert a website to an Android application in 2019 video here.