Android में Sequence Layout का उपयोग कैसे करें?

परिचय

Android में Sequence Layout को समझने से पहले, हमें पता होना चाहिए कि Sequence Layout क्या है। Sequence Layout में प्रोग्रेस बार के साथ चरणों का क्रम होता है। क्रम के अनुसार, यह एक एनिमेटेड प्रोग्रेस बार का पालन करता है।

यह उदाहरण दर्शाता है कि Android Sequence Layout का उपयोग कैसे करें।

चरण 1: नया प्रोजेक्ट बनाएं

Android Studio में File → New Project पर जाएं और नया प्रोजेक्ट बनाने के लिए सभी आवश्यक विवरण भरें।

चरण 2: build.gradle (app) में डिपेंडेंसी जोड़ें

apply plugin: 'com.android.application'
android {
    compileSdkVersion 28
    defaultConfig {
        applicationId "com.example.andy.myapplication"
        minSdkVersion 19
        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.google.code.gson:gson:2.8.5'
    implementation 'com.android.support.constraint:constraint-layout:1.1.3'
    testImplementation 'junit:junit:4.12'
    implementation 'com.github.transferwise:sequence-layout:1.0.7'
    androidTestImplementation 'com.android.support.test:runner:1.0.2'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
}

चरण 3: build.gradle (project) में रिपॉजिटरी जोड़ें

buildscript {
    repositories {
        google()
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.2.1'
    }
}
allprojects {
    repositories {
        google()
        jcenter()
        maven { url "https://jitpack.io" }
    }
}
task clean(type: Delete) {
    delete rootProject.buildDir
}

चरण 4: activity_main.xml में लेआउट जोड़ें

<?xml version="1.0" encoding="utf-8"?>
<com.transferwise.sequencelayout.SequenceLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto">
    <com.transferwise.sequencelayout.SequenceStep
        android:id="@+id/first"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:subtitle="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s."
        app:anchor="30 Nov"
        app:title="First step"/>
    <com.transferwise.sequencelayout.SequenceStep
        android:id="@+id/second"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:subtitle="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s."
        app:title="Second step"/>
    <com.transferwise.sequencelayout.SequenceStep
        android:id="@+id/third"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:anchor="Today"
        app:title="Third step"
        app:subtitle="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s" />
</com.transferwise.sequencelayout.SequenceLayout>

उपरोक्त में, हमने Sequence Layout को पैरेंट लेआउट के रूप में घोषित किया है और व्यक्तिगत चरणों के रूप में Sequence Steps जोड़े हैं। प्रत्येक चरण में एंकर व्यू, शीर्षक और उपशीर्षक होते हैं।

चरण 5: MainActivity.java में कोड जोड़ें

package com.example.andy.myapplication;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Toast;
import com.transferwise.sequencelayout.SequenceStep;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    SequenceStep sequenceStep, sequenceStep2, sequenceStep3;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        sequenceStep = findViewById(R.id.first);
        sequenceStep2 = findViewById(R.id.second);
        sequenceStep3 = findViewById(R.id.third);
        sequenceStep2.setActive(true);
        sequenceStep.setOnClickListener(this);
        sequenceStep2.setOnClickListener(this);
        sequenceStep3.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.first:
                Toast.makeText(MainActivity.this, "This is first step", Toast.LENGTH_LONG).show();
                break;
            case R.id.second:
                Toast.makeText(MainActivity.this, "This is second step", Toast.LENGTH_LONG).show();
                break;
            case R.id.third:
                Toast.makeText(MainActivity.this, "This is Third step", Toast.LENGTH_LONG).show();
                break;
        }
    }
}

उपरोक्त कोड में, हमने Sequence Steps घोषित किए हैं और OnClickListener दिया है। चरणों को सक्रिय करने के लिए निम्नलिखित कोड का उपयोग करें:

sequenceStep2.setActive(true);

उपरोक्त कोड में, हमने Sequence2 को सक्रिय घोषित किया है, जिसका अर्थ है कि प्रोग्रेस बार Sequence Step 2 तक दिखाएगा।

ऐप चलाएं

मान लें कि आपने अपना वास्तविक Android मोबाइल डिवाइस कंप्यूटर से कनेक्ट किया है। Android Studio से ऐप चलाने के लिए, अपनी प्रोजेक्ट की एक्टिविटी फ़ाइलों में से एक खोलें और टूलबार से Run आइकन पर क्लिक करें। अपने मोबाइल डिवाइस को विकल्प के रूप में चुनें और फिर अपना मोबाइल डिवाइस जांचें जो डिफ़ॉल्ट स्क्रीन प्रदर्शित करेगा:

Android में Sequence Layout का उपयोग कैसे करें?

उपरोक्त उदाहरण में, जैसा कि हमने सक्रिय मोड घोषित किया है, इसने एक प्रोग्रेस बार दिखाया है।