Share via


Ajout d’une mise en forme spécifique à iOS

Une façon de définir une mise en forme spécifique à iOS consiste à créer un renderer personnalisé pour un contrôle et définir des styles et des couleurs spécifiques à la plateforme pour chaque plateforme.

Les autres options permettant de contrôler l’apparence de votre Xamarin.Forms application iOS sont les suivantes :

  • Configuration des options d’affichage dans Info.plist
  • Définition des styles de contrôle via l’API UIAppearance

Ces alternatives sont présentées ci-dessous.

Personnalisation d’Info.plist

Le fichier Info.plist vous permet de configurer certains aspects du renderering d’une application iOS, par exemple comment (et si) la barre d’état est affichée.

Par exemple, utilisez le code suivant pour définir la couleur de la barre de navigation et la couleur de texte sur toutes les plateformes :

var nav = new NavigationPage (new TodoListPage ());
nav.BarBackgroundColor = Color.FromHex("91CA47");
nav.BarTextColor = Color.White;

Le résultat est affiché dans l’extrait de code d’écran ci-dessous. Notez que les éléments de la barre d’état sont noirs (cela ne peut pas être défini car Xamarin.Forms il s’agit d’une fonctionnalité spécifique à la plateforme).

Capture d’écran montrant le thème iOS avec des éléments de barre d’état en texte noir.

Dans l’idéal, la barre d’état serait également blanche : quelque chose que nous pouvons accomplir directement dans le projet iOS. Ajoutez les entrées suivantes à info.plist pour forcer la barre d’état à être blanche :

Entrées iOS Info.plist

ou modifiez directement le fichier Info.plist correspondant pour inclure :

<key>UIStatusBarStyle</key>
<string>UIStatusBarStyleLightContent</string>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

À présent, lorsque l’application est exécutée, la barre de navigation est verte et son texte est blanc (en raison de Xamarin.Forms la mise en forme) et le texte de la barre d’état est également blanc grâce à la configuration spécifique à iOS :

Capture d’écran montrant le thème iOS avec des éléments de barre d’état en texte blanc.

UIAppearance API

L’API UIAppearance peut être utilisée pour définir des propriétés visuelles sur de nombreux contrôles iOS sans avoir à créer un renderer personnalisé.

L’ajout d’une seule ligne de code à la méthode AppDelegate.csFinishedLaunching peut styler tous les contrôles d’un type donné à l’aide de leur Appearance propriété. Le code suivant contient deux exemples : le style global de la barre d’onglets et le contrôle switch :

AppDelegate.cs dans le projet iOS

public override bool FinishedLaunching (UIApplication app, NSDictionary options)
{
  // tab bar
    UITabBar.Appearance.SelectedImageTintColor = UIColor.FromRGB(0x91, 0xCA, 0x47); // green
  // switch
    UISwitch.Appearance.OnTintColor = UIColor.FromRGB(0x91, 0xCA, 0x47); // green
    // required Xamarin.Forms code
    Forms.Init ();
    LoadApplication (new App ());
    return base.FinishedLaunching (app, options);
}

UITabBar

Par défaut, l’icône de barre d’onglets sélectionnée dans un TabbedPage serait bleu :

Icône de barre d’onglets iOS par défaut dans TabbedPage

Pour modifier ce comportement, définissez la UITabBar.Appearance propriété :

UITabBar.Appearance.SelectedImageTintColor = UIColor.FromRGB(0x91, 0xCA, 0x47); // green

Cela entraîne le vert de l’onglet sélectionné :

Icône de barre d’onglets iOS verte dans TabbedPage

L’utilisation de cette API vous permet de personnaliser l’apparence de l’iOS Xamarin.FormsTabbedPage avec très peu de code. Reportez-vous à la recette Personnaliser les onglets pour plus d’informations sur l’utilisation d’un renderer personnalisé pour définir une police spécifique pour l’onglet.

UISwitch

Le Switch contrôle est un autre exemple qui peut être facilement styleté :

UISwitch.Appearance.OnTintColor = UIColor.FromRGB(0x91, 0xCA, 0x47); // green

Ces deux captures d’écran affichent le contrôle par défaut UISwitch à gauche et la version personnalisée (paramètre Appearance) à droite :

Couleur UISwitch par défautCouleur UISwitch personnalisée

Autres contrôles

De nombreux contrôles d’interface utilisateur iOS peuvent avoir leurs couleurs par défaut et d’autres attributs définis à l’aide de l’APIUIAppearance.