mrrioja / parallaxcarousel

Projeto desenvolvido para praticar animações com a Animated API dentro do React Native

Parallax Caroussel

Sobre • Parallax Carousel • Instalação • Tecnologias • Autor

Sobre

Projeto desenvolvido para praticar animações com a Animated API dentro do React Native. Feito para fins estudantis e seguindo esse tutorial do YouTube.

Parallax Carousel

O projeto é basicamente uma FlatList horizontal de imagens bem simples. A cereja do bolo e o fator motivador para esse projeto foi praticar animações com a Animated API. Para esse projeto, o efeito escolhido foi adicionar o efeito parallax ao mudar o item visível da nossa FlatList. O resultado é bastante elegante e podemos conferir no GIF abaixo:

Instalação

Antes de começar, você vai precisar ter instalado em sua máquina as seguintes ferramentas: Git, Node.js. Além disto é bom ter um editor para trabalhar com o código como VSCode.

📱 Rodando o App

# Clone este repositório
$ git clone [email protected]:MrRioja/parallaxCarousel.git

# Acesse a pasta do projeto no terminal/cmd
$ cd parallaxCarousel

# Instale as dependências
$ npm install
# Caso prefira usar o Yarn execute o comando abaixo
$ yarn

# # Execute a aplicação
$ npm run start
# Caso prefira usar o Yarn execute o comando abaixo
$ yarn start

# Será aberto no terminal o menu do Expo onde poderá scanear o QR Code para executar o app diretamente no seu celular ou as opções de executar no emulador android ou iOS

Tecnologias

Autor

Luiz Rioja

Backend Developer