Movimento a stile Ionic
Utilizza animazioni di route per iOS e Android modellate sui pattern di navigazione mobili senza distribuire componenti Ionic.
Indietro con swipe
Abilita un gesto di edge iOS che segue il dito e può auto-abilitarsi solo all'interno di Capacitor iOS nativo.
Indipendente dal framework
Utilizza direttamente componenti web o aiuti per React, Vue, Angular, Svelte e Solid.
Nessuna lock-in UI
Porta il tuo toolbar, contenuto, piè di pagina e router mentre la libreria coordina gli strati di transizione.
When To Use It
Sottosezione intitolata “When To Use It”@capgo/capacitor-transitions è per le app che vogliono una transizione di pagina di alta qualità come quella di Ionic senza adottare il sistema di componenti di Ionic. Mantiene la navigazione nel tuo router web esistente e anima gli elementi di pagina all'interno del WebView Capacitor.
Usalo quando hai bisogno di:
- transizioni di push, pop e route root che si sentono vicine alle convenzioni della piattaforma
- movimento coordinato di intestazione, contenuto e piè di pagina
- caching di pagina per una navigazione veloce all'indietro
- un gesto di swipe-back facoltativo per iOS che segue il dito dell'utente
- aiuto di configurazione specifico del framework senza un router specifico del framework
Core API
Sezione intitolata “Core API”<cap-router-outlet>gestisce la pila di route animate.<cap-page>avvolge ogni pagina.<cap-header>,<cap-content>, e<cap-footer>identifica le regioni che dovrebbero muoversi insieme.initTransitions(options?)inizializza i legami del framework.setDirection('forward' | 'back' | 'root' | 'none')insegna all'aggiornamento del prossimo router quale animazione eseguire.setupRouterOutlet(element, options?)collega un outlet al comportamento di ciclo di vita e gestuale.setupPage(element, callbacks?)registra callback di ciclo di vita della pagina.
Modello di piattaforma
Sezione intitolata “Modello di piattaforma”platform="auto" sceglie il profilo di animazione iOS o Android dal ambiente di esecuzione. Puoi forzarlo platform="ios" o platform="android" quando si testa.
swipe-gesture="auto" utilizza gli aiuti di runtime Capacitor e abilita il gesto di angolo solo negli app iOS nativi Capacitor. Utilizza true per forzarlo o false per disabilitarlo.
La gestualità è implementata nel layer web. È progettata per sentire come la transizione di swipe-back di Ionic per iOS guidando il progresso dell'animazione dalla posizione del puntatore, poi finendo o annullando in base alla distanza e alla velocità.
Continua da @capgo/capacitor-transizioni
Sezione intitolata “Continua da @capgo/capacitor-transizioni”Se stai utilizzando @capgo/capacitor-transizioni per pianificare il comportamento di media e interfaccia nativa, connettilo con Utilizzando @capgo/capacitor-transizioni per la capacità nativa in Utilizzando @capgo/capacitor-transizioni, Utilizzando @capgo/capacitor-attività-vive per la capacità nativa in Utilizzando @capgo/capacitor-attività-vive, @capgo/capacitor-attività-vive per il dettaglio di implementazione in @capgo/capacitor-attività-vive, Usando @capgo/capacitor-player-video per la capacità nativa in Usando @capgo/capacitor-player-video, e @capgo/capacitor-player-video per il dettaglio di implementazione in @capgo/capacitor-player-video.