Assets no React Native

Publicado em por

O uso de assets no React Native é feito utilizando de uma estrutura similar à do HTML e CSS para o estilo do asset.

O ideal é por todos os seus assets dentro de uma pasta separada dentro da pasta “src” para um fácil acesso

A adição de uma imagem “exemplo.png” juntamente com as suas características vindas de seu arquivo de estilos que se encontre dentro da pasta esperada pode ser feita da seguinte maneira:

import Styles from './Styles';
<Image
    style={Styles.Exemplo}
    source={require('./assets/images/exemplo.png')}

/>

Depois pode-se adicionar detalhes, dentro de um arquivo “styles.js” de preferencia, por exemplo:

Exemplo: {
    width: 35,
    height: 35,
},

Essa não é a única forma de se adicionar assets em um app React Native, com a mesma estrutura pode-se pegar um asset vindo de um site externo da seguinte forma:

import Styles from './Styles';
<Image
    style={Styles.Exemplo}
    source={{uri='https://upload.wikimedia.org/wikipedia/commons/a/a3/Exemplo.svg'}}

/>

Pode-se obter mais informações a esse respeito no site oficial do React Native que tem todas as informações sobre o framework em questão.