EtiyaStepper ile sayfanızı adımlara bölün.

Mobil uygulamalarda bulunan uzun sayfalar, hem geliştiriciler hem de kullanıcılar açısından can sıkıcı olabiliyor. Bu yüzden sayfada bulunan içeriklerin adımlara ayrılması ve geçilen adımların daha az yer kaplaması için özetlerinin görüntülenmesi gerekiyor. Etiya Mobil Ekibi tarafından geliştirilen EtiyaStepper kütüphanesi ile Android uygulamalarınızda bu sorunu kolaylıkla çözebilirsiniz.

EtiyaStepper kütüphanesini kullanmak için projenize ait build.gradle dosyasındaki dependencies kısmına aşağıdaki satırı eklemeniz yeterli.

dependencies {
    ...
    implementation 'com.etiya.stepper:etiya-stepper:0.1.0'
}

Kullanım

Öncelikle sayfanıza ait layout’a EtiyaStepperLayout’u ekleyin.

<com.etiya.stepper.EtiyaStepperLayout
    android:id="@+id/stepper"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:stepper_title="@string/title"
    app:stepper_description="@string/description">
    
    ...
    
</com.etiya.stepper.EtiyaStepperLayout>

Daha sonra eklemek istediğiniz kadar adımı EtiyaStepperLayout içerisine ekleyin.

<com.etiya.stepper.EtiyaStepView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:step_name="@string/step_name"
    app:step_button="@string/step_button">
<LinearLayout
        android:id="@+id/step_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="@dimen/default_padding"
        android:orientation="vertical">
        
        ...
       
    </LinearLayout>
<RelativeLayout
        android:id="@+id/step_summary"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="@dimen/default_padding">
        
        ...
        
    </RelativeLayout>
</com.etiya.stepper.EtiyaStepView>

EtiyaStepView içerisindeki ilk layout içeriği, ikinci layout ise adımınıza ait özeti içerir. İsterseniz ikinci layout’u yazmayabilir, varsayılan özet görünümünü kullanabilirsiniz.

Aşağıdaki kod bloğuna benzer bir şekilde adımlarınızı yönetin.

EtiyaStepperLayout stepper = findViewById(R.id.stepper);
stepper.getStep(1).setStepButtonOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        stepper.setEnabled(false);
        stepper.showProgress();
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
    stepper.getCurrentStep().setStepSummaryText("Result");
                stepper.nextStep();
                stepper.setEnabled(true);
            }
        }, 1000);
    }
});

Ayrıca, adımlarda kullanılan EtiyaProgressButton’u uygulamanızın istediğiniz kısmında kullanabilirsiniz.

<com.etiya.stepper.EtiyaProgressButton
    android:id="@+id/etiya_progress_button"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:button_text="@string/save"/>

Kütüphaneye ait diğer özellikleri görmek için Github sayfasındaki örnek uygulamayı ve dokümantasyonu inceleyebilirsiniz.