Movimento a stile Ionic
Utilizza animazioni di route iOS e Android modellate sui pattern di navigazione mobile senza distribuire componenti Ionic.
Indietro con swipe
Abilita un gesto di bordo iOS che segue il dito e può abilitarsi automaticamente solo all'interno di Capacitor iOS nativo.
Indipendente dal framework
Utilizza componenti web direttamente 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 pagina di movimento di alta qualità come 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:
- transizioni di rotta push, pop e root che si sentono vicine alle convenzioni della piattaforma
- movimento coordinato del capo, del contenuto e del piè di pagina
- cache delle pagine per la navigazione veloce all'indietro
- un gesto di scorrimento all'indietro facoltativo per iOS che segue il dito dell'utente
- aiuti di configurazione specifici del framework senza un router specifico del framework
Core API
Sezione intitolata “Core API”<cap-router-outlet>possiede 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?)inizia le legature 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 gesti.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 runtime. Puoi forzarlo platform="ios" o platform="android" quando si testa.
swipe-gesture="auto" utilizza aiuti di runtime Capacitor e abilita il gesto di bordo 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 ritorno 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, Utilizzando @capgo/capacitor-player-video per la capacità nativa in Utilizzando @capgo/capacitor-player-video, e @capgo/capacitor-player-video per il dettaglio di implementazione in @capgo/capacitor-player-video.