> ## Documentation Index
> Fetch the complete documentation index at: https://docs.replit.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Utiliser les composants natifs iOS

> Utilisez des alertes, feuilles d'actions, SF Symbols et autres composants natifs iOS dans PixelGames.

export const AiPrompt = ({children}) => {
  return <CodeBlock className="relative block font-sans whitespace-pre-wrap break-words">
      <div className="pr-7">
        {children}
      </div>
    </CodeBlock>;
};

export const nativeAlertPrompt = `When a player tries to quit mid-game, show a native alert asking "Quit game? Your progress will be lost." with Cancel and Quit options.`;
export const nativeActionSheetPrompt = "When a player taps to change their profile photo, show the native action sheet with Camera and Photo Library options, not a custom modal.";
export const nativeSwitchesPrompt = "Add a Settings screen with native switches for sound effects and haptics.";
export const sfSymbolsPrompt = "Use SF Symbols for the settings and leaderboard icons on iOS.";
export const nativeShareSheetPrompt = "Let players share their high score using the native share sheet.";

## Pourquoi c'est important

Chaque iPhone dispose déjà d'alertes, de feuilles de partage, d'interrupteurs et de menus intégrés, et les joueurs les utilisent dans toutes les autres applications qu'ils possèdent. Quand votre application utilise ces mêmes composants natifs, les joueurs savent déjà comment ils fonctionnent avant même d'y avoir appuyé, c'est ce qui donne l'impression d'une véritable application iPhone.

Voici des exemples de prompts pour des composants natifs que vous pouvez ajouter à votre application : alertes, feuilles d'actions, interrupteurs, et plus.

## Alertes natives

<AiPrompt>
  {nativeAlertPrompt}
</AiPrompt>

Cela affiche une véritable alerte `UIAlertController`, le même style que les fenêtres utilisées par iOS lui-même. Utilisez une alerte quand il y a une décision claire à confirmer.

<Frame caption="L'alerte native Quitter la partie dans PixelGames.">
  <img src="https://mintcdn.com/replit/WuaQIOfW5oxRlxex/images/pixelgames/mobile/native-alert.png?fit=max&auto=format&n=WuaQIOfW5oxRlxex&q=85&s=dd73b103564765f4a4701082e37fba59" alt="Alerte iOS native demandant Quitter la partie ? avec les options Annuler et Quitter" data-path="images/pixelgames/mobile/native-alert.png" width="1516" height="258" data-path="images/pixelgames/mobile/native-alert.png" />
</Frame>

## Feuilles d'actions natives

<AiPrompt>
  {nativeActionSheetPrompt}
</AiPrompt>

Une feuille d'actions est la petite sœur d'une alerte, utilisez-la quand il y a plusieurs options distinctes à choisir, plutôt qu'une simple décision oui/non. Android a son propre équivalent natif, Agent choisit automatiquement le bon composant selon la plateforme.

<Frame caption="La feuille d'actions native pour changer une photo de profil PixelGames.">
  <img src="https://mintcdn.com/replit/WuaQIOfW5oxRlxex/images/pixelgames/mobile/native-action-sheet.png?fit=max&auto=format&n=WuaQIOfW5oxRlxex&q=85&s=776916fcff3a32b3415a6cccfd683310" alt="Feuille d'actions iOS native avec les options Prendre une photo, Choisir dans la photothèque et Choisir un avatar pixel" data-path="images/pixelgames/mobile/native-action-sheet.png" width="1516" height="418" data-path="images/pixelgames/mobile/native-action-sheet.png" />
</Frame>

## Interrupteurs natifs

<AiPrompt>
  {nativeSwitchesPrompt}
</AiPrompt>

Le même interrupteur marche/arrêt utilisé partout dans l'application Réglages d'iOS, instantanément reconnaissable, si bien que les joueurs n'ont pas à comprendre un interrupteur personnalisé.

<Frame caption="Interrupteurs natifs pour les effets sonores et les haptiques dans les réglages de PixelGames.">
  <img src="https://mintcdn.com/replit/WuaQIOfW5oxRlxex/images/pixelgames/mobile/native-switch.png?fit=max&auto=format&n=WuaQIOfW5oxRlxex&q=85&s=eec2b4de1408a608e8ff15b3c90e1049" alt="Interrupteurs iOS natifs activant et désactivant les effets sonores et les haptiques" data-path="images/pixelgames/mobile/native-switch.png" width="1516" height="288" data-path="images/pixelgames/mobile/native-switch.png" />
</Frame>

## SF Symbols

<AiPrompt>
  {sfSymbolsPrompt}
</AiPrompt>

SF Symbols est le jeu d'icônes intégré d'Apple. Les symboles s'adaptent automatiquement à la taille et à la graisse du texte environnant ainsi qu'au mode sombre, quelque chose qu'un jeu d'icônes personnalisé doit gérer manuellement.

<Frame caption="SF Symbols utilisés pour les icônes des effets sonores et des vibrations dans les réglages.">
  <img src="https://mintcdn.com/replit/WuaQIOfW5oxRlxex/images/pixelgames/mobile/native-sf.png?fit=max&auto=format&n=WuaQIOfW5oxRlxex&q=85&s=d56437f19723910a46fe0822e032be91" alt="Icônes SF Symbols à côté des réglages Effets sonores et Vibration" data-path="images/pixelgames/mobile/native-sf.png" width="1516" height="310" data-path="images/pixelgames/mobile/native-sf.png" />
</Frame>

<Note>
  SF Symbols est exclusif à iOS. Demandez à Agent de choisir un jeu d'icônes équivalent pour Android, les icônes ne seront pas identiques au pixel entre les plateformes, et c'est normal.
</Note>

## Feuille de partage native

<AiPrompt>
  {nativeShareSheetPrompt}
</AiPrompt>

Ouvre la même feuille de partage système que Photos ou Safari, si bien qu'elle liste les applications déjà installées par le joueur.

<Frame caption="Partage d'un meilleur score PixelGames via la feuille de partage native.">
  <img src="https://mintcdn.com/replit/WuaQIOfW5oxRlxex/images/pixelgames/mobile/native-share.png?fit=max&auto=format&n=WuaQIOfW5oxRlxex&q=85&s=74cfd5dd061cbb5b128f300eb0c3126d" alt="Feuille de partage iOS native partageant un meilleur score PixelGames" data-path="images/pixelgames/mobile/native-share.png" width="1516" height="630" data-path="images/pixelgames/mobile/native-share.png" />
</Frame>

## Dépannage

* **L'alerte ou la feuille d'actions affiche une fenêtre personnalisée à la place :** vérifiez qu'Agent a utilisé l'API native plutôt qu'un équivalent rendu en JS, ils peuvent se ressembler mais se comporter différemment.
* **Les icônes semblent incorrectes sur Android :** normal pour SF Symbols en particulier, il est exclusif à iOS. Demandez à Agent quel jeu d'icônes de repli il a utilisé.
* **La feuille de partage n'inclut pas une application attendue :** cela dépend du système et des applications installées sur l'appareil de test, ce n'est pas quelque chose que PixelGames peut ajouter directement.

## Prochaines étapes

<CardGroup cols={2}>
  <Card title="Accéder aux contacts" icon="address-book" href="/fr/build/mobile-contacts">
    Associez la feuille de partage à des liens d'invitation.
  </Card>

  <Card title="Aperçu et test sur votre téléphone" icon="mobile" href="/build/mobile-preview-testing">
    Vérifiez que les composants natifs s'affichent correctement sur l'appareil.
  </Card>
</CardGroup>

## En relation

* [Ajouter des retours haptiques](/fr/build/mobile-haptics)
