<center><h2>𝓖𝓻𝓮𝓮𝓽𝓲𝓷𝓰𝓼</h2></center>
<div class="text-justify">

Hi dear Hive Learners, I hope you all are well. In this lecture, we will add some more things to the Intro activity. We will change the design of the Intro Activity and add some colors and the most important thing we will check whether the intro is already displayed or not so that users will not see the intro again and again. We will use the sharedPreferences to store a variable and update this variable when a user go through the intro for the first time. Let's jump into it.

![](https://images.ecency.com/DQmPVgoSN1DJGPRyY39qPumpSvie8Tpwg5xaCMdcCyVxAur/multi_purpose_1_.png)


## [GitHub Link](https://github.com/faisalamin9696/HiveLearners2)

Use this GitHub project to clone into your directory. The following lecture will update it so you will never miss the latest code. Happy Coding!

## What Should I Learn

- How to save the state of Intro Class

## Assignment

- Show intro only for the first time

## Procedure

First, we need to set the colors for the pages. We will add two pages. I also add a new logo of lazy-panda to use on the second page. Also, declare and initialize the SharedPreferences. I also set the Icon Layout Params and I use the height and width of 500. You can always change these parameters.

```
// First Page
        page1.setBackgroundColor(R.color.red);
        page1.setIconLayoutParams(500, 500, 0, 0, 0, 0);
        page1.setDisplaySkip(true);
        page1.setTitleColor(R.color.black);
        page1.setDescriptionColor(R.color.black);

        // Second Page
        page2.setBackgroundColor(R.color.black);
        page2.setIconLayoutParams(500, 500, 0, 0, 0, 0);
        page2.setDisplaySkip(true);
        page1.setTitleColor(R.color.black);
        page1.setDescriptionColor(R.color.black);
```

![](https://images.ecency.com/DQmdruaf7jQc2zsrSLTWvwinG63cALSZGVNC1Tsoeo87uNT/image.png)

Now we need to create a list and add these pages to the list and set it in the library method setOnboardPages. We also override the on finish button click and we will use it to save the state of into class and also redirect the user to the Sign in screen.

![](https://images.ecency.com/DQmcx5jadoZvA3MmwMBbChh76ZnnTsCvnq4ErSBBxZmCaer/image.png)

I add a boolean value ```is_intro_done``` in the SharedPreference when the user clicks on the finish button. Also, open the Sign in screen, show a welcome message, and finish the intro screen.

![](https://images.ecency.com/DQmbQz7NksPSQt3296Jsm5jBbg4LNqkET23XtErZZXuqLUW/image.png)

Now we need to check for the ```is_intro_done``` in the Splash activity. Declare and initialize the SharedPreference and set a check for the intro. If the intro the save boolean is false then we will open the Intro screen after the Splash screen else we will open the Login screen.

```
 sharedPreferences = getSharedPreferences("sharedPreferences", Context.MODE_PRIVATE);
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                // After two seconds 1000ms = 1 Second
                if (!sharedPreferences.getBoolean("is_intro_done", false))
                    startActivity(new Intent(Splash_Activity.this, App_Intro.class));
                else startActivity(new Intent(Splash_Activity.this, SignIn_Activity.class));
                
                finish();

            }
        }, 2000);
```

![](https://images.ecency.com/DQmRJsjQB4FogDSCcD1bDptmgvGzEVTSr1QzFNaWYC4ggta/image.png)

Let's run the app and if it is working or not.</div>

![](https://images.ecency.com/DQmbMLYopVVpTWQ5aVwfdRZAfYfUG3ZBGbhvHZLRf8FcbNA/image.png)


<center>
![hl_divider.png](https://images.ecency.com/DQmabQycJhW8DT8a634z3wQaVXvPZ5KMii2LYbaWZ3PsaRy/hl_divider.png)

<h2>Thank You</h2>

![hl_footer_banner.png](https://images.ecency.com/DQmZ4HF3hjV4HwJXuw8vRJ6B6CiMC3kUkkoihjtm7z2Gii7/hl_footer_banner.png)
<div class="pull-left"><a href="https://discord.gg/7Bzqv4qUMT">
<img src="https://cdn.steemitimages.com/DQmXd6PwGUHRgSDkWtwKfDvdFpaLHXvXBdK7wnYZeqe1GUa/discord_animation_logo.gif"/></a>
</center>