آموزش ایجاد pattern در برنامه نویسی اندروید

سلام دوستان در این سری از آموزش برنامه نویسی اندروید به آموزش ایجاد pattern در برنامه نویسی اندروید می پردازیم منظور از pattern همان الگو قفل گوشی می باشد در ادامه می توانید پیش نمایشی از آن را مشاهده کنید.

این کتاب خانه به خاطر طراحی فوق العاده زیبا برنده چندین جایزه نیز شده است.همانطور که مشاهده می کنید بسیار متریال دیزاین است.
برای استفاده از این کتاب خانه مثل همیشه باید عمل کنید.
ابتدا باید وارد فایل Build.gradle شده از نوع module سپس در بخش dependencies خط زیر را اضافه کنید.

    compile 'com.andrognito.patternlockview:patternlockview:1.0.0'

1	compile 'com.andrognito.patternlockview:patternlockview:1.0.0'

پروژه را sync کنید.
برای استفاده از آن می توانید همانند زیر عمل کنید.
ابتدا وارد layout خودتان شده و کد زیر را در آن قرار دهید.

 <com.andrognito.patternlockview.PatternLockView
        android:id="@+id/pattern_lock_view"
        android:layout_width="280dp"
        android:layout_height="280dp"/>

<com.andrognito.patternlockview.PatternLockView

android:id="@+id/pattern_lock_view"

android:layout_width="280dp"

android:layout_height="280dp"/>

سپس کد زیر را در اکتیویتی خودتان قرار دهید.

mPatternLockView = (PatternLockView) findViewById(R.id.pattern_lock_view);
mPatternLockView.addPatternLockListener(mPatternLockViewListener);
private PatternLockViewListener mPatternLockViewListener = new PatternLockViewListener() {
        @Override
        public void onStarted() {
            Log.d(getClass().getName(), "Pattern drawing started");
        }
        @Override
        public void onProgress(List<PatternLockView.Dot> progressPattern) {
            Log.d(getClass().getName(), "Pattern progress: " +
                    PatternLockUtils.patternToString(mPatternLockView, progressPattern));
        }
        @Override
        public void onComplete(List<PatternLockView.Dot> pattern) {
            Log.d(getClass().getName(), "Pattern complete: " +
                    PatternLockUtils.patternToString(mPatternLockView, pattern));
        }
        @Override
        public void onCleared() {
            Log.d(getClass().getName(), "Pattern has been cleared");
        }
    };

mPatternLockView = (PatternLockView) findViewById(R.id.pattern_lock_view);

mPatternLockView.addPatternLockListener(mPatternLockViewListener);

private PatternLockViewListener mPatternLockViewListener = new PatternLockViewListener() {

@Override

public void onStarted() {

Log.d(getClass().getName(), "Pattern drawing started");

}

@Override

public void onProgress(List<PatternLockView.Dot> progressPattern) {

Log.d(getClass().getName(), "Pattern progress: " +

PatternLockUtils.patternToString(mPatternLockView, progressPattern));

}

@Override

public void onComplete(List<PatternLockView.Dot> pattern) {

Log.d(getClass().getName(), "Pattern complete: " +

PatternLockUtils.patternToString(mPatternLockView, pattern));

}

@Override

public void onCleared() {

Log.d(getClass().getName(), "Pattern has been cleared");

}

};

در بالا برای pattern یک لیستنر تعریف کردیم که در حالت های مختلف آن را بررسی کنیم
اولین void ما بررسی می کند که کاربر شروع به کشیدن کرده است .
void دوم که خیلی برای ما مهم هستش اون پترن را برای ما برمی گرداند البته پترن را به صورت کامل برنمی گرداند.
void سوم ما باید این مقدار را در متغیری ذخیره کنیم تا سپس بعدا آن را بررسی کنیم چون در اولین بار که این اکتیویتی نمایش داده می شود شما باید این مقدار را ذخیره کنید سپس در دفعه بعد باید این مقدا رو رو با patern جدیدی که کاربر کشیده است مطابقت دهید.
و اخرین void هم در صورتی که pattern به درستی کشیده نشود انتفاق می افتد.
سفارشی سازی آن

  app:dotCount="3"
  app:dotNormalSize="12dp"
  app:dotSelectedSize="24dp"
  app:pathWidth="4dp"                                     // Change the width of the path
  app:normalStateColor="@color/white"                     // Set the color of the pattern view in normal state
  app:correctStateColor="@color/primary"                  // Set the color of the pattern view in correct state
  app:wrongStateColor="@color/pomegranate"                // Set the color of the pattern view in error state
  app:dotAnimationDuration="200"                          // Change the duration of the animating dots
  app:pathEndAnimationDuration="100"                      // Change the duration of the path end animaiton

app:dotCount="3"

app:dotNormalSize="12dp"

app:dotSelectedSize="24dp"

app:pathWidth="4dp" // Change the width of the path

app:normalStateColor="@color/white" // Set the color of the pattern view in normal state

app:correctStateColor="@color/primary" // Set the color of the pattern view in correct state

app:wrongStateColor="@color/pomegranate" // Set the color of the pattern view in error state

app:dotAnimationDuration="200" // Change the duration of the animating dots

app:pathEndAnimationDuration="100" // Change the duration of the path end animaiton

app:dotCount : تعداد نقطه های هر ستون را مشخص می کند.
app:dotNormalSize : اندازه هر نقطه را تغییر میدهد.
app:dotSelectedSize : اندازه هر نقطه را بعد از انتخاب شدن تنظیم می کند.
app:pathWidth : اندازه مسیر خط را تنظیم می کند.
app:normalStateColor : رنگ نقطه قبل از انتخاب
app:correctStateColor : در صورتی که دست باشد pattern این رنگ نمایش داده می شود.
app:wrongStateColor : در صورتی که pattern اشتباه باشد رنگ آن را تنظیم می کند.
app:dotAnimationDuration : مقدار زمانی انیمیشن هر نقطه را تعیین می کند.
app:pathEndAnimationDuration : مقدار زمانی انیمیشن مسیر خط را تعیین می کند.

این آموزش هم به پایان رسید.

موفق و موید باشید.

مطالعه بیشتر