snap کردن recycler view با استفاده از snaphelper در اندروید

snap کردن recycler view با استفاده از snaphelper در اندرویدReviewed by مهرخ on Nov 10Rating: 5.0snap کردن recycler view با استفاده از snaphelper در اندرویددراین پست به شما نشان میدهم که چگونه از این دو کلاس استفاده کنید و snaper recyclerview بسازید.

نکات اندرویدی: snap کردن recycler view با استفاده از snaphelper

همانطور که دربرنامه های گوگل پلی دیده اید اولین آیتم قسمت چپ لیست افقی با اسکرول شدن صفحه توسط کاربر به صورت کامل نمایش داده می شود:

snap کردن recycler view با استفاده از snaphelper

ترکیب بندی پروژه

به فرایند ساخت لیست ویو با استفاده از recyclerview، snapping می گوییم که بعد از اسکرول کردن میتوانیم آیتم ها را به وسط، چپ، راست، بالا وپایین اسنپ کنیم. کتابخانه ی design support library  در ورژن ۲۴٫۲٫۰ دو کلاس (SnapHelper و LinearSnapHelper ) را معرفی کرد که برای تنظیم اسنپ در recyclerview استفاده می شوند.

دراین پست به شما نشان میدهم که چگونه از این دو کلاس استفاده کنید و snaper recyclerview  بسازید.

قبل از کد زدن مطمئن شوید که از buildToolsVersion “24.0.2” وupport library version  ورژن ۲۴٫۲٫۰  برای این پروژه استفاده می کنید.

بعد از اضافه کردن dependency های ضروری اپلیکیشن build.gradle شما به صورت زیر خواهد شد:

build.gradle

ساخت snapping recyclerview در قسمت وسط

فرض کنید این ارایش را برای activity اصلی داریم (فقط شامل RecyclerView می شود.)

activity_main.xml

الان اگر در کد جاوا، LinearSnapHelper پیش فرض را داشته باشید میتوانید فقط قسمت وسط را اسنپ کنید. کد زیر تنها کدی است که به ان نیاز داریم:

MainActivity.java

و این کد برای main activity ما کامل است:

MainActivity.java

بعد از اجرا، نتیجه نهایی مانند عکس زیر می شود.

آپشن های دیگر snapping

برای تکرار شدن رفتارها (beaaavior) گوگل پلی باید متد های calculateDistanceToFinalSnap() و findSnapView() رااز LinearSnapHelper حذف کنیم تا استارت ویو را پیدا کنیم و فاصله ی مورد نیاز تا موقعیت درست اسنپ را محاسبه کنیم. برای راحت تر شدن کار من یک کلاس GravitySnapHelper که اسنپ را در چهار جهت (start, top, end, bottom) پشتیبانی می کند:

GravitySnapHelper.java

اگر میخواهید این عمل دقیقا مانند برنامه های گوگل پلی باشد باید کد های قبلی را در onCreate()  و MainActivity تغییر دهید.

نتیجه نهایی مانند تصویر زیر است:

main activity

برای اسنپ کردن به سمت راست به جای کد بالایی از کد زیر استفاده کنید:

نتیجه نهایی مانند عکس زیر می شود:

snapping

علاوه بر این با ترکیب این کد با جهت LinearLayoutManager اسنپ به سمت بالا و پایین به دست می اید:

صفحه نهایی اسنپ به سمت بالا

صفحه نهاییsnap

صفحه نهایی اسنپ به سمت پایین

عکس نهایی snap

نتیجه گیری:

تا الان اسنپ کردن RecyclerView را در چهار جهت به شما یاد دادم. Design support library  همیشه  در گوگل پلی به روز رسانی می شود و جدیدا گزینه ی جدیدی به ان اضافه شده است که با آن میتوانید ui زیبا و ux با کارکرد خیلی خوب داشته باشید. امید وارم که این پست اطلاعات جدیدی در رابطه با RecyclerView و طرااحی متریال به شما داده باشد.ش

پاسخ دهید