AppIntro Library Using Android Application

Introduction

 
In this article, I am creating a simple app that contains a few intro slides with next and skips navigation. The user can navigate through each slide using a swipe gesture or using the next button.
 
App Intro Library - Basic Usage
 
You can use PageArray's quick generation in your app intro with the parallax effect. With the basic usage, the Android status bar will be updated to match your slide background color.
 
First Demo intro
 
Let's Start 
 
Step 1
 
Create a new project in Android studio from NewProject. When it prompts you to select the default activity, select Empty Activity and processed.
 
image2 
 
Step 2
   
Next, go to Gradle Scripts >> build. gradle (Module: app)
 
image3 
 
Select build.gradle page. The app Gradle compile code will appear. Just replace that the following code.
 
image4 
 
Project
  1. Repositories {  
  2.                maven {url 'https://jitpack.io' } }  
Dependencies complie
  1. complie  'com.github.ap1-devs:appintro:v4.2.2'  
Step 3 
  
Next, go to app >> res >> values >> colors.xml 
 
image5
 

Slide Part 

 
I am keeping 3 slides for this intro screen. So we need three separate layouts for three slides. The layout of each slide remains the same except the images, text, and colors. Alternatively, you can create a separate Fragment for each slide to have more control over the UI element display in the slide. 
 

Choosing the color

   
It's completely up to you to design the intro screens considering the types of app you are building. For this example, I am placing a small icon in the center and some text below it. At the bottom, a number of dots are placed indicating the number of slides it has.
 
image6
 
Below is the color palette I have selected to design the screens, for every screen we need three colors; that is background color and two-dot colors for when it is active / inactive. 
 
Open Colors.xml and add the below color values. You can see after adding the color, I have kept them into arrays array_dot_active and array_dot_inactive so that we can load them easily in our activity.
 
 image7
 
Color Code
  1. <color name="slide1">#E57373</color>   
  2. <color name="slide2">#F06292</color>   
  3. <color name="slide3">#BA68C8</color>   
Step 4
   
Next, go to app >> java >> your domain !! >> new >> Java Class. Java click to open dialog box.
 
image8 
 
After the process is complete Java Class dialog box appears .s Give an activity name as IntroActivity.
 
image9
 
Step 5
 
IntroActivity page is created, and select IntroActivity.java Page. The java code will appear. To import the following header files of this component, just replace the following codes. Then add IntroActivity page with color slide1, 2, and 3.
 
image10 
 
Java Code 
  1. addSlide(AppIntroFragment.newInstance(title "Page1", description, "Let's Strat",  R.mipmap.ic_Launcher, ContextCompat.getColor(getApplicationContext(), R.color.slide1)));  
  2. addSlide(AppIntroFragment.newInstance(title "Page2", description, "Go To Next Page",  R.mipmap.ic_Launcher, ContextCompat.getColor(getApplicationContext(), R.color.slide2)));  
  3. addSlide(AppIntroFragment.newInstance(title "Page3", description, "Finish",  R.mipmap.ic_Launcher, ContextCompat.getColor(getApplicationContext(), R.color.slide3)));  
 Step 6
 
Next, go to app >> src >> main >> res >> AndroidManifest.xml. Select AndroidManifest page. The xml will appear and add IntroActivity and Company domain name with activity tag.
 
image11
 
Activity 
  
Step 7
 
Next, go to Android Studio and Deploy the application. Select deployment target.
 
image12
 
OUTPUT
   
Run the application in your desired emulator (Shift + F10).
 
 
 

Summary

 
Finally, we have successfully created the AppIntro Library Android application.