اینجا آکادمی نوری هستش! سایت جدید. قراره اینجا کلی باهم بترکونیم. سایت nouri.academy جایگرین nouri.in شده.
برای مشاهده لیست علاقه مندی ها وارد شوید!
مشاهده محصولات فروشگاهبا SparkButton خیلی راحت میتونی ImageView ها رو توی اندروید منفجر کنی?
توسط این کتابخونه میتونی حالت روشن و خاموش شدن رو به ImageView اضافه کنی، اونم همراه با یه انیمیشن خیلی خاااااص و جذاب.
فرض کن وقتی کاربر روی علامت افزودن به علاقه مندی ها کلیک کرد بجا اینکه اون ویو خیلی ساده و یکنواخت عوض بشه مثلا پررنگ بشه، میتونی با یه حالت انفجاری تغییر وضعیت رو به کاربر نشون بدی.
شاید درک کردنش یکم سخت باشه که چطور با حالت انفجاری میشه یک ویو رو تغییر وضعیت داد!
توصیه میکنم حتما دمو این کتابخونه رو ببینی تا متوجه بشی چه کتابخونه خفنیه.
حالا که دمو رو دیدی و متوجه شدی که این چه کتابخونه خفنیه، بهتره بریم سراغ آموزشش?
نسخه کتابخانه | 1.0.6 |
حداقل API پشتیبانی شده | 14 |
ساخته شده با زبان | جاوا |
میزان فشار بر رو منابع سخت افزاری | کم |
برای اینکه بتونی از کتابخونه SparkButton استفاده کنی باید کد زیر رو به فایل build.gradle پروژه اضافه کنی.
implementation 'com.github.varunest:sparkbutton:1.0.6'
علاوه بر کد بالا باید مخزن زیر رو هم به فایل gradle پروژه اضافه کنی.
maven { url "https://jitpack.io" }
سپس باید پروژه رو sync کنی.
حالا کتابخونه به پروژه اضافه شده و میتونی ازش استفاده کنی?.
برای استفاده کردن از این ویو باید کد XML اون رو توی صفحه ای که مد نظرت هست اضافه کنی.
<com.varunest.sparkbutton.SparkButton android:id="@+id/instaLikeBtn" android:layout_width="60dp" android:layout_height="60dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" app:sparkbutton_activeImage="@drawable/heart_on" app:sparkbutton_iconSize="25dp" app:sparkbutton_inActiveImage="@drawable/heart_outline_off" app:sparkbutton_primaryColor="@color/red" app:sparkbutton_secondaryColor="@color/pink" />
برای اینکار من از کد بالا استفاده کردن.
اگر به کد بالا توجه کنی، این کتابخونه یکسری خصوصیت هایی داره که به واسطه اون خصوصیت ها میتونی منو دلخواهت رو درست کنی.
بریم بررسی کنیم و ببینیم که این کتابخونه چه خصوصیت های ویژه ای داره.
توضیحات | نام خصوصیت | مقدار پیشفرض |
اندازه تصاویر | app:sparkbutton_iconSize | 50 |
تصویر مربوط به حالت فعال | app:sparkbutton_activeImage | مقدار پیشفرض ندارد |
تصویر مربوط به حالت غیر فعال | app:sparkbutton_disabledImage | مقدار پیشفرض ندارد |
رنگ اصلی انفجار | app:sparkbutton_primaryColor | مقدار پیشفرض ندارد |
رنگ ثانویه انفجار | app:sparkbutton_secondaryColor | مقدار پیشفرض ندارد |
فعال کردن عملیات کلیک | app:sparkbutton_pressOnTouch | true |
سرعت اجرای انفجار | app:sparkbutton_animationSpeed | 0.50 |
برای استفاده کردن از این کتابخونه، علاوه بر اینکه میتونی کدها رو توی XML قرار بدی، میتونی به روش کاتلین و جاوا هم ویو مدنظرت رو درست کنی.
برای استفاده کردن از این روش میتونی از کدهای زیر با توجه به زبان برنامه نویسی ای دوست داری استفاده کنی.
val button: SparkButton = SparkButtonBuilder(this) .setActiveImage(R.drawable.active_image) .setInActiveImage(R.drawable.inactive_image) .setDisabledImage(R.drawable.disabled_image) .setImageSizePx(resources.getDimensionPixelOffset(R.dimen.button_size)) .setPrimaryColor(ContextCompat.getColor(context, R.color.primary_color)) .setSecondaryColor(ContextCompat.getColor(context, R.color.secondary_color)) .build()
SparkButton button = new SparkButtonBuilder(context) .setActiveImage(R.drawable.active_image) .setInActiveImage(R.drawable.inactive_image) .setDisabledImage(R.drawable.disabled_image) .setImageSizePx(getResources().getDimensionPixelOffset(R.dimen.button_size)) .setPrimaryColor(ContextCompat.getColor(context, R.color.primary_color)) .setSecondaryColor(ContextCompat.getColor(context, R.color.secondary_color)) .build();
برای مدیریت بیشتر روی کتابخونه مثل مدیریت کردن وضعیت های مختلف انیمیشن، سرعت و … میتونی از کدهای زیر استفاده کنی.
برای اینکه بتونی سرعت اجرای انیمیشن رو به صورت داینامیک کنترل کنی از زیر میتونی استفاده کنی.
button.setAnimationSpeed(1.5f)
از کد زیر میتونی برای روشن یا خاموش کردن دکمه به صورت داینامیک استفاده کنی.
button.setChecked(true)
این کد بهت کمک میکنه تا برای وضعیت های مختلف انیمیشن عملیات مختلفی رو درنظر بگیری.
مثلا زمانی که انیمیشن تموم شد یه عملیات خاصی رو اجرا کنه، یا اگه دکمه تغییر وضعیت داد یک عملیات دیگه ای اجرا بشه.
برای اینکار باید از listener ای که در نظر گرفته شده استفاده کنی.
likeButton.setEventListener(object : SparkEventListener{ override fun onEvent(button: ImageView?, buttonState: Boolean) { } override fun onEventAnimationEnd(button: ImageView?, buttonState: Boolean) { } override fun onEventAnimationStart(button: ImageView?, buttonState: Boolean) { } })
button.setEventListener(new SparkEventListener(){ @Override void onEvent(ImageView button, boolean buttonState) { if (buttonState) { // Button is active } else { // Button is inactive } } });
توسط کد زیر هم میتونی اجرای انیمیشن رو کنترل کنی.
مثلا اگه یک اتفاق خاصی افتاد انیمیشن شروع به اجرا شدن بشه.
button.playAnimation()
این کتابخونه واقعا افکت خیلی جذابی داره و طبیعتا نظر کاربر رو خیلی میتونی جلب کنه.
پیشنهاد میکنم از این کتابخونه توی پروژه های خودت استفاده کنی.
توسط محمد نوری
۱۳
شهریورتوسط محمد نوری
۱۲
مردادبا عضویت در خبرنامه نوری آکادمی همیشه بروز باشید. مطمئن باشید که ایمیل شما در اختیار دیگران قرار نمیگیرد
دانلود سریع و آسان
بدون هیچ معطلی دوره را بلافاصله پس از پرداخت دانلود و آموزش را شروع کنید!دوره های فشرده و کاربردی
تمامی دوره های ما بصورت پروژه محور و کاملا کاربردی آموزش داده می شوند...همگام با استاندارد های جهانی
خیالت راحت باشه، آموزشهایی که اینجا قرار میدیم دقیقا منطبق با استانداردهای جهانی هستشدوره های کاملا فارسی
با دیدن دورهها به زبان فارسی، بجای حفظ کردن کدها خیلی راحت میتونی اونارو عمیق یاد بگیریتوی نوری آکادمی کمکت میکنم بتونی وارد حوزه برنامه نویسی موبایل بشی. الان دیگه موبایل از اون حالت لوکس بودن خارج شده و جز وسایل ضروری افزاد به حساب میاد. پس چه بهتر که بتونی اپلیکیشن هایی بنویسی که در دسترس عموم مردم قرار بگیره.خوشحال میشم توی این مسیر با من همراه باشی تا بتونم کمکت کنم.
به امید روزهای بهتر
با خبرنامه نوری آکادمی بهتر و راحت تر در دسترسیم...
از مشخصات شما برای مقاصد تبلیغاتی استفاده نخواهیم کرد.تمامی حقوق مطالب ، دوره ها و محصولات برای مدیریت سایت محفوظ است و کپی برداری پیگرد قانونی دارد.