Blogger Text

My Aim to Provide you quality contents, Tips & Tricks, Software, Microsoft Office, Graphic Editing (Adobe PhotoShop, After Affects, Illustrator, inDesign) Corel Draw, Corel Video Studio, Cyberlink PowerDirector, Power ActionCinema, Tutorials about Blogging and VU Assignments, Quizes & GDB Solutions and Much More... at regular Basis
                                     ***    Kindly Subscribe our Official YouTube Channel "INFOPALACESS OFFICIAL-Tuts: in this channel we upload Programming (C,C++,C# JAVA, PHP), Web Development, Graphics Editing and Microsoft Office Step by Step Tutorials from bigginer to Advance Level. We also provide free online courses at our YouTube Channel. ***   Graded Assignments/Quizes and GDB will start in Next Week. Solution ideas of All assignments, Quizes and GDB will be available here. If you have any problem regarding this then you can contact us.

How to add Splash Screen with Progress bar in Android Studio App

Android Splash Screen with Progress Bar
A splash screen is a graphical control element consisting of window containing an image, logo or current version of the software. Splash screen usually appears at the launching time of any program or game. A Splash screens are typically used by particularly large applications to notify the user that the program is in the process of loading. They provide feedback that a lengthy process is underway. Occasionally, a progress bar within the splash screen indicates the loading progress. The splash disappears when the application’s main window appears. Despite this we can also use it for making the app more attractive. There are many detailed or short tutorials on the topic of Splash Screen for Android or iOS all over the internet. But here a noticeable thing is this that only few that works without the blank screen while launching. Here I am going to share with you a perfect example for proper working Splash Screen.
See the example output picture [1] below before starting Tutorials.
splashscreen Output by Infopalacess
Picture [1] example output for splash screen with loading progress bar



Here progress bar is used in this example and can be changed according to the work done. Here first we need to create two activities One for Displaying flash and second for landing on Main Activity. This can be explained in following steps.

Fourth one is for class files to show progress and load next page after progress bar reach 100% .
 1 – Creating XML file for the splash screen and splash activity
First of All you need to copy and paste you picture or video contents in drawable folder you can also create an xml file in drawable folder. Here I am not going to create xml file I simple copy my app logo picture in to “Drawable Folder”. Below is the xml file for Splash activity.
a.    Now Create a New XML activity file as activity_splash.xml
How to add/create new activity
Right Click at “Layout” folder in res à Select New à Select Activity àEmpty Activity  [See the Picture [2]  below]
Picture [2]
b.    Now add Progress Bar and from Toolbox and also add some and pictures as you like to design your splash screen.
Here is my code for splash screen activity.


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_splash"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    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="com.logicchip.blog_7_proper_splash_screen.Splash">


    <ProgressBar
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="50dp"
        android:id="@+id/progressBar" />

    <TextView
        android:textSize="40sp"
        android:textColor="@android:color/holo_red_light"
        android:text="TextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/progressBar"
        android:layout_centerHorizontal="true"
        android:id="@+id/textView" />
</RelativeLayout>





2 – Applying Themes
a.  Theme is an important element. If you want to create you own custom theme then go to your styles.xml file and add a new theme and if you want to add predefined themes from android studio library you don’t need to create new themes.
Now go to Android Manifest.xml file and replaces launcher activity name with with 



<activity

   
android:name=".SplashScreen"

   
android:screenOrientation="portrait"

   
android:theme="@style/Theme.AppCompat.Light.NoActionBar"
>

    <intent-filter>

        <action android:name="android.intent.action.MAIN" />



        <category android:name="android.intent.category.LAUNCHER" />

    </intent-filter>

</activity>
 
[See the Picture [3] below]
 
Picture [3] Applying theme and setting Splash Screen Activity as Main
 3– Tasks for progress bar and loading next activity
Here we have created two activities as Splash.java and MainActivity.java. Splash.java is the splash activity, handling the splash and progress of progress bar. MainActivity.java is the landing page.
Please Note that: Inside the code the part runOnUiThread  is used to modify the TextView component. Ui components modification is possible only on ui thread. Otherwise app crashes.
Here we go to Splash.java file and add following code:

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ProgressBar;
import android.widget.TextView;
import java.util.Timer;
import java.util.TimerTask;

public class Splash extends AppCompatActivity{
    private Timer timer;
    private ProgressBar progressBar;
    private int i=0;
    TextView textView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_splash);
        progressBar=(ProgressBar)findViewById(R.id.progressBar);
        progressBar.setProgress(0);
        textView=(TextView)findViewById(R.id.textView);
        textView.setText("");

        final long period = 100;
        timer=new Timer();
        timer.schedule(new TimerTask() {
            @Override
            public void run() {
                //this repeats every 100 ms
                if (i<100){
                    runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            textView.setText(String.valueOf(i)+"%");
                        }
                    });
                    progressBar.setProgress(i);
                    i++;
                }else{
                    //closing the timer
                    timer.cancel();
                    Intent intent =new Intent(Splash.this,MainActivity.class);
                    startActivity(intent);
                    // close this activity
                    finish();
                }
            }
        }, 0, period);
    }

}




That’s it you have done the coding for splash screen and loading progress bar as seen in picture [1] above:

Post a Comment

0 Comments