JetPack Compose - Speaker Deck

Slide 1

Slide 1 text

Jetpack Compose mariofelesdossantosjunior.github.io

Slide 2

Slide 2 text

Mario Feles dos Santos Junior mario_feles@live.com mariofelesdossantosjunior.github.io Desenvolvedor Android (Blu Pagamentos)

Slide 3

Slide 3 text

O que é Jetpack Compose? "O Jetpack Compose é um kit de ferramentas moderno do Android para criar IUs nativas. Ele simpliﬁca e acelera o desenvolvimento da IU no Android. Dê vida ao seu app rapidamente com menos código, ferramentas eﬁcientes e APIs Kotlin intuitivas." by Google

Slide 4

Slide 4 text

Principais objetivos!

Slide 5

Slide 5 text

Empresas que vem utilizando! Referência

Slide 6

Slide 6 text

Paradigma Imperativo Em vários kits de ferramentas de IU imperativos orientados a objetos, a IU é inicializada instanciando uma árvore de widgets. Isso geralmente é feito inﬂando um arquivo de layout XML. Cada widget mantém o próprio estado interno e expõe os métodos getter e setter, que permitem que a lógica do app interaja com o widget. A Programação Imperativa se baseia em especiﬁcar os passos que um programa deve seguir para alcançar um estado desejado. Pelo fato de permitir o uso de procedimentos como estruturação, também é conhecido como Procedural.

Slide 7

Slide 7 text

Before & After Para criarmos uma simples aplicação com ﬁltro de contatos e mostrar nome e foto precisamos de …. Fonte

Slide 8

Slide 8 text

Paradigma Imperativo

Slide 9

Slide 9 text

Paradigma Imperativo

Slide 10

Slide 10 text

Paradigma Imperativo

Slide 11

Slide 11 text

Sabe como isso ﬁcaria com Jetpack Compose?

Slide 12

Slide 12 text

Paradigma Declarativo ● A lógica do app fornece dados para a função de nível superior que pode ser composta. Essa função usa os dados para descrever a IU chamando outros elementos que podem ser compostos e transmitindo os dados apropriados para eles e para a hierarquia abaixo. ● O usuário interagiu com um elemento da IU, acionando um evento. A lógica do app responde ao evento e, em seguida, as funções que podem ser compostas são chamadas automaticamente com novos parâmetros, se necessário.

Slide 13

Slide 13 text

Exemplos de funções composable e seus resultados

Slide 14

Slide 14 text

Conceitos básicos de layout do Compose O Jetpack Compose facilita muito o processo de projetar e criar a IU do app. O Compose transforma o estado em elementos da IU usando: 1. Composição de elementos 2. Layout dos elementos 3. Desenho de elementos

Slide 15

Slide 15 text

Conceitos básicos de layout do Compose

Slide 16

Slide 16 text

Componentes Compose (Material Design)

Slide 17

Slide 17 text

Estaremos usando a linguagem kotlin <3

Slide 18

Slide 18 text

Por que Kotlin? ● Criada em 2011 pela JetBrains (criadora de IDEs famosas como IntelliJ IDEA, PyCharm, RubyMine, PHP Storm..) ● Multiplataforma, Backend, Frontend, Android ● Linguagem oﬁcial/principal para desenvolvimento Android em maio de 2017 (Anunciado no Google I/O 2017) ● Interoperável com JAVA ● Null-safety ● Open Source Versão 1.5.20

Slide 19

Slide 19 text

Vamos testar na prática! Nosso resultado ﬁnal deverá ser um aplicativo de listagem de pokémons (Pokédex) https://github.com/mariofelesdossantosjunior/ifpr-compose

Slide 20

Slide 20 text

mariofelesdossantosjunior.github.io Referências https://developer.android.com/ https://material.io/components https://developer.android.com/jetpack/compose https://www.youtube.com/watch?v=HQcAWztBa6s&list=PLPs3nlHF eKTr6-G4IAC0pxoC8EfVY7qH9&index=1&ab_channel=DouglasMotta https://nglauber.medium.com/jetpack-compose-o-framework-de-ui-d o-android-para-os-pr%C3%B3ximos-10-anos-e19adf28e57e https://github.com/android/compose-samples Dúvidas?