The Cast framework enables you to style the font, color, and images of UI elements of the default widgets in your Cast application, giving the views a look and feel that matches the rest of your app. This styling mechanism is available only with Cast iOS SDK v3 or later.
The following section shows you how to apply custom styles to any of the Cast widgets or group of widgets.
Applying a style to a UI element of a widget
This procedure uses the example of setting the body text color of your app's mini controller to red.
Look in the table of views and styles to find the view name of the widget or group of widgets that you want to style. Group names are marked with ▼.
Find the names of the attributes you want to change from the list of properties in the corresponding style class listed in this table.
Write the code.
GCKUIStyle *castStyle = [GCKUIStyle.sharedInstance]; castStyle.castViews.mediaControl.miniController.bodyTextColor = [UIColor red]; // Assign colors, fonts and images to other properties, as needed [castStyle applyStyle];
Descriptions of each line of code:
Get the shared instance of
Create a color using the Apple class
then assign the color to the
bodyTextColorproperty of the
miniController. You determine the prefix to this property by its dot-separated path from
castStyle.castViewsdown the style hierarchy to the widget or groupproperty.
- Similarly, assign other colors, fonts (using UIFont), and images (using UIImage) to properties of widgets and groups.
applyStylemethod to refresh all currently visible views with their assigned styles.
- Get the shared instance of
Use this pattern for applying any style to any UI element of any widget.
Table of Views and Styles
This table shows the seven widget views and three groups (marked with ▼) that you can apply styles to.
|View name||Type||Style class|
singleton is the API entry point for all of the style settings. It has the property
which is the root of the style hierarchy,
as illustrated below; this diagram is a different way of looking at the same
views and groups shown in the previous table.
You can apply a style to an individual widget or to a group of widgets. The style hierarchy has three widget groups: castViews, deviceControl, and mediaControl. Each group's rectangle encloses its widgets. Applying a style to a group applies it to all widgets in that group.
For example, the
castViews group lets you apply a style to all widgets and
deviceControl group lets you apply a style to just its three device
control widgets. The
instructions widget does not belong to any group.
Footnote: Widget names in this diagram that are shown on two lines should be
written in code as one word, on one line, no spaces. For example,
device Chooser should be written
deviceChooser. Roll over images to enlarge them.