موقعیت پیمایش فعلی ScrollView را در React Native دریافت کنید

آیا می توان موقعیت پیمایش فعلی یا صفحه فعلی یک مؤلفه را در React Native دریافت کرد؟

بنابراین چیزی مانند:

11 پاسخ 11

در یک زمینه دیگر ، بیایید بگوییم که شما همچنین می خواهید یک شاخص صفحه بندی را پیاده سازی کنید ، می خواهید با این کار بیشتر پیش بروید:

جایی که ScrollX یک مقدار متحرک است که می توانید برای شما در صفحه بندی استفاده کنید و عملکرد دستگیره شما می تواند فرم را بدست آورد:

این همیشه وقتی مقدار پیمایش تغییر می کند ، آتش نمی گیرد. به عنوان مثال ScrollView تغییر یافته است و باعث می شود اکنون همه چیز را روی صفحه نمایش نمایش دهد ، به نظر نمی رسد همیشه یک رویداد Onscroll را به شما می گوید.

ناامیدکننده ، مگر اینکه شما ScrolleventThrottle را به 16 یا پایین تر تنظیم کنید (برای دریافت یک رویداد برای هر فریم) ، هیچ تضمینی وجود ندارد که این گزارش را در قاب نهایی گزارش دهد - به این معنی که برای اطمینان از اینکه شما پس از پیمایش ، جبران سمت راست دارید، شما باید ScrolleventThrottle = را تنظیم کنید و تأثیر عملکرد آن را بپذیرید.

سلب مسئولیت: آنچه در زیر می آید در درجه اول نتیجه آزمایش خودم در React Native 0. 50 است. مستندات ScrollView در حال حاضر بسیاری از اطلاعات تحت پوشش زیر را از دست داده است. به عنوان مثال Onscrollenddrag کاملاً بدون مستند است. از آنجا که همه چیز در اینجا به رفتار بدون مدارک متکی است ، متأسفانه نمی توانم قول بدهم که این اطلاعات یک سال یا حتی یک ماه از هم اکنون صحیح باقی بماند.

همچنین ، همه چیز در زیر یک پیمایش کاملاً عمودی را فرض می کند که جبران Y ما به آن علاقه مند هستیم. در صورت لزوم ، ترجمه به X Offsets ، امیدوارم یک تمرین آسان برای خواننده باشد.

دستگیرندگان مختلف رویداد در یک ScrollView یک رویداد را برگزار می کنند و به شما امکان می دهند موقعیت کنونی کنونی را از طریق Event. NativeEvent.contentOffset. y بدست آورید. برخی از این دستگیره ها رفتار کمی متفاوت بین اندروید و iOS دارند ، همانطور که در زیر شرح داده شده است.

بر امدگی

در اندرویدی

در حالی که کاربر در حال پیمایش است ، هر قاب را آتش می زند ، در هر قاب ، در حالی که نمای پیمایش پس از انتشار کاربر در حال حرکت است ، در قاب نهایی وقتی نمای پیمایش استراحت می کند ، و همچنین هر زمان که افست پیمایش در نتیجه قاب آن تغییر می کنددر حال تغییر (به عنوان مثال به دلیل چرخش از منظره به پرتره).

در iOS

آتش سوزی در حالی که کاربر در حال کشیدن است یا در حالی که نمای پیمایش در حال حرکت است ، در برخی فرکانس تعیین شده توسط ScrolleventThrottle و حداکثر یک بار در هر فریم هنگام ScrolleventThrottle =. اگر کاربر نمای پیمایش را آزاد کند در حالی که حرکت کافی برای سر خوردن دارد ، کنترل کننده Onscroll نیز هنگام استراحت بعد از رفتن به آتش می رود. با این حال ، اگر کاربر در حالی که ثابت است ، نمای پیمایش را بکشید و سپس آن را آزاد کند ، Onscroll تضمین نمی شود که موقعیت نهایی را آتش بزنید مگر اینکه ScrolleventThrottle به گونه ای تنظیم شده باشد که Onscroll هر قاب پیمایش را شلیک کند.

هزینه عملکرد برای تنظیم ScrolleVentThrottle = وجود دارد که می تواند با تنظیم آن به تعداد بیشتری کاهش یابد. با این حال ، این بدان معنی است که Onscroll هر قاب را آتش نمی زند.

onMomentumscrollend

هنگامی که نمای پیمایش پس از پرش متوقف می شود ، آتش سوزی می شود. اگر کاربر نمای پیمایش را آزاد کند در حالی که ثابت است به گونه ای که به گونه ای باشد که از آن سر بخورد ، به هیچ وجه آتش نمی گیرد.

onscrollenddrag

هنگامی که کاربر از کشیدن نمای پیمایش متوقف می شود - بدون توجه به اینکه نمای پیمایش ثابت است یا شروع به سر خوردن می کند.

با توجه به این تفاوت ها در رفتار ، بهترین راه برای پیگیری جبران خسارت به شرایط دقیق شما بستگی دارد. در پیچیده ترین حالت (شما باید از Android و iOS پشتیبانی کنید ، از جمله استفاده از تغییرات در قاب ScrollView به دلیل چرخش ، و شما نمی خواهید مجازات عملکرد را در Android از تنظیم ScrolleventThrottle تا 16 بپذیرید) ، و نیاز دارید. برای رسیدگی به تغییرات در محتوای موجود در نمای پیمایش ، پس از آن یک آشفتگی لعنتی درست است.

ساده ترین مورد این است که اگر فقط نیاز به رسیدگی به اندروید دارید. فقط از Onscroll استفاده کنید:

برای حمایت از iOS ، اگر خوشحال هستید که هر قاب را به آتش سوزی می کنید و پیامدهای عملکرد آن را می پذیرید ، و اگر نیازی به انجام تغییرات قاب ندارید ، فقط کمی پیچیده تر است:

برای کاهش عملکرد سربار در iOS در حالی که هنوز هم تضمین می کنیم هر موقعیتی را که نمای پیمایش در آن تنظیم شده است ، ضبط می کنیم ، می توانیم ScrolleventThrottle را افزایش دهیم و علاوه بر این یک کنترل کننده Onscrollenddrag را نیز فراهم کنیم:

اما اگر می خواهیم تغییرات قاب را کنترل کنیم (به عنوان مثال ، به دلیل اینکه ما به دستگاه می چرخیم ، تغییر ارتفاع موجود برای قاب نمایش پیمایش) و/یا تغییرات محتوا ، پس باید علاوه بر این OnContentSeeChange و OnLayout را پیاده سازی کنیم تا از ارتفاع پیگیری کنیم. از هر دو قاب نمای پیمایش و محتویات آن ، و در نتیجه به طور مداوم حداکثر جبران ممکن و استنباط را محاسبه می کنید که جبران به دلیل تغییر اندازه قاب یا اندازه محتوا به طور خودکار کاهش می یابد:

بله ، بسیار وحشتناک استمن همچنین 100 ٪ مطمئن نیستم که همیشه در مواردی که همزمان اندازه قاب و محتوای نمای پیمایش را تغییر می دهید ، درست کار می کند. اما این بهترین چیزی است که من می توانم با آن روبرو شوم ، و تا زمانی که این ویژگی در خود چارچوب اضافه نشود ، فکر می کنم این بهترین کاری است که هر کسی می تواند انجام دهد.