Different indicator shapes

How to set different indicator shapes?

• PasscodeView provides two different shapes of the indicators.
  • Dot
  • Circle ⭕️

---

• Dot indicator:

  • Prepare the indicator builder.

     CircleIndicator.Builder builder =  new DotIndicator.Builder(/* PIN view */)
                    .setIndicatorRadius(/* Radius of the dot */)
                    .setIndicatorFilledColor(/* Color while indicator is filled. */)
                    .setIndicatorEmptyColor(/* Color while indicator is empty. */);

  • Set the indicator to the PinView.

      mPinView.setIndicator(builder);

  • Screenshots:

Authentication Success	Authentication Fail

• Circle indicator:

  • Prepare the indicator builder.

     CircleIndicator.Builder builder = new CircleIndicator.Builder(/* PIN view */)
                    .setIndicatorRadius(/* Radius of the cicle */)
                    .setIndicatorFilledColor(/* Color when indicator is filled. */)
                    .setIndicatorStrokeColor(/* Color when indicator is empty. */)
                    .setIndicatorStrokeWidth(/* Thickness of the ring. */);

  • Set the indicator to the PinView.

      mPinView.setIndicator(builder);

  • Screenshots:

Authentication Success	Authentication Fail

---

If you want to make custom indicator visit this guide. 👉 Create custom indicator wiki