自訂 iOS 寄件者使用者介面

如要自訂 Cast 小工具,您可以調整顏色、設定按鈕、文字和縮圖的樣式,以及選擇要顯示的按鈕類型。

自訂小工具主題

Cast 架構小工具支援 UIKit 中的 Apple UIAppearance 通訊協定,可變更小工具在應用程式中的外觀,例如按鈕的位置或框線。請使用這個通訊協定設定 Cast 架構小工具的樣式,以與現有的應用程式樣式保持一致。

投放按鈕範例

快速滑動
GCKUICastButton.appearance().tintColor = UIColor.gray
Objective-C
[GCKUICastButton appearance].tintColor = [UIColor grayColor];

直接自訂小工具

直接使用父類別的屬性來自訂小工具。舉例來說,使用 tintColor: 屬性自訂 GCKUICastButton 顏色是很常見的做法。

投放按鈕範例

快速滑動
castButton.tintColor = UIColor.gray
Objective-C
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

應用程式可透過 GCKCastContext-[defaultExpandedMediaControlsViewController] 屬性取得擴充控制器的參照,並使用 -[createMiniMediaControlsViewController] 建立迷你控制器。

每個運算單元都可以包含架構按鈕、自訂按鈕或空白。架構控制項按鈕的清單定義如下:

按鈕類型 說明
GCKUIMediaButtonTypeNone 不要在這個版位放置按鈕
GCKUIMediaButtonTypeCustom 自訂按鈕
GCKUIMediaButtonTypePlayPauseToggle 在播放與暫停播放之間切換
GCKUIMediaButtonTypeSkipPrevious 跳至佇列中的上一個項目
GCKUIMediaButtonTypeSkipNext 跳至佇列中的下一個項目
GCKUIMediaButtonTypeRewind30Seconds 倒轉影片播放 30 秒
GCKUIMediaButtonTypeForward30Seconds 快轉播放 30 秒
GCKUIMediaButtonTypeMuteToggle 將遠端網路接收器設為靜音及取消靜音
GCKUIMediaButtonTypeClosedCaptions 開啟對話方塊來選取文字和音軌

如需各按鈕用途的詳細說明,請參閱 GCKUIMediaButtonBarProtocol.h

使用 GCKUIMediaButtonBarProtocol 上的方法新增按鈕:

  • 如要在架構列中新增架構按鈕,只需呼叫 -[setButtonType:atIndex:]

  • 如要在自訂列中新增自訂按鈕,應用程式必須呼叫 buttonType 設為 GCKUIMediaButtonTypeCustom-[setButtonType:atIndex:],然後呼叫 -[setCustomButton:atIndex:] 並傳遞相同索引的 UIButton

將自訂樣式套用到 iOS 應用程式

Cast iOS SDK 可讓您為 iOS 寄件者中預設小工具的 UI 元素,設定字型、顏色和圖片的樣式。

下一節將說明如何將自訂樣式套用到任何 Cast 小工具或小工具群組。

將樣式套用至小工具的 UI 元素

這個程序使用範例,將應用程式迷你控制器的內文文字顏色設定為紅色。

  1. 查看檢視畫面和樣式表格,找出您想要設定樣式的小工具或小工具群組。群組名稱會以 ▼ 標示。

    範例:miniController 小工具檢視畫面

  2. 從下表所列對應樣式類別中的屬性清單中,找到您想變更的屬性名稱。

    範例:bodyTextColorGCKUIStyleAttributesMiniController 類別的屬性。

  3. 撰寫程式碼。

    例子:

Swift
// 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()
Objective-C
// 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];

使用此模式,可將任何樣式套用至任何小工具的任何 UI 元素。

檢視區塊和樣式表格

這個表格顯示七個小工具檢視畫面和三個可套用樣式的群組 (以 ▼ 標示)。

檢視表名稱 類型 樣式類別
castViews 群組 GCKUIStyleAttributesCastView
deviceControl 群組 GCKUIStyleAttributesDeviceControl
deviceChooser Widget GCKUIStyleAttributesDeviceChooser
noDevicesAvailableController Widget GCKUIStyleAttributesNoDevicesAvailableController
connectionController 群組 GCKUIStyleAttributesConnectionController
navigation Widget GCKUIStyleAttributesConnectionNavigation
toolbar Widget GCKUIStyleAttributesConnectionToolbar
guestModePairingDialog Widget GCKUIStyleAttributesGuestModePairingDialog
mediaControl 群組 GCKUIStyleAttributesMediaControl
miniController Widget GCKUIStyleAttributesMiniController
expandedController Widget GCKUIStyleAttributesExpandController
trackSelector Widget GCKUIStyleAttributesTrackSelector
instructions Widget GCKUIStyleAttributes 指令

樣式階層

GCKUIStyle 單例模式是所有樣式設定的 API 進入點。其屬性 castViews樣式階層的根,如下圖所示;這張圖表是查看上一個資料表中顯示的相同檢視畫面和群組的不同方式。

您可以將樣式套用至個別小工具或一組小工具。 樣式階層有三個小工具群組:castViews、deviceControl 和 mediaControl。每個群組的矩形都會包含小工具。將樣式套用至群組後,就會套用至該群組中的所有小工具。

例如,castViews 群組可讓您將樣式套用到所有小工具,而 deviceControl 群組可讓您將樣式套用至其三個裝置控制小工具。「instructions」小工具不屬於任何群組。

castView
裝置控制 媒體控管
操作說明

裝置
選擇器
noDevicesAvailable 螢幕
連線
控制器
mini
控制器
已展開
控制器
軌跡
選取器
訪客模式
配對連線對話方塊
導覽 / 工具列

註腳:圖中的小工具名稱,以兩行顯示,應以程式碼的形式編寫成一行文字,每行一個,不能有空格。例如,device Chooser 應寫入 deviceChooser。將滑鼠遊標移到圖片上即可放大圖片