您可以通过设置颜色、设置按钮、文字和缩略图外观以及选择要显示的按钮类型来自定义 Cast widget。
自定义微件主题
Cast 框架 widget 支持 UIKit 中的 Apple UIAppearance 协议,以更改 widget 在整个应用中的外观,例如按钮的位置或边框。使用此协议为 Cast 框架 widget 设置样式,以匹配现有应用的样式。
“投放”按钮示例
GCKUICastButton.appearance().tintColor = UIColor.gray
[GCKUICastButton appearance].tintColor = [UIColor grayColor];
直接自定义 widget
直接使用 widget 父类的属性来自定义 widget。例如,通常使用 tintColor:
属性自定义 GCKUICastButton
颜色。
“投放”按钮示例
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
您的应用可以通过 GCKCastContext
的 -[defaultExpandedMediaControlsViewController]
属性获取对展开的控制器的引用,并可以使用 -[createMiniMediaControlsViewController]
创建迷你控制器。
每个槽位可以包含框架按钮、自定义按钮,也可以为空。框架控制按钮列表定义如下:
按钮类型 | 说明 |
---|---|
GCKUIMediaButtonTypeNone |
请勿在此广告位中放置按钮 |
GCKUIMediaButtonTypeCustom |
自定义按钮 |
GCKUIMediaButtonTypePlayPauseToggle |
在播放和暂停之间切换 |
GCKUIMediaButtonTypeSkipPrevious |
跳至队列中的上一项 |
GCKUIMediaButtonTypeSkipNext |
跳至队列中的下一项 |
GCKUIMediaButtonTypeRewind30Seconds |
将播放快退 30 秒 |
GCKUIMediaButtonTypeForward30Seconds |
快进 30 秒 |
GCKUIMediaButtonTypeMuteToggle |
将远程网络接收器静音和取消静音 |
GCKUIMediaButtonTypeClosedCaptions |
打开对话框以选择文本和音轨 |
有关每个按钮用途的详细说明,请参阅 GCKUIMediaButtonBarProtocol.h
使用 GCKUIMediaButtonBarProtocol
中的方法添加按钮,如下所示:
如需将框架按钮添加到栏中,只需调用
-[setButtonType:atIndex:]
即可。如需向栏添加自定义按钮,您的应用必须调用
-[setButtonType:atIndex:]
,并将buttonType
设置为GCKUIMediaButtonTypeCustom
,然后调用-[setCustomButton:atIndex:]
,传递具有相同索引的UIButton
。
将自定义样式应用到您的 iOS 应用
借助 Cast iOS SDK,您可以为 iOS 发送者中默认 widget 的界面元素的字体、颜色和图片设置样式,让视图的外观和风格与应用的其余部分保持一致。
接下来的部分介绍了如何将自定义样式应用于任何 Cast widget 或 widget 组。
将样式应用于 widget 的界面元素
以下过程中的示例将应用的迷你控制器的正文文字颜色设置为红色。
在视图和样式表中查找您要设置样式的 widget 或一组 widget 的视图名称。群组名称标有 ▼。
示例:
miniController
widget 视图从此表中列出的相应样式类的属性列表中,找到您要更改的属性的名称。
示例:
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];
使用此模式可将任何样式应用于任何 widget 的任何界面元素。
视图和样式表
下表显示了您可以应用样式的 7 个 widget 视图和三个组(标有 ▼)。
视图名称 | 类型 | 样式类 |
---|---|---|
▼ castViews |
群组 | GCKUIStyleAttributesCastViews |
▼ deviceControl |
群组 | GCKUIStyleAttributesDeviceControl |
deviceChooser |
widget | GCKUIStyleAttributesDeviceChooser |
noDevicesAvailableController |
widget | GCKUIStyleAttributesNoDevicesAvailableController |
▼ connectionController |
群组 | GCKUIStyleAttributesConnectionController |
navigation |
widget | GCKUIStyleAttributesConnectionNavigation |
toolbar |
widget | GCKUIStyleAttributesConnectionToolbar |
▼ mediaControl |
群组 | GCKUIStyleAttributesMediaControl |
miniController |
widget | GCKUIStyleAttributesMiniController |
expandedController |
widget | GCKUIStyleAttributesExpandedController |
trackSelector |
widget | GCKUIStyleAttributesTrackSelector |
instructions |
widget | GCKUIStyleAttributesInstructions |
样式层次结构
GCKUIStyle
单例是所有样式设置的 API 入口点。它具有 castViews
属性,该属性是样式层次结构的根,如下图所示;此图提供了另一种方式来查看上表中显示的相同视图和组。
您可以将样式应用于单个 widget 或一组 widget。样式层次结构有三个 widget 组:castView、deviceControl 和 mediaControl。每个组的矩形都围住其 widget。对某个组应用样式后,该样式会应用于该组中的所有微件。
例如,castViews
组可让您将样式应用于所有 widget,而 deviceControl
组可让您仅将样式应用于其三个设备控制器 widget。“instructions
”微件不属于任何组。
castViews | ||||||||||
设备控制deviceControl | mediaControl | |||||||||
说明 |
设备 选择器 |
noDevicesAvailable 屏幕 |
连接 控制器 |
迷你 控制器 |
已展开 控制器 |
轨道 选择器 |
||||
导航 / 工具栏 |
||||||||||
脚注:此图中分两行显示的微件名称应在代码中编写为一个单词,一行不能有空格。例如,device Chooser
应写为 deviceChooser
。将鼠标悬停在图片上即可将其放大。