ניתן להתאים אישית ווידג'טים של העברה על ידי הגדרת הצבעים, עיצוב הלחצנים, הטקסט והתמונה הממוזערת ועל ידי בחירת סוגי הלחצנים להצגה.
התאמה אישית של העיצוב של הווידג'ט
הווידג'טים של Cast framework תומכים ב-Apple UIמראה פרוטוקול ב-UIKit כדי לשנות את מראה הווידג'טים באפליקציה, למשל את המיקום או הגבול של לחצן. השתמשו בפרוטוקול הזה כדי לעצב את הווידג'טים של מסגרת Cast כך שיתאימו לעיצוב קיים של אפליקציות.
דוגמה ללחצן 'העברה'
GCKUICastButton.appearance().tintColor = UIColor.gray
[GCKUICastButton appearance].tintColor = [UIColor grayColor];
התאמה אישית של הווידג'ט ישירות
התאמה אישית של ווידג'ט ישירות באמצעות המאפיינים של מחלקת העל שלו. לדוגמה, נהוג להתאים אישית את הצבע GCKUICastButton
באמצעות המאפיין tintColor:
.
דוגמה ללחצן 'העברה'
castButton.tintColor = UIColor.gray
castButton.tintColor = [UIColor grayColor];
בחירת לחצני הבקר
מחלקת הבקר המורחב (GCKUIExpandedMediaControlsViewController
) ומחלקת המיני של הבקר (GCKUIMiniMediaControlsViewController
) כוללות סרגל לחצנים, והלקוחות יכולים להגדיר אילו לחצנים יופיעו בסרגלים האלה. אפשר לעשות את זה כששני המחלקות עומדים בתנאים של GCKUIMediaButtonBarProtocol
.
בסרגל המיני-בקר יש 3 חריצים הניתנים להגדרה ללחצנים:
SLOT SLOT SLOT
1 2 3
בסרגל הפקדים המורחב יש לחצן החלפת מצב קבוע באמצע הסרגל ו-4 חריצים שניתנים להגדרה:
SLOT SLOT PLAY/PAUSE SLOT SLOT
1 2 BUTTON 3 4
אפשר להציג באפליקציה הפניה לשלט הרחוק המורחב
במאפיין -[defaultExpandedMediaControlsViewController]
של
GCKCastContext
וליצור בקר מיני באמצעות
-[createMiniMediaControlsViewController]
.
כל יחידת קיבולת יכולה להכיל לחצן framework או לחצן מותאם אישית, או להיות ריקה. רשימת הלחצנים של בקרות ה-framework מוגדרת כך:
סוג לחצן | התיאור |
---|---|
GCKUIMediaButtonTypeNone |
אין להציב לחצן ביחידת הקיבולת (Slot) הזו |
GCKUIMediaButtonTypeCustom |
לחצן בהתאמה אישית |
GCKUIMediaButtonTypePlayPauseToggle |
מעבר בין הפעלה להשהיה |
GCKUIMediaButtonTypeSkipPrevious |
דילוג לפריט הקודם בתור |
GCKUIMediaButtonTypeSkipNext |
דילוג לפריט הבא בתור |
GCKUIMediaButtonTypeRewind30Seconds |
הרצת ההפעלה 30 שניות אחורה |
GCKUIMediaButtonTypeForward30Seconds |
דילוג 30 שניות קדימה של ההפעלה |
GCKUIMediaButtonTypeMuteToggle |
השתקה וביטול ההשתקה של המקבל המרוחק |
GCKUIMediaButtonTypeClosedCaptions |
נפתחת תיבת דו-שיח לבחירת טראקים של טקסט ואודיו |
אפשר למצוא תיאורים מפורטים של הפעולות של כל לחצן ב-GCKUIMediaButtonBarProtocol.h
מוסיפים לחצן באופן הבא באמצעות שיטות ב-GCKUIMediaButtonBarProtocol
:
כדי להוסיף לחצן של framework לסרגל, נדרשת רק קריאה ל-
-[setButtonType:atIndex:]
.כדי להוסיף לחצן מותאם אישית לסרגל, האפליקציה צריכה להפעיל את
-[setButtonType:atIndex:]
כאשרbuttonType
מוגדר ל-GCKUIMediaButtonTypeCustom
, ולאחר מכן להפעיל את-[setCustomButton:atIndex:]
כדי להעביר אתUIButton
עם אותו אינדקס.
החלת סגנונות מותאמים אישית באפליקציה ל-iOS
באמצעות Cast iOS SDK ניתן לעצב את הגופן, הצבע והתמונות של רכיבי ממשק המשתמש של רכיבי הווידג'טים שמוגדרים כברירת מחדל בשולח של iOS, וכך להעניק לתצוגות מראה ותחושה שתואמים לשאר חלקי האפליקציה.
בקטע הבא מוסבר איך להחיל סגנונות מותאמים אישית על כל אחד מהווידג'טים של Cast או קבוצת ווידג'טים.
החלת סגנון על רכיב בממשק משתמש של ווידג'ט
בתהליך הזה אנחנו משתמשים בדוגמה להגדרת צבע הטקסט בגוף המיני-בקר של האפליקציה לאדום.
מעיינים בטבלת התצוגות והסגנונות, כדי למצוא את שם התצוגה של הווידג'ט או של קבוצת הווידג'טים שרוצים לעצב. שמות הקבוצות מסומנים ב-▼.
דוגמה: תצוגת ווידג'ט אחת (
miniController
)ברשימת המאפיינים במחלקת הסגנון המתאימה, מופיעה בטבלה הזו שמות המאפיינים שרוצים לשנות.
לדוגמה:
bodyTextColor
הוא נכס של המחלקהGCKUIStyleAttributesMiniController
.כותבים את הקוד.
דוגמה:
// Get the shared instance of GCKUIStyle let castStyle = GCKUIStyle.sharedInstance() // Set the property of the desired cast widget. castStyle.castViews.mediaControl.miniController.bodyTextColor = UIColor.red // Refresh all currently visible views with the assigned styles. castStyle.apply()
// Get the shared instance of GCKUIStyle. GCKUIStyle *castStyle = [GCKUIStyle sharedInstance]; // Set the property of the desired cast widget. castStyle.castViews.mediaControl.miniController.bodyTextColor = [UIColor redColor]; // Refresh all currently visible views with the assigned styles. [castStyle applyStyle];
השתמשו בדפוס הזה כדי להחיל כל סגנון על כל רכיב בממשק המשתמש של ווידג'ט כלשהו.
טבלה של תצוגות וסגנונות
טבלה זו מציגה את שבע תצוגות הווידג'ט ושלוש קבוצות (מסומנות ב-▼) שניתן להחיל עליהן סגנונות.
שם התצוגה | תיאור | סיווג סגנון |
---|---|---|
▼ castViews |
קבוצה | GCKUIStyleAttributesCastViews |
▼ deviceControl |
קבוצה | GCKUIStyleAttributesDeviceControl |
deviceChooser |
ווידג'ט | GCKUIStyleAttributesDeviceChooser |
noDevicesAvailableController |
ווידג'ט | GCKUIStyleAttributesNoDevicesAvailableController |
▼ connectionController |
קבוצה | GCKUIStyleAttributesConnectionController |
navigation |
ווידג'ט | GCKUIStyleAttributesConnectionNavigation |
toolbar |
ווידג'ט | GCKUIStyleAttributesConnectionToolbar |
▼ mediaControl |
קבוצה | GCKUIStyleAttributesMediaControl |
miniController |
ווידג'ט | GCKUIStyleAttributesMiniController |
expandedController |
ווידג'ט | GCKUIStyleAttributesExpandedController |
trackSelector |
ווידג'ט | GCKUIStyleAttributesTrackSelector |
instructions |
ווידג'ט | GCKUIStyleAttributesInstructions |
היררכיית סגנונות
ה-singleton GCKUIStyle
הוא נקודת הכניסה ל-API לכל הגדרות הסגנון. יש לו את המאפיין castViews
, שהוא השורש של היררכיית הסגנונות, כמו שמוצג בהמשך. התרשים הזה הוא דרך שונה לבחון את אותן התצוגות והקבוצות שהוצגו בטבלה הקודמת.
אפשר להחיל עיצוב על ווידג'ט מסוים או על קבוצת ווידג'טים. היררכיית הסגנונות כוללת שלוש קבוצות ווידג'טים: castViews , deviceControl ו-mediaControl. המלבן של כל קבוצה תוחם את הווידג'טים שלה. אם מחילים סגנון על קבוצה, הוא יחול על כל הווידג'טים בקבוצה.
לדוגמה, הקבוצה castViews
מאפשרת להחיל סגנון על כל הווידג'טים, והקבוצה deviceControl
מאפשרת להחיל סגנון רק על שלושת הווידג'טים של בקרת המכשיר. הווידג'ט instructions
לא שייך לאף קבוצה.
castViews | ||||||||||
deviceControl | mediaControl | |||||||||
הוראות |
מכשיר בוחר |
המסך noDevicesAvailable |
חיבור בקר |
mini בקר |
מורחב בקר |
טראק בורר |
||||
ניווט / סרגל כלים |
||||||||||
הערת שוליים: שמות הווידג'טים בתרשים הזה שמוצגים בשתי שורות צריכים להיכתב בקוד כמילה אחת, בשורה אחת ללא רווחים. לדוגמה, צריך לכתוב את device Chooser
deviceChooser
. אפשר להעביר את העכבר מעל תמונות כדי להגדיל אותן.