Come si crea una visualizzazione modale nativa per la ricerca con react-native?

C'è un modo per eseguire un passaggio modale, animando la vista e la barra di navigazione dal basso, coprendo la barra di navigazione esistente, la vista e la barra delle linguette, ecc.?Come si crea una visualizzazione modale nativa per la ricerca con react-native?

C'è un esempio simile in UIExplorer dove la vista 'Navigator' usi 'configureScene' a stare a galla una vista (ma non la barra di navigazione) dal basso tramite Navigator.SceneConfigs.FloatFromBottom, ecc segues modali nativo app si suppone animare la nuova barra di navigazione e visualizzare dal basso. Nota: un buon esempio di questa è l'app di salute, fare clic sulla scheda "ID medico", quindi toccare il pulsante "Modifica" nella barra di navigazione e notare come la barra di navigazione e la vista si animano e copre la barra di navigazione, la barra e la vista esistenti.

Sono in grado di vedere un passaggio modale nell'app Facebook Groups, che è reattivo-nativo dalla mia comprensione. Facendo clic sulla scheda "Gruppi", fai clic sul pulsante "Crea" della barra di navigazione.

Qualcuno sa come implementare un modale nativo segue in nativo reagito?

fonte

2015-03-31 McG

[a partire dalla v0.10 c'è una componente modale] (https: // GitHub .com/facebook/react-native/blob/master/Esempi/UIExplorer/ModalExample.js) – syg

@syg i documenti dicono che è per il mix di RN e parti native di un'applicazione. –

Lavoro sul componente React Native Navigator.

Per fare ciò, è possibile inserire un Navigatore all'interno della scena di un altro Navigatore. Il navigatore esterno configura la scena con Navigator.SceneConfigs.FloatFromBottom o qualcosa di simile. All'interno della scena, si può avere un altro <Navigator> con navigationBar={<Navigator.NavigationBar ...etc />}

fonte

2015-04-22 17:16:28

puoi essere un po 'più specifico qui? È difficile seguirlo e sembra un requisito di base che non sembra essere documentato chiaramente da nessuna parte. –

capito me stesso –

Ci scusiamo se la documentazione è scarsa al momento. Mi sono concentrato sulla stabilizzazione dell'API e sulla creazione di funzionalità per le app Android. Se vuoi aiutare a chiarire la documentazione per gli altri, sentiti libero di inviare un PR: https://github.com/facebook/react-native/blob/master/Libraries/CustomComponents/Navigator/Navigator.js –

enter image description here

this.props.navigator.push({ 
    title: 'Pick Date', 
    sceneConfig: Navigator.SceneConfigs.FloatFromBottom, 
    component: DatePickerView, 
    navigationBar: <NavigationBar 
     title="Initial View"/>, 
    passProps: {handleSelectedDate: this.handleSelectedDate} 
})

link di sorgente è qui: https://github.com/aaronksaunders/React-Modal-Nav-Example

fonte

2015-04-29 20:35:37

Lottando con questo come bene. Hai un esempio completo da qualche parte? – Rory

Qui ho postato un esempio più completo per un approccio usando un modulo. aaronksaunders/React-Modal-Nav-Example http://bit.ly/1JCRE6y –

Come si crea una visualizzazione modale nativa per la ricerca con react-native?

risposta

Problemi correlati