Mouvement d'Ionic
Utilisez les animations de route iOS et Android qui se basent sur les modèles de navigation mobiles sans expédier les composants d'Ionic.
Retour par balayage
Activez un geste de poignée arrière sur iOS qui suit le doigt et peut activer automatiquement uniquement à l'intérieur des applications natives Capacitor iOS.
Agnostique par rapport au framework
Utilisez directement les composants web ou les assistants pour React, Vue, Angular, Svelte et Solid.
Pas de blocage de l'interface utilisateur
Apportez votre propre barre d'outils, votre contenu, votre pied de page et votre routeur tout en laissant la bibliothèque coordonner les couches de transition.
Quand l'utiliser
Section intitulée « Quand l'utiliser »@capgo/capacitor-transitions Cela est destiné aux applications qui souhaitent une animation de page de qualité Ionic sans adopter le système de composants d'Ionic. Il garde la navigation dans votre routeur web existant et anime les éléments de page à l'intérieur de la Capacitor WebView.
Utilisez-le lorsque vous avez besoin de:
- des transitions de route push, pop et root qui ressemblent à celles des conventions de plateforme
- une motion coordonnée de barre d'outils, de contenu et de pied de page
- un cache de page pour une navigation rapide en arrière
- un geste de retour par balayage sur l'iPhone facultatif qui suit le doigt de l'utilisateur
- des assistants de configuration spécifiques au framework sans un routeur spécifique au framework
<cap-router-outlet>contrôle la pile d'itinéraires animés.<cap-page>enveloppe chaque page.<cap-header>,<cap-content>, et<cap-footer>identifie les régions qui doivent se déplacer ensemble.initTransitions(options?)initialise les liens de framework.setDirection('forward' | 'back' | 'root' | 'none')indique au prochain mises à jour de router quelle animation exécuter.setupRouterOutlet(element, options?)connecte un outlet à la vie cycle et le comportement de geste.setupPage(element, callbacks?)enregistre les appels de callbacks de vie cycle de page.
Modèle de Plateforme
Sous-titre “Modèle de Plateforme”platform="auto" choisissez le profil d'animation iOS ou Android à partir de l'environnement de runtime. Vous pouvez forcer platform="ios" ou platform="android" lors de la phase de test.
swipe-gesture="auto" utilise les assistants de runtime Capacitor et active uniquement le geste de bordure dans les applications iOS natives Capacitor. Utilisez true To l'activer ou non. false Pour le désactiver.
La gestuelle est mise en œuvre dans la couche web. Elle est conçue pour ressembler à la transition de swipe-back d'Ionic sur iOS en faisant progresser l'animation à partir de la position du pointeur, puis en terminant ou en annulant en fonction de la distance et de la vitesse.
Continuez de @capgo/capacitor-transitions
Section intitulée “Continuez de @capgo/capacitor-transitions”Si vous utilisez @capgo/capacitor-transitions pour planifier le comportement des médias et de l'interface native, connectez-le avec En utilisant @capgo/capacitor-transitions pour la capacité native dans En utilisant @capgo/capacitor-transitions En utilisant @capgo/capacitor-live-activities pour la capacité native dans En utilisant @capgo/capacitor-live-activities @capgo/capacitor-activités en direct pour les détails d'implémentation dans @capgo/capacitor-activités en direct, Utilisation de @capgo/capacitor-joueur de vidéo pour la capacité native dans Utilisation de @capgo/capacitor-joueur de vidéo, et @capgo/capacitor-joueur de vidéo pour les détails d'implémentation dans @capgo/capacitor-joueur de vidéo.