Como desenvolver em React Native de forma responsiva? (Dúvida)
Bom dia pessoal, tudo bem?
Recentemente eu assumi o desenvolvimento do zero de um projeto em React Native, porém enquanto eu desenvolvia, fui realizar testes em diferentes dispositivos, com resoluções diferentes e reparei que meus componentes, telas, estão quebrando, não estão se adaptando ao tamanhos dos devices.
Gostaria aqui de pedir ajuda da comunidade para que eu possa entender como posso transformar o desenvolvimento que já fiz, e a continuação, em algo responsivo. Como estou trabalhando com React Native tem pouco tempo, não conheço bibliotecas ou ferramentas de boas práticas de uso para tornar meu desenvolvimento responsivo.
Desde já agradeço a contribuição de todos para contruírmos uma comunidade fod@ em homenagem do Deschamps.
Opa beleza? Estou acostumado a utilizar o 'styled-components' para fazer meus componentes, e acredito que a melhor forma de abordar a "responsividade" é você usar e abusar do 'flex-box'. Dessa forma vc consegue definir o alinhamento dos componentes e o preenchimento do espaço disponível em tela.
Para imagens tb é interessante definir o tamanho utilizando o PixelRatio c/ 'getPixelSizeForLayoutSize', que considera a densidade de pixels do dispositivo que está exibindo.
dê uma olhadinha nesses links: https://www.alura.com.br/artigos/css-guia-do-flexbox https://reactnative.dev/docs/height-and-width https://reactnative.dev/docs/flexbox https://reactnative.dev/docs/pixelratio