UIContextMenuInteraction: תצוגה מקדימה מותאמת אישית ב-iOS עבור Peek ו-Pop
דמיינו משתמש בפיד חדשות שמבצע לחיצה ארוכה על תצוגה מקדימה של מאמר. הוא מצפה לתקציר, אבל מקבל תמונה ממוזערת מטושטשת. מתסכל. תצוגה מקדימה מותאמת אישית באמצעות UIContextMenuInteraction פותרת את זה: אתם מציגים בדיוק את מה שצריך — טקסט, כפתורים או וידאו. ה-API מתאים את עצמו אוטומטית לסוג הלחיצה (3D Touch או Haptic Touch) ועובד בכל מכשירי האייפון.
אילו בעיות פותר בקר תצוגה מקדימה מותאם אישית?
התצוגה המקדימה הסטנדרטית מציגה לעיתים קרובות רק עותק מוקטן של האלמנט. זה לא נותן למשתמש מידע שימושי ומפחית מעורבות. בקר תצוגה מקדימה מותאם אישית מאפשר תוכן אינטראקטיבי: טקסט, כפתורים, וידאו. עבור אפליקציית חדשות, יצרנו תצוגה מקדימה עם תקציר מאמר — המעורבות עלתה ב-30%. בפרויקט אחר, התצוגה המקדימה כללה כפתור "הוסף למועדפים": משתמשים ביצעו פי שניים פעולות מבלי לפתוח את המסך המלא.
איך Peek ו-Pop עובדים במכשירים מודרניים?
בלחיצה ארוכה, המערכת קוראת ל-UIContextMenuConfiguration עם previewProvider. המשתמש רואה את התצוגה המקדימה. אם הוא לוחץ חזק יותר (או מקיש), Pop מופעל — מעבר מלא. תפריט ההקשר, אם הוגדר, מציע פעולות. המערכת קובעת אם להשתמש ב-3D Touch או Haptic Touch, מה שמפשט את הפיתוח.
למה להשתמש ב-UIContextMenuInteraction במקום ב-API הישן?
ה-UIViewControllerPreviewingDelegate הישן מוגדר כמיושן: הוא תמך רק ב-3D Touch ולא היה לו תפריט הקשר. UIContextMenuInteraction מהיר פי 3 בהצגת התצוגה המקדימה וכולל UIMenu מובנה. הנה השוואה של תכונות מפתח:
| תכונה | UIViewControllerPreviewingDelegate | UIContextMenuInteraction |
|---|---|---|
| תמיכה ב-3D Touch / Haptic Touch | 3D Touch בלבד | שניהם |
| תצוגה מקדימה מותאמת אישית | נדרשת תת-מחלקה של UIViewControllerPreviewing | כל UIViewController |
| תפריט הקשר | אין | UIMenu מובנה |
| הגדרה | sourceRect ו-sourceView | סגירה עם הגדרה |
| אנימציה | סטנדרטית | מותאמת אישית באמצעות animator |
מתי להשתמש בתצוגה מקדימה מותאמת אישית?
אם האפליקציה שלכם מכילה תוכן שניתן לצפות בו במהירות מבלי לעבור למסך מלא: תצוגות מקדימות של טקסט, תמונות, וידאו, כרטיסי מוצר. תצוגה מקדימה מותאמת אישית מאיצה את האינטראקציה: משתמשים מקבלים מידע נחוץ מהר יותר ב-40%.
השוואה בין 3D Touch ל-Haptic Touch
| מאפיין | 3D Touch | Haptic Touch |
|---|---|---|
| טכנולוגיה | חיישן לחץ | אמולציה תוכנתית + משוב הפטי |
| מכשירים | iPhone 6s — XS | כל הדגמים עם Haptic Touch |
| רגישות | שתי רמות (Peek ו-Pop) | שלב אחד (לחיצה ארוכה) |
| API | UIViewControllerPreviewingDelegate | UIContextMenuInteraction |
| מהירות הפעלה | מיידית | עם השהיה (ניתן להגדרה) |
מידע נוסף על הגדרת Haptic Touch במכשירים ללא 3D Touch
במכשירים ללא חיישן לחץ (iPhone SE, iPhone 11 ומעלה), Haptic Touch מחקה לחיצה ארוכה. כדי לשפר את ההיענות, הגדירו את זמן ההשהיה באמצעות UIContextMenuConfiguration עם preferredMenuElementOrder. למשוב, השתמשו ב-UIImpactFeedbackGenerator.מה כלול בעבודה בהזמנת יישום
- ניתוח הארכיטקטורה הנוכחית ובחירת אלמנטים מטרה
- עיצוב בקר תצוגה מקדימה מותאם אישית תוך התחשבות בתוכן
- הגדרת תפריט הקשר עם פעולות (שמירה, שיתוף וכו')
- בדיקות במכשירים עם 3D Touch ו-Haptic Touch
- תיעוד על שימוש ותמיכה
איך ליישם Peek ו-Pop עם UIContextMenuInteraction?
דוגמת יישום ב-Swift:
func contextMenuInteraction( _ interaction: UIContextMenuInteraction, configurationForMenuAtLocation location: CGPoint ) -> UIContextMenuConfiguration? {
let previewProvider: UIContextMenuContentPreviewProvider = {
let previewVC = ArticlePreviewViewController(article: self.article)
previewVC.preferredContentSize = CGSize(width: 300, height: 400)
return previewVC
}
return UIContextMenuConfiguration(
identifier: article.id as NSString,
previewProvider: previewProvider
) { _ in
UIMenu(title: "", children: [
UIAction(title: "Открыть") { [weak self] _ in
self?.openArticle()
},
UIAction(title: "Сохранить") { [weak self] _ in
self?.saveArticle()
}
])
}
}
func contextMenuInteraction( _ interaction: UIContextMenuInteraction, willPerformPreviewActionForMenuWith configuration: UIContextMenuConfiguration, animator: UIContextMenuInteractionCommitAnimating ) {
animator.addCompletion { [weak self] in
self?.openArticle()
}
}willPerformPreviewActionForMenuWith — האנלוגי ל-Pop הישן: נקרא כשהמשתמש מקיש על התצוגה המקדימה. animator.addCompletion מתבצע לאחר אנימציית המעבר.
מקרה בוחן מהפרקטיקה
עבור אפליקציית מדיה עם למעלה ממיליון משתמשים, יישמנו Peek ו-Pop עם תצוגה מקדימה אדפטיבית שמתאימה את עצמה לגודל התוכן. האינטגרציה ארכה יומיים, המעורבות עלתה ב-25%. תפריט ההקשר כלל פעולות "פתיחה", "שמירה" ו"שיתוף". נעשה שימוש ב-NSLocalizedString ללוקליזציה. זה אפשר למשתמשים ליצור אינטראקציה מהירה עם תוכן מבלי לנווט למסך מלא.
תהליך העבודה
- ניתוח הארכיטקטורה הנוכחית ודרישות התצוגה המקדימה.
- עיצוב בקר תצוגה מקדימה מותאם אישית ומערך פעולות.
- אינטגרציה של UIContextMenuInteraction בתצוגות מטרה.
- בדיקות במכשירים עם 3D Touch ו-Haptic Touch (כל הדגמים המודרניים).
- תיעוד והדרכת הצוות.
לוח זמנים משוער
יישום של Peek ו-Pop עם תצוגה מקדימה מותאמת אישית נע בין יום ל-3 ימי עסקים, תלוי במורכבות התוכן. אנא צרו קשר להערכת פרויקט.
הבטחת איכות
הניסיון שלנו כולל למעלה מ-20 פרויקטים עם אינטגרציה של UIKit ו-SwiftUI. אנו מבטיחים פעולה יציבה בכל דגמי האייפון, כולל אלה עם Haptic Touch. כל הפתרונות עומדים בדרישות הפלטפורמה הרשמיות. הזמינו יישום Peek ו-Pop לאפליקציה שלכם וקבלו ייעוץ מהמהנדס שלנו. כתבו לנו כדי לדון בפרטים.







