Vous pouvez personnaliser les widgets Cast en définissant les couleurs, en stylisant les boutons, le texte et l'apparence des vignettes, et en choisissant les types de boutons à afficher.
Personnaliser le thème du widget
Les widgets du framework Cast sont compatibles avec le protocole Apple UIApparence dans UIKit afin de modifier l'apparence des widgets de votre application, comme la position ou la bordure d'un bouton. Utilisez ce protocole pour styliser les widgets du framework Cast de sorte qu'ils correspondent au style d'une application existante.
Exemple d'icône Cast
GCKUICastButton.appearance().tintColor = UIColor.gray
[GCKUICastButton appearance].tintColor = [UIColor grayColor];
Personnaliser le widget directement
Personnalisez un widget directement à l'aide des propriétés de sa super-classe. Par exemple, il est courant de personnaliser la couleur GCKUICastButton
à l'aide de la propriété tintColor:
.
Exemple d'icône Cast
castButton.tintColor = UIColor.gray
castButton.tintColor = [UIColor grayColor];
Choisir les boutons de la manette
La classe de manette développée (GCKUIExpandedMediaControlsViewController
) et la classe de mini-télécommande (GCKUIMiniMediaControlsViewController
) contiennent une barre de boutons. Les clients peuvent configurer les boutons à afficher sur ces barres. Pour ce faire, les deux classes conformes à GCKUIMediaButtonBarProtocol
le font.
La barre de mini-contrôleur comporte trois emplacements configurables pour les boutons:
SLOT SLOT SLOT
1 2 3
La barre de manette développée dispose d'un bouton d'activation/de désactivation permanent de lecture/pause au milieu de la barre, ainsi que de quatre emplacements configurables:
SLOT SLOT PLAY/PAUSE SLOT SLOT
1 2 BUTTON 3 4
Votre application peut obtenir une référence à la manette développée avec la propriété -[defaultExpandedMediaControlsViewController]
de GCKCastContext
et créer une mini-télécommande à l'aide de -[createMiniMediaControlsViewController]
.
Chaque emplacement peut contenir un bouton du framework ou un bouton personnalisé, ou être vide. La liste des boutons de commande du framework est définie comme suit:
Type de bouton | Description |
---|---|
GCKUIMediaButtonTypeNone |
Ne placez pas de bouton dans cet emplacement |
GCKUIMediaButtonTypeCustom |
Bouton personnalisé |
GCKUIMediaButtonTypePlayPauseToggle |
Alterne entre lecture et pause |
GCKUIMediaButtonTypeSkipPrevious |
Passer à l'élément précédent dans la file d'attente |
GCKUIMediaButtonTypeSkipNext |
Passer à l'élément suivant dans la file d'attente |
GCKUIMediaButtonTypeRewind30Seconds |
Revenir en arrière de 30 secondes |
GCKUIMediaButtonTypeForward30Seconds |
Avance de 30 secondes dans la lecture |
GCKUIMediaButtonTypeMuteToggle |
Coupe et réactive le son du récepteur Web distant |
GCKUIMediaButtonTypeClosedCaptions |
Ouvre une boîte de dialogue permettant de sélectionner du texte et des pistes audio |
Vous trouverez des descriptions détaillées de la fonction de chaque bouton dans GCKUIMediaButtonBarProtocol.h
.
Ajoutez un bouton comme suit à l'aide de méthodes sur GCKUIMediaButtonBarProtocol
:
Pour ajouter un bouton de framework à une barre, il vous suffit d'appeler
-[setButtonType:atIndex:]
.Pour ajouter un bouton personnalisé à une barre, votre application doit appeler
-[setButtonType:atIndex:]
avecbuttonType
défini surGCKUIMediaButtonTypeCustom
, puis appeler-[setCustomButton:atIndex:]
en transmettant leUIButton
avec le même index.
Appliquer des styles personnalisés à votre application iOS
Le SDK Cast pour iOS vous permet de styliser la police, la couleur et les images des éléments d'interface utilisateur des widgets par défaut dans votre émetteur iOS, afin d'harmoniser l'apparence des vues avec le reste de votre application.
La section suivante explique comment appliquer des styles personnalisés à l'un des widgets ou au groupe de widgets Cast.
Appliquer un style à un élément d'interface utilisateur d'un widget
Cette procédure utilise l'exemple de définition de la couleur du corps du texte de la mini-télécommande de votre application sur rouge.
Dans le tableau des vues et des styles, recherchez le nom de la vue du widget ou du groupe de widgets que vous souhaitez styliser. Les noms des groupes sont indiqués par ▼.
Exemple: vue Widget
miniController
Recherchez les noms des attributs que vous souhaitez modifier dans la liste des propriétés de la classe de style correspondante indiquée dans ce tableau.
Exemple:
bodyTextColor
est une propriété de la classeGCKUIStyleAttributesMiniController
.Écrivez le code.
Exemple :
// 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];
Utilisez ce schéma pour appliquer n'importe quel style à n'importe quel élément d'interface utilisateur de n'importe quel widget.
Tableau des vues et des styles
Ce tableau présente les sept vues de widget et les trois groupes (signalés par ▼) auxquels vous pouvez appliquer des styles.
Nom de la vue | Type | Classe de style |
---|---|---|
▼ castViews |
Groupe | GCKUIStyleAttributesCastViews |
▼ deviceControl |
Groupe | GCKUIStyleAttributesDeviceControl |
deviceChooser |
Widget | GCKUIStyleAttributesDeviceChooser |
noDevicesAvailableController |
Widget | GCKUIStyleAttributesNoDevicesAvailableController |
▼ connectionController |
Groupe | GCKUIStyleAttributesConnectionController |
navigation |
Widget | GCKUIStyleAttributesConnectionNavigation |
toolbar |
Widget | GCKUIStyleAttributesConnectionToolbar |
▼ mediaControl |
Groupe | GCKUIStyleAttributesMediaControl |
miniController |
Widget | GCKUIStyleAttributesMiniController |
expandedController |
Widget | GCKUIStyleAttributesExpandedController |
trackSelector |
Widget | GCKUIStyleAttributesTrackSelector |
instructions |
Widget | GCKUIStyleAttributesInstructions |
Hiérarchie des styles
Le Singleton GCKUIStyle
est le point d'entrée de l'API pour tous les paramètres de style. Il possède la propriété castViews
, qui est la racine de la hiérarchie de styles, comme illustré ci-dessous. Ce schéma présente une autre façon d'examiner les mêmes vues et groupes que ceux présentés dans le tableau précédent.
Vous pouvez appliquer un style à un widget individuel ou à un groupe de widgets. La hiérarchie des styles comporte trois groupes de widgets : "castViews", "deviceControl" et "mediaControl". Le rectangle de chaque groupe contient ses widgets. Lorsque vous appliquez un style à un groupe, il est appliqué à tous les widgets qu'il contient.
Par exemple, le groupe castViews
vous permet d'appliquer un style à tous les widgets, tandis que le groupe deviceControl
vous permet d'appliquer un style uniquement à ses trois widgets de contrôle d'appareil. Le widget instructions
n'appartient à aucun groupe.
castViews | ||||||||||
deviceControl | mediaControl | |||||||||
instructions |
appareil Sélecteur |
Écran noDevicesAvailable |
connexion Contrôleur |
mini Contrôleur |
développé Contrôleur |
piste Sélecteur |
||||
navigation / barre d'outils |
||||||||||
Note de bas de page:Les noms de widgets de ce diagramme qui sont affichés sur deux lignes doivent être écrits dans le code sous la forme d'un mot, sur une ligne, sans espaces. Par exemple, device Chooser
doit être écrit deviceChooser
. Pointez sur les images pour les agrandir.