Swipeable
هي واجهة برمجة تطبيقات Compose Material API تساعدك في إنشاء المكوّنات التي
التمرير سريعًا بين الحالات المنفصلة مثل الأوراق السفلية أو الأدراج أو
مرِّر سريعًا لإغلاقه. لدعم حالات الاستخدام المتقدّمة بشكل أفضل، مثل علامات الارتساء التي
تعتمد على حجم مكون ما، فسيتم نشر عنصر خلفي في
Compose-Foundation 1.6.0-alpha01: AnchoredDraggable
. AnchoredDraggable
هي واجهة برمجة تطبيقات أساسية لإنشاء مكونات قابلة للسحب ذات حالات ثابتة، مثل
كأوراق سفلية أو أدراج أو التمرير سريعًا لإغلاقها.
لقد تم إيقاف واجهات برمجة التطبيقات Swipeable
للمواد لصالح شركة Foundation
AnchoredDraggable
وستتم إزالتها في إصدار مستقبلي. هذا الدليل
يصف كيفية نقل البيانات من واجهات برمجة تطبيقات Swipeable
إلى AnchoredDraggable
.
نقل بيانات SwipeableState
إلى AnchoredDraggableState
ابدأ بتحديد التغييرات التي تطرأ على مالك الحالة. AnchoredDraggableState
لا يمكن اكتسابها من، ويتم تمثيل الإزاحة كـ Float.NaN
قبلها
تهيئة.
تعديل معلومات صاحب الحالة
AnchoredDraggableState
هي فئة أخيرة، وبالتالي لا يمكن اكتسابها.
منهم. إذا كان المكوِّن الحالي مكتسبًا من SwipeableState
، عليك تحديثه.
أن تحتفظ مالك الدولة بالإشارة إلى AnchoredDraggableState
بدلاً من
الاكتساب منه:
قابلة للتمرير السريع
class MySwitchState: SwipeableState()
قابل للسحب
class MySwitchState {
private val anchoredDraggableState = AnchoredDraggableState(...)
}
بما أنّ صاحب الولاية لم يعُد يكتسب من SwipeableState
بعد الآن، يمكنك
أن تعرض واجهات برمجة التطبيقات بنفسك. تشمل واجهات برمجة التطبيقات الأكثر شيوعًا التي يمكنك استخدامها
offset
وprogress
وcurrentValue
وtargetValue
.
الوصول إلى المحتوى المقابل
على عكس Swipeable
، يقع offset
لـ AnchoredDraggableState
قبل Float.NaN
.
يتم إعداده. في AnchoredDraggable
، يمكن تمرير علامات الارتساء إلى
الدالة الإنشائية لـ AnchoredDraggableState
أو تم تحديثها من خلال
AnchoredDraggableState#updateAnchors
تمرير علامات الارتساء إلى
تعمل الدالة الإنشائية لـ AnchoredDraggableState
على تهيئة الإزاحة على الفور.
إذا كانت الإعلانات الثابتة تعتمد على التنسيق أو قد تتغير، استخدم
AnchoredDraggableState#updateAnchors
لتجنب إعادة إنشاء الحالة عند
تتغير علامات الارتساء.
في حال استخدام updateAnchors
، ستكون الإزاحة Float.NaN
قبل اجتياز
علامات ارتساء لـ updateAnchors
. لتجنُّب تمرير Float.NaN
عن طريق الخطأ إلى
المكونات، يمكنك استخدام AnchoredDraggableState#requireOffset
لطلب
تمت تهيئة الإزاحة عند قراءتها. يساعدك هذا في اكتشاف
التناقضات أو الأخطاء المحتملة في وقت مبكر.
@Composable
fun AnchoredDraggableBox() {
val state = remember { AnchoredDraggableState(...) }
val density = LocalDensity.current
val anchors = remember { DraggableAnchors { ... } }
SideEffect {
state.updateAnchors(anchors)
}
Box(
Modifier.offset { IntOffset(x = state.requireOffset(), y = 0) }
}
}
نقل بيانات Modifier.swipeable
إلى Modifier.anchoredDraggable
Modifier.anchoredDraggable()
يحل محل Modifier.swipeable
. بعض الإشعارات
تم نقل من معلمات Modifier.swipeable()
إلى AnchoredDraggableState
مباشرةً، كما هو موضَّح في الأقسام التالية
تحديد علامات الارتساء
حدِّد علامات الارتساء باستخدام طريقة أداة إنشاء DraggableAnchors
. بعد ذلك، اجتَز
إلى AnchoredDraggableState#updateAnchors
أو AnchoredDraggableState
الدالة الإنشائية:
المنشئ
enum class DragValue { Start, Center, End }
@Composable
fun AnchoredDraggableBox() {
val anchors = DraggableAnchors {
Start at -100.dp.toPx()
Center at 0f
End at 100.dp.toPx()
}
val state = remember {
AnchoredDraggableState(anchors = anchors)
}
Box(
Modifier.offset { IntOffset(x = state.requireOffset(), y = 0) }
)
}
تحديث Anchors
enum class DragValue { Start, Center, End }
@Composable
fun AnchoredDraggableBox() {
val state = remember { AnchoredDraggableState(...) }
val density = LocalDensity.current
val anchors = with (density) {
DraggableAnchors {
Start at -100.dp.toPx()
Center at 0f
End at 100.dp.toPx()
}
}
SideEffect {
state.updateAnchors(anchors)
}
Box(
Modifier.offset { IntOffset(x = state.requireOffset(), y = 0) }
)
}
إذا كانت علامات الارتساء ثابتة، فقم بتمريرها إلى الدالة الإنشائية. إذا كانت تعتمد على
أو ليست ثابتة، استخدِم updateAnchors
.
تحديد حدود موضعية
تم تغيير نوع معلَمة الحدود واسمها. بدلاً من
واجهة ThresholdConfig
منفصلة، AnchoredDraggableState
يحتوي على
المعلمة positionalThreshold
التي تأخذ دالة lambda التي تُرجع
موضع نقطة البداية. على سبيل المثال، يمكن التعبير عن الحد الأدنى لموضع الإعلان بنسبة 50%
يتم التعبير عنه على النحو التالي:
val anchoredDraggableState = AnchoredDraggableState(
positionalThreshold = { distance -> distance * 0.5f },
...
)
يمكن التعبير عن الحد الأدنى لموضع الإعلان بقيمة 56dp
على النحو التالي:
val density = LocalDensity.current
val anchoredDraggableState = AnchoredDraggableState(
positionalThreshold = { with(density) { 56.dp.toPx() } },
...
)
تعريف حدود السرعة
يتم أيضًا تمرير حدود السرعة إلى الدالة الإنشائية AnchoredDraggableState
،
ويتم التعبير عنه أيضًا باستخدام lambda:
val density = LocalDensity.current
val anchoredDraggableState = AnchoredDraggableState(
velocityThreshold = { with(density) { 125.dp.toPx() } },
...
)
التغييرات على مساحة عرض واجهة برمجة التطبيقات
يمكنك الاطّلاع أدناه على نظرة عامة حول التغييرات التي تطرأ على مساحة واجهة برمجة التطبيقات.
AnchoredDraggableState
|
|
---|---|
|
|
|
|
|
|
|
|
|
|
|
لا ينطبق |
|
|
|
|
|
|
|
|
|
|
|
Modifier.anchoredDraggable
|
|
---|---|
|
|
|
|
|
|
|
|
|
|
|
|
|
تم الانتقال إلى دالة الإنشاء |
|
هذا الحساب غير متوافق حاليًا. يمكنك الانتقال إلى b/288084801 للاطّلاع على أحدث حالة. |
|
تم التمرير إلى الدالة الإنشائية |