El principal problema relacionat amb l'element central reaccionar natiu és que no és àmpliament adoptat. Això vol dir que no hi ha tants desenvolupadors que el coneguin, cosa que pot dificultar la recerca de recursos i suport quan sigui necessari. A més, com que React Native és relativament nou, pot haver-hi algunes inconsistències en com les diferents plataformes gestionen determinades característiques o funcionalitats.
There is no built-in method to center elements in React Native. However, you can use the Flexbox layout model to center elements.
Here is an example:
import React, { Component } from 'react'; import { View } from 'react-native'; export default class App extends Component { render() { return ( <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}> <Text>This element is centered!</Text> </View> ); } }
Aquest codi importa les biblioteques React i React Native i crea un component anomenat App. El component App representa una vista, que utilitza Flexbox per centrar el seu element fill.
Com dissenyar la portada
Hi ha moltes maneres de dissenyar una pàgina principal a React Native. Una manera és utilitzar el component react-native-header. Aquest component proporciona una manera senzilla de crear una capçalera per a la vostra aplicació. També podeu utilitzar el component react-native-header-bar per crear una barra a la part superior de la pàgina que inclogui el nom i el logotip de l'aplicació.
Alineeu els elements amb React
Alinear elements amb React a React Native és un procés de dos passos. Primer, heu de crear un contenidor per als vostres components de React. Pot ser qualsevol contenidor que vulgueu, però sovint és útil utilitzar un arbre de components com a disseny. A continuació, heu de dir a React on s'ha de col·locar cadascun dels vostres components a l'arbre.
Per crear un contenidor per als components de React, utilitzeu la funció createElement() a la plataforma React Native:
let MyContainer = createElement( 'div' , { estil : { alçada : '50px' } });
A continuació, heu de dir a React on s'ha de col·locar cadascun dels vostres components a l'arbre:
MyContainer .children .push({nom: 'Component A'}); MyContainer .children .push({nom: 'Component B'});
