Meu Primeiro App com React Native - #04 CSS

Nessa videoaula aprenderemos como estilizar o nosso app criado com React Native utilizando a Folha de Estilo em Cascatas (CSS).

CSS com React Native

Uma prática que eu acho bastante interessante é separar o CSS da camada de visualização do usuário, isso faz com que possamos reaproveitar nossas classes CSS em várias partes do nosso aplicativo.

Nesse sentido criaremos o arquivo Css.js dentro de assets/css

assets/css/Css.js

Será o nosso arquivo de estilização geral do projeto:

import {StyleSheet} from "react-native";

const css = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center',
    },
    textPage:{
        backgroundColor:'orange',
        padding: 20
    }
});
export {css};

App.js

E chamaremos ele no nosso App.js assim:

import {css} from './assets/css/Css';

<View style={css.container}></View>

Por hoje é só! Sucesso nos códigos e na vida!

Precisa de aulas particulares? webdesignemfoco@gmail.com