Course Hive
Search

Welcome

Sign in or create your account

Continue with Google
or
Curso base de React Native 2025: #48 - Configurando background das telas nos layouts do Expo Router
Play lesson

📱Curso base de React Native - React Native Completo: +78 Aulas do Zero à DOIS apps prontos - Curso base de React Native 2025: #48 - Configurando background das telas nos layouts do Expo Router

4.0 (1)
23 learners

What you'll learn

This course includes

  • 25.5 hours of video
  • Certificate of completion
  • Access on mobile and TV

Summary

Keywords

Full Transcript

Precisa de ajuda? Solicite uma ajuda particular: https://forms.gle/Pu1aT2LsbU1nuTTDA Nessa aula do curso Base de React Native vamos trabalhar na configuração das cores de background do nosso aplicativo, aproximando ainda mais o visual do que foi planejado no protótipo. Até agora o app está funcional, mas ainda não tem a identidade que queremos. Então, nesta etapa, vamos ajustar o tema para que a interface fique sempre no modo escuro, garantindo consistência e um design mais agradável já desde o início da navegação. Esse é um ponto essencial para que o app tenha a aparência correta e não fique com telas despadronizadas. Durante a aula você vai aprender como aplicar cores de background em diferentes partes do app, desde a navegação em stack até a navegação em tabs. Vamos entender como configurar o contentStyle, headerStyle, headerTitle e até mesmo os botões de navegação para que fiquem com as cores certas e combinem com o restante da interface. Além disso, vamos utilizar os tokens de cores criados anteriormente para centralizar todas as definições, garantindo que qualquer mudança futura seja simples e rápida de aplicar. Ao final da aula, o seu aplicativo já estará com o tema escuro configurado e aplicado em todas as telas principais, incluindo a home, detalhes e about. Essa base deixa o projeto muito mais próximo do protótipo original e abre espaço para que, nas próximas aulas, possamos refinar ainda mais o layout e adicionar novos elementos visuais. Se você quer deixar seu app com uma cara profissional e bem estruturada desde já, essa é uma aula que você não pode perder. Links mencionados no vídeo: 🗨️ Discord - https://discord.gg/ZC7JrPZn7P 🎬 CodarSe - https://codarse.com 🖥️ Protótipo no Figma: https://www.figma.com/community/file/1543675168225105299 📖 Repositório: https://github.com/lvsouza/youtube-react-native-forca-play/tree/a4c5182f426febdae114fa102801fa5050ee98ae 🎮 App na Google Play: https://play.google.com/store/apps/details?id=com.lvsouzadev.forcaplay Outros cursos no canal: 🎩 Figma para DEVs - https://youtu.be/4rSPV1NbM10 ☪️ Curso de estilização no React - https://youtu.be/oUbPkR799fc 💎 Curso base de React - https://youtu.be/ggtWTKbhN_U 👑 React, Material UI 5 e Typescript - https://youtu.be/wLH1Vv86I44 🏆 Curso de API Rest, Node e Typescript - https://youtu.be/SVepTuBK4V0 Livros recomendados: 📘 Código limpo - https://amzn.to/43Xiick 📘 Arquitetura limpa - https://amzn.to/3ZMCStr 📘 Migrando sistemas monolíticos - https://amzn.to/45ByPDZ 📘 The Micro SaaS Handbook - https://amzn.to/4jCan93 Meu setup: 📺 Monitor 24: https://amzn.to/4msD7TY 🤖 Processador: https://amzn.to/4oJLZpN 🎧 Fone bluetooth: https://amzn.to/4lESd7r ⌨️ Teclado e mouse: https://amzn.to/4oPdgHu 💪 Suporte articulado: https://amzn.to/41hIrRE Conteúdo: 0:00 | Introdução da aula 0:17 | Avisos importantes 0:37 | Ajustando o tema do app 2:40 | Configurando o estilo geral da aplicação 7:00 | Aplicando a estilização nas tabs 10:00 | Finalização e agradecimentos CODARSE - Estilização e tema com NativeWind #ReactNative #CursoReactNative #ReactNativeDoZero #CriarApp #DesenvolvimentoMobile #ReactNativeGratis #AppEmMinutos #JavaScript #ReactNativeTutorial #Expo #ProgramacaoMobile #ReactNativeBrasil #PrimeiroApp #MobileDeveloper #ReactNativeBeginner

Course Hive

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Related Courses

FAQs

Course Hive
Download CourseHive
Keep learning anywhere