[Aplausos] [Música] [Aplausos] [Música] [Aplausos] fala pessoal beleza tudo bem com vocês meu nome é Marcos Duarte sejam bem-vindos ao primeiro vídeo da nossa nova série aqui no canal que é a nossa série criando três aplicativos Android utilizando a linguagem Java a linguagem cotlen e também vamos criar para o jetpack compose nós vamos criar o mesmo aplicativo utilizando várias linguagens de programação diferente e o aplicativo que a gente vai criar basicamente é um aplicativo de restaurante é uma tela de listagem de produtos uma listagem de dados então aqui a gente vai ter por exemplo a imagem
do prato de comida nós vamos ter aqui o nome do prato nós vamos ter a descrição aqui vai ter o preço do prato e aqui vai ter um botão vermelho né add Kart nesse caso é para gente adicionar no nosso carrinho isso aqui poderia ser uma tela de um aplicativo de delivery ou poderia ser uma tela referente aos pratos de comida que você tem aí no seu restaurante enfim você pode utilizar essa ideia em qualquer negócio basicamente é uma listagem de produtos né uma listagem com vários pratos de comida com descrição nome preço e assim
por diante e geralmente 70% dos aplicativos ou até mais utilizam listagem de dados então é uma funcionalidade bem interessante que a gente vai testar a gente vai criar tanto na linguagem Java no cotlen e no Jetpack e a gente vai conseguir ver uma evolução a gente vai conseguir ver quais são as vantagens e desvantagens de cada plataforma porém nessa série você vai aprender muito você vai aprender a trabalhar com Java com kotlen com jetpack e você vai ver essa mesma aplicação em diferentes cenários com isso a gente vai conseguir ver quais são as vantagens e
desvantagens e a evolução do desenvolvimento Android vai ser uma série bem legal e bem interessante aí para vocês e nessa primeira aula nós vamos criar na linguagem de programação Java Então essa é a primeira aula vai ser com beleza e antes de a gente começar esse vídeo tudo que eu peço para você que você deixa o like nesse vídeo o like é muito importante para ajudar o nosso trabalho também ajudar outras pessoas a encontrar esse conteúdo se inscreve no canal Porque toda semana eu trago um conteúdo totalmente diferente no desenvolvimento mobile em geral eu trago
notícias atualizações tutoriais então você não pode perder os meus conteúdos se inscreve e Ative o Sininho Então vamos começar mais um vídeo vamos começar criando essa aplicação na linguagem Java então o primeiro passo aqui você vai acessar o seu Android Studio nós vamos criar um novo projeto eu vou vir aqui em fone e tablet selecionar esse template aqui em iptviews activit nós vamos criar uma atividade vazia pro XML vamos clicar aqui em next e o nome do aplicativo Eu vou colocar app de restaurante e eu vou colocar aqui traço Java só para gente saber que
esse projeto foi feito em Java vai ter outros projetos e nesse caso com o mesmo nome então vou colocar Java para diferenciar aqui no pack de name eu vou colocar com o ponto Marcos app de restaurante underline Java o projeto ele vai ficar salvo na pasta Android Studio projects e a linguagem eu vou colocar a linguagem Java api mínima eu vou colocar api 21 Android 5.0 Lollipop vamos clicar em finish e aguardar o projeto ser criado o projeto acabou de ser criado nós vamos colocar essas imagens que são imagens fictícias né imagens locais dentro do
nosso projeto para a gente colocar na nossa lista de dados Então eu vou deixar disponível na descrição do vídeo um link onde você vai acessar o Google Drive para poder baixar as imagens do projeto para você seguir aqui nas aulas eu já tenho as imagens aqui na minha máquina então eu vou selecionar todas elas aqui e são os pratos de comida né vou dar um control c eu vou colar dentro da pasta Dropa Então vou acessar aqui ó US trouble eu vou colocar aqui ó control V Beleza vou colar aqui dentro de drible vou dar
um ok ok e tá aqui ó de dois fude 3 8 4 8 5 beleza nesse caso aqui são os pratos de comida legal a gente tem aqui a nossa mente activity a nossa tela principal e a manha Active de ponto XML que é o layout principal da nossa meia activit nós vamos estar utilizando essa tela mesmo tá vamos lá primeiro passo aqui a gente vai precisar definir uma cor de fundo no nosso layout então o nosso layout principal é a nossa mei activit Então a gente vai acessar a minha activet.x ml e vou acessar
aqui o split os códigos XML e basicamente nós vamos ter uma lista uma listagem de dados o fundo desse container desse container principal vai ser preto Então a gente vai ter aqui um componente de listagem e o fundo preto eu posso simplesmente tirar esse constrange layout eu posso definir aqui um linear layout eu vou definir aqui a orientação vertical todos os componentes que estiverem dentro desse layout eles vão ficar automaticamente na vertical e eu também vou estar utilizando linear layout porque a gente não precisa alinhar os componentes baseado em nenhuma constrange em nenhuma referência Então
nesse caso é só colocar o componente aqui que ele já vai ficar alinhado na vertical Vamos definir aqui uma cor de fundo utilizando o Android background eu vou passar aqui Black Então o fundo vai ser preto e aqui dentro Eu vou ter um componente de listagem esse componente de listagem é uma risaicler views vai renderizar uma lista uma lista que a gente vai configurar para Nossa ressakervil então aqui dentro eu vou definir um componente de listagem que é o nosso componente de listagem você vai pressionar o enter nós vamos definir a largura e altura desse
componente de listagem Então nesse caso na largura eu vou definir Mat perret ou seja ele vai pegar toda a largura da tela e na altura eu vou definir match também ele vai pegar toda a largura e toda a altura do meu conteúdo eu vou definir aqui um ID que eu vou chamar de cycler View food e basicamente é isso vamos executar eu já tô com o emulador configurado aqui Pixel 4 api 33 eu vou executar o projeto ele já tá aberto inclusive aqui e tá aí pessoal nós temos aqui uma tela com fundo preto e
um componente de listagem que por enquanto não tem nada outra coisa que a gente vai precisar fazer é o seguinte repare que a nossa barra de status ela tá na cor roxa e aqui na imagem a barra de status está na cor preta tá com a mesma cor do nosso plano de fundo aqui então vamos trocar a cor da barra de status vamos acessar o projeto vamos vir aqui ó em res.x ml e aqui dentro do Style eu vou definir aqui Um item eu vou definir aqui Um item nesse caso vai ser status bar color
Android 2 pontos status bar color e aqui eu vou definir a cor black que vem do nosso arquivo de cores aqui no arquivo de cores Nós temos duas cores padrões né é o preto e o branco Então nesse caso eu tô definindo aqui a cor preta para minha status bar eu vou executar e a minha barra de status aqui vai estar Preto beleza ficou preto agora o que que a gente vai fazer nós vamos começar a configurar a nossa lista e nesse caso nós vamos precisar definir as propriedades desse objeto Então nesse caso nós temos
aqui o nosso item de lista o nosso item de lista ele tem várias propriedades por exemplo nós precisamos definir aqui a imagem do produto que nesse caso é o prato de comida nós vamos precisar do nome do prato de comida da descrição do Prato do preço desse produto Então nós vamos precisar definir essas propriedades aqui dentro do pacote principal nós temos só minha activit eu vou clicar com o botão direito do mouse aqui em cima eu vou criar um novo pacote ó Packet eu vou chamar de Model eu vou criar o meu modelo de dados
e aqui dentro de Model eu vou clicar com o botão direito eu vou criar uma classe Java Java cless e essa classe vai se chamar e aqui eu vou definir as propriedades então eu vou definir aqui a primeira vai ser a imagem a imagem é um inteiro pessoal então o retorno dessa imagem como essa imagem nós estamos colocando de forma local essa imagem vai retornar um inteiro então eu vou criar aqui uma variável né nesse caso é uma propriedade vai ser do tipo inteiro que eu vou chamar de IMG Food Vai ser a imagem do
prato ali e aqui Vou definir um ponto e vírgula a próxima propriedade vai ser o nome do produto né E nesse caso vai estar aqui na parte superior fude um food 2 food 3 e assim por diante Então nesse caso como vai ser um texto o texto nós vamos definir como string então aqui eu vou definir que essa propriedade vai ser do tipo string vai ser um texto e vai se chamar fodi name e nesse caso vai ser o nome da comida né o nome do prato de comida e aqui eu vou colocar um ponto
e vírgula eu vou definir também a descrição nós temos a descrição desse prato eu vou colocar aqui e vai ser do tipo string porque vai ser um texto também eu vou definir como food scription nesse caso a descrição eu vou definir o preço o preço também vai ser uma string Então vou colocar aqui mais mais string que vai ser o price né vai ser o preço beleza acabamos de definir as propriedades do nosso produto aqui a imagem o nome a descrição e o preço precisamos definir aqui o gather E seter então vou clicar com o
botão direito do mouse dentro da classe eu vou vir aqui ó em generate e eu vou gerar aqui ó gather e Setter Então nesse caso eu vou colocar aqui ó gather etc e vou selecionar todas as propriedades aqui imagem food name fuded scription Price vou clicar em OK e ele vai gerar para mim o get e o 7 de cada propriedade basicamente o que que é esse get e esse sete repare que ele gera um get e um set para cada propriedade aqui da minha classe ó então ele vai gerar um get para imagem do
produto e um set para imagem do produto um Gatti profunde name com 7 profunde nem ó guete na descrição sete para descrição get para o price 7 prós Então nesse caso os métodos getset são métodos de acesso a dados de uma classe então por exemplo o método get ele é usado para a gente recuperar os valores de uma variável que já foi definida né ou que vai ser definida pela aplicação esses dados também eles podem vir do Servidor e Popular essas variáveis já o método 7 ele é usado para modificar ou configurar o valor de
uma variável de Instância E qual é essa variável de Instância basicamente são essas variáveis que a gente definiu aqui as propriedades da nossa classe e essas variáveis elas também são conhecidas como propriedades ou Campos então eu posso chamar de variáveis de distância variáveis de distância da classe eu posso chamar de propriedades da classe ou também Campos essas três formas estão corretas você vai ver pessoas chamando de campo de propriedade de variáveis de distância Eu costumo chamar de propriedades eu chamo de Campos também é basicamente a mesma coisa e você também vai ter as variáveis locais
as variáveis locais são essas variáveis aqui que são parâmetros de métodos você vai ver aqui ó que por exemplo nós temos aqui o 7 e mês de food nós temos um método aqui ó Public voide é um método que é o 7 né é o 7 da imagem nós temos o get da Imagem e nós temos o sete da imagem então com 7 eu vou conseguir definir um valor para essa variável de Instância que é a imagem food e o get Eu vou recuperar um valor que eu já que eu já defini no set Então
7 eu defino e o get eu só recupero o valor que eu já defini é esses dados eu posso definir eu mesmo ou eles podem ser populados de um servidor então por exemplo aqui ó o 7 in mês de food ele tem uma propriedade aqui a chamada de food essa propriedade aqui é variável local eu posso chamar de variável local ou eu posso chamar de parâmetro do método Eu geralmente chama de parâmetro Então a gente tem aqui Um parâmetro e é do tipo inteiro que a imagem food nós temos o parâmetro aqui e nós temos
aqui esse Diz Para que que serve esse diz e se diz basicamente é para diferenciar né entre variáveis locais e variáveis de distância com o mesmo nome então você pode ver que nós temos aqui a variável local um mesmo nome da variável de distância então o diesel para diferenciar a variável à distância da variável local com o mesmo nome é para diferenciar variáveis que tem o mesmo nome então o nome da variável local tem o mesmo nome da variável distância aqui então para diferenciar a gente coloca o diz então ele vai especificar isso daqui né
de maneira explícita então nós temos aqui né o sete em mês de food nós temos aqui o parâmetro e medifood e é do tipo inteiro e através do diz nós vamos pegar aqui a nossa variável distância de ponto IMG food vai receber a minha imagem a imagem que eu passei para o método 7 e mês de food esse método vai receber uma imagem eu vou passar uma imagem para esse método a imagem vai ficar dentro desse parâmetro e a minha variável de Instância que é a minha propriedade vai receber essa imagem que veio através do
parâmetro desse método basicamente é isso é assim que funciona o sete já o get eu vou retornar tá vendo aqui ó tem um retorno é um get eu vou retornar essa imagem então o get ele já tem a imagem porque eu já defini pelo sete então o 7 eu vou definir uma nova imagem e o get Eu vou recuperar essa imagem que eu mesmo já defini ou que alguém definiu a aplicação o servidor porque isso daqui pode ser passado de várias formas ou de forma dinâmica ou de maneira local então basicamente é isso tá nós
temos aqui o get e o sete propriedade para a gente é definir o valor dessa dessa propriedade e também recuperar o valor para a gente fazer o que a gente quiser na nossa aplicação agora que a gente definiu a nossa classe food com todas as propriedades e o gathers gerados automaticamente aqui nós precisamos criar o item de lista Então nós vamos desenhar esse item de lista que vai ser replicado na nossa lista na nossa resetlevil no nosso componente de listagem Então vamos lá é agora que eu vou começar a fazer isso então eu vou vir
aqui ó no layout eu vou criar um novo layout resource Fire eu vou chamar de food e tem vou clicar aqui em Ok eu vou criar aqui meu item de lista vou vir aqui no split e vou começar a desenhar esse item aqui Então nesse caso eu vou desenhar ele uma única vez eu vou desenhar todo esse quadrado aqui e depois ele vai se repetir na lista de forma automática não preciso criar tudo isso daqui de uma vez eu crio uma única vez e ele vai se repetir conforme eu for adicionando Novos Produtos né novos
pratos de comida na minha lista Então nesse caso eu vou definir aqui um constrange layout esse daqui vai ser o meu layout principal e aqui nós vamos começar a construir a parte da imagem então Aqui nós temos a imagem a imagem ela tá dentro de um container que é um container com bordas arredondadas isso daqui é um componente chamado de card View é um cartão então nós vamos criar esse Card View eu vou definir aqui ó componente ardil esse Card viu ele vai ter sem DP de largura e sem DP sem DP de altura aqui
eu vou fazer o fechamento no meu Card View eu vou definir também o fundo do Meu Container principal do meu construinte layout para Preto Então vou definir aqui como Black e esse Card View pode ver que ele dá um problema aqui porque eu preciso definir as referências desse cardiovio preciso alinhar esse Card View no Meu Container principal eu preciso de pelo menos duas constranges então vamos lá eu vou alinhar eu vou estar utilizando aqui né constrange top off eu vou alinhar esse Card View no topo do meu conteúdo pai esse perante é o meu constante
layout é o meu layout principal meu layout pai por isso perered Então nesse caso eu tô alinhando meu Card viu no topo do meu conteúdo pai ele vai alinhar no topo e eu vou alinhar na esquerda do meu conteúdo pai então vou estar utilizando constrange start to start off vou alinhar no começo do meu conteúdo pai eu vou alinhar no começo e no to agora já vai sumir o erro ele vai ter largura e altura de 100 nós vamos precisar definir aqui a cor de fundo dele então a cor de fundo dele vai ser branco
eu vou definir a propriedade Card background color eu vou definir uma cor de fundo que vai ser o White Vai ser branco aqui eu coloquei 100 pontos DP tá é 100 DPS e repare que esse Card View ele tá colado aqui na tela ele tá alinhado no topo e na esquerda mas ele tá colado então eu vou definir aqui uma margem uma margem Geral de 20 DPS essa margem geral vai pegar o topo a esquerda a direita e a parte de baixo 20 de espaçamento em todos os cantos do componente aí nesse caso ele vai
dar esse espaçamento aqui repare que o nosso Card viu ele é um quadrado ainda e nós queremos ele com bordas arredondadas para definir essas bordas arredondadas eu vou definir aqui a propriedade Card corner radios eu vou definir aqui 15 DPS já arredondamento em todos os cantos do meu Card viu pode ver que ele ficou com arredondamento de 15 em todos os cantos ele também tem uma sombra essa sombra você não consegue ver eu vou definir aqui um card Elevation Eu Vou Passar como oito depois essa sombra e eu preciso definir também um hard para esse
Card viu eu vou chamar de container e MG vai ser o nosso container de imagem dentro desse Card View nós vamos ter uma imagem que vai ser a imagem do prato de comida então a imagem do prato vai ficar dentro do card View então aqui dentro do card View ele abre e fecha aqui tá aqui dentro eu vou definir um componente de imagem o e-mail de envio essa imagem vai ter 100 de largura e aqui na altura ele vai ter 80 de largura 80 DPS eu vou fazer aqui o fechamento e eu vou colocar aqui
uma imagem fictícia só para a gente conseguir ver eu vou definir aqui o src eu vou passar aqui a imagem foi de um é aquele prato de comida lá então coloquei um prato de comida aqui beleza eu vou definir também um skate eu vou centralizar essa imagem no centro sem ter crop eu vou centralizar ela aqui e eu vou definir um gravit Vou definir aqui um layout gravit passando como Center para ficar Centralizado aqui eu vou definir um ID para essa imagem uma referência para essa imagem e MG food e basicamente é isso embaixo do
card View nós vamos começar a colocar os outros componentes então aqui a gente vai ter três textos de View né três textos um referente ao nome do produto a descrição e o preço então aqui eu vou definir um componente de texto textil esse texto vai ser rock contant rock content ou seja o definir ele não tem uma largura e uma altura específica a largura e a altura vai ser baseado no tamanho do meu texto ele vai crescer conforme meu texto cresce eu vou definir aqui um texto que nesse caso vai ser food nem o nome
do prato de comida tá aqui em cima eu vou definir um text size o tamanho do texto vai ser 16 SP eu vou definir aqui um teste color que vai ser o White e eu vou definir um text Style eu vou passar como bold eu vou colocar esse texto ao final do Meu Container Então eu preciso fazer os alinhamentos eu vou definir aqui constrange start Two and off ou seja o meu texto ele vai começar ao final que o end off ao final do Meu Container e MG ou seja ao final do meu Card viu
eu vou alinhar no topo do meu conteúdo do pai Então vou definir aqui um constrange top two top off eu vou alinhar esse texto no topo do Meu Container principal perante e eu vou definir uma margem Geral de 20 DPS no topo na esquerda na direita e na parte de baixo vou clicar aqui em cima Vou definir aqui um ID para esse texto para a gente manipular depois que eu vou chamar de TXT food name eu vou copiar esse textil vou dar um control c vou dar um control V aqui vou colar mais uma vez
nós vamos ter aqui a descrição eu vou chamar aqui de a descrição eu já tenho a descrição aqui em um bloco de notas é uma descrição fictícia tá mas você pode colocar o que você quiser vou deixar na descrição do vídeo essa descrição o nome tá a descrição e as imagens vou dar um control V vou colocar uma descrição aqui fictícia essa descrição vai ter um tamanho de fonte de 14 o texto vai ser Branco ele vai estar em essa margem eu vou tirar e aqui eu vou fazer os alinhamentos construante start to Wind off
ele vai começar ao final do Meu Container e MG vai começar o final do card View a minha descrição porém ele não vai ficar conectado no topo ele vai ficar abaixo o constrange top off esse texto ele vai ficar abaixo do TXT food name então ele vai ficar abaixo do TXT food name pode ver que ele ficou abaixo aqui e eu também vou alinhar essa descrição no final do meu conteúdo pai então eu vou definir aqui constrange off eu vou definir como perered ele tá alinhado no final embaixo do nome e ao final né E
vai começar o final do container e MG nesse caso é o Card viu aí repare que ele ficou tudo desalinhado aqui nós vamos falar que ele vai pegar toda a largura da tela mete pênalti ele vai pegar toda a largura da tela aqui e aí nesse caso eu vou trabalhar nas margens eu vou de uma margem start uma margem inicial de 140 DP vai ter uma margem de 140 aqui ó aí ele vai ficar exatamente alinhado com o nome e uma margem final também é legal que eu coloque para não passar então uma margem final
uma margem end de 10 de peso ó vai ter uma margem de 10 aqui e eu vou definir uma margem vertical tanto no topo Quanto na parte de baixo de 20 DPS então eu posso definir aqui uma margem vertical de 20 DPS tanto no topo Quanto na parte de baixo ele já tem um ID vamos copiar mais um texto aqui e colocar na parte de baixo e o próximo texto vai ser o preço Então vou colocar aqui TXT de texto Price vai ser o preço eu vou colocar um preço fictício sei lá 50 50 esse
preço ele vai ficar abaixo então constrange top ele vai ficar abaixo da descrição vai ficar abaixo da descrição e vai começar ao final do Meu Container então tá certo aqui o alinhamento esse preço ele vai ter um tamanho de 18 vai ficar um pouquinho maior 18 SP e aqui no final nós vamos ter um botão vermelho para adicionar esse prato de comida no carrinho né Então nesse caso eu vou ter um botão aqui o componente chamado de Button esse botão vai ter 100 de largura sem de largura e a altura dele vai ser ropcomte botão
tá ali na parte superior né vou colocar esse botão aqui então eu vou precisar trabalhar no alinhamento então constrange top to Bottom ele vai ficar abaixo da descrição é um botão tá baixo da descrição ele vai começar constrange start que um end off ele vai começar ao final do meu preço do meu TXT preço ele vai começar o final do TXT preço e ele vai ficar alinhado no final do meu conteúdo pai então vou definir aqui constrange Two and of vai ficar alinhado no final do meu conteúdo pai pode ver que ele faz uma flechinha
aqui ó alien no final alinhei depois aqui do preço e abaixo da descrição aí nesse caso eu vou definir aqui uma margem né uma margem Geral de 10 e peixe uma margem de 10 Vamos definir aqui também um texto para esse botão Então esse botão eu vou colocar aqui add Kart add Kart o tamanho do texto eu vou colocar 12 SP tamanho de 12 a cor do texto Vai ser branco e esse texto vai ter e vai ficar aqui a cor do botão Vou definir aqui um background eu vou definir um vermelho Então nesse caso
eu vou acessar aqui o arquivo de cores a velas Colors eu vou criar uma cor vermelha aqui eu vou definir aqui color vou escrever o nome da cor Red Vou colocar aqui um hexadecimal 6 vezes a letra F vai aparecer um quadradinho branco aqui vou dar dois cliques eu vou escolher esse tom de vermelho aqui ó beleza eu vou passar Red que vem do arquivo de Colors e já tá aqui o meu botão vermelho vamos Vamos definir aqui para esse botão eu vou chamar de BT add Art e por último pessoal nós temos uma linha
branca aqui ó que separa Um item do outro nós vamos criar essa linha branca também essa linha Branca eu vou colocar embaixo do botão basicamente é uma View tá então vou colocar esse componente aqui que é uma viu essa View vai pegar toda a largura da tela Então vou definir aqui match e a altura dessa viu vai ser de três DPS vou fazer o fechamento eu vou definir aqui a cor de fundo dessa viu utilizando o atributo background e eu vou passar o White que é branco Ó repare que a gente tem uma linha que
ocupa toda a largura da tela com três de altura e a cor branca Vamos colocar essa linha aqui na parte de baixo eu vou definir aqui constrange top vai ficar abaixo do botão pode ser do botão mesmo ele vai ficar alinhado no começo e no final do meu conteúdo pai então constrange start tio start off eu vou definir aqui o pênalti e constrange off também aí repare que essa linha né ela tá muito colada aqui não tem margem na esquerda na direita e nem na parte superior e essa linha ela tem uma margem na esquerda
aqui e na direita Então nesse caso eu posso definir aqui uma margem Geral de 20 DPS vai ter uma margem de 20 aqui de 20 aqui de 20 aqui e de 20 aqui beleza o nosso item de lista Nós criamos Precisamos configurar aqui o nosso layout principal que já envelopa todos os componentes ele tá pegando toda a largura da tela e toda a altura da tela match permad nesse caso a altura eu vou definir Rope contante ele vai pegar a altura baseado no tamanho do meu layout né dos meus componentes Então nesse caso meus componentes
eles vão até aqui a altura vai até aqui se eu colocar match ele vai pegar a altura completa do layout Então nesse caso vai ficar errado eu preciso definir rock ele vai pegar só esse tamanho aqui só esse quadrado aqui beleza pessoal item de lista criado com sucesso agora nós precisamos configurar o adapter o adapter basicamente é um adaptador de dados nós vamos adaptar esses dados dentro do adapter vai ter o nosso item de lista que a gente criou nós vamos nós vamos adaptar esses dados para uma visualização de lista ou seja nós vamos adaptar
esses dados para o nosso componente de listagem para nossa ressakerview a nossa ressakervil ela não tem esses dados esses dados vão vir através do nosso adaptador que é o nosso adapter então eu vou vir aqui eu vou criar um novo pacote que eu vou chamar de adapter e dentro do adapter eu vou criar uma nova classe em Java né E nesse caso eu vou chamar de food adapter sempre cria um nome fácil então por exemplo estamos trabalhando com comida né com prato de comida food então nós temos lá classe food com as propriedades então o
adapter dessa lista vai ser food adapter se fosse produto produto adapter sei lá é uma lista de de plantas de orquídeas planta adapter Enfim então você precisa ter uma sensibilidade nessa parte então food adapter e essa classe nós vamos começar a configurar agora primeiro passo essa classe ela precisa herdar de características específicas são características de lista se a gente configurar dessa forma que a gente não consegue então nós precisamos trabalhar com conceito de herança para definir herança aqui no Java Eu trabalho com a palavra extendedis Então eu vou colocar aqui extende a minha classe vai
herdar das características dessa classe aqui ó chamada de ressakervil é uma classe por conta do próprio Android Então essa classe vai herdar das características dessa classe ressign View ponto adapter e aqui eu vou configurar o meu adapter e aqui no adapter se você colocar o mouse você vai ver que ele espera um viu holder nesse caso é o próprio item de lista é a própria visualização da lista aqui ó Então eu preciso configurar um View holder eu vou colocar aqui food View holder eu vou criar esse esse viu holder do zero e aqui embaixo eu
vou criar uma classe pública estática eu vou chamar de viu holder o mesmo nome que a gente definiu aqui e essa classe ela vai herdar dinheiro sai Clear View ponto e aqui eu vou passar a classe viu holder a nossa classe de visualização eu vou abrir fechar Chaves aquele prédio para a gente é importar Então vou dar um Alt enter vou segurar Alt enter eu vou importar essa classe ele vai passar aqui o fundo de adapter Ford viu holder aqui vai aparecer essa lâmpada vermelha a gente precisa implementar esses métodos necessários nesse caso é o
ONG Create View holder on byte viewholder e get itincout vou clicar aqui em Ok beleza eu vou clicar aqui no food View holder eu vou clicar nessa lâmpada eu vou criar o Construtor E aí eu preciso fazer o seguinte eu preciso trabalhar com via Blind para mim conseguir pegar as referências né o ID de cada componente desse daqui eu preciso do View bind então eu vou configurar o View byed no meu projeto vou vir aqui no Build a nível de App eu vou definir aqui o viu eu vou passar aqui ó enable verdadeiro eu vou
sincronizar o projeto sincronisia projeto agora vou conseguir pegar a referência de cada componente né recuperar esses componentes aqui no meu adapter Então vamos lá primeiro passo aqui eu vou definir o meu layout então vou passar aqui ó food item bind basicamente é o meu layout aqui ó food item então food item é o meu layout meu item de lista e binding é o nome da biblioteca então eu já tô com meu layout aqui eu vou passar uma variável para ele chamada de bind Vou definir ponto e vírgula e essa variável Vagem vai ter o layout
full de item dentro dessa variável Então essa variável vai conter o meu layout completo aqui que a gente criou beleza dentro do Construtora aqui eu não vou passar um item viu eu vou trocar esse esse item viu aqui vou tirar isso daqui eu vou passar food item eu vou passar baile e aqui no super eu vou passar o meu bind.get Rute agora vou conseguir pegar a referência de todos os componentes que estão dentro desse layout aqui e para finalizar eu vou dar um diz diz ponto Paid eu vou pegar aqui a minha variável de Instância
dessa classe vai receber o bind né que tá aqui no parâmetro do Meu método e aqui vou dar um ponto e vírgula beleza Acabei de configurar o viuband agora eu vou acessar o método on Create viu holder basicamente Esse é o método responsável por criar as visualizações da minha lista então ele que vai criar essas visualizações aqui ó esses quadrados que é os nossos itens de lista eu vou configurar aqui Então nesse caso eu vou passar aqui ó food item que é o meu layout eu vou criar aqui uma variável chamada de list item nesse
caso é o meu item de lista Então esse itens de lista vai ter o meu layout certo completo aqui eu tô criando meu item de lista o meu item de lista vai receber novamente food item binding e eu vou estar utilizando o método inflate eu preciso inflar um layout Então nesse caso eu vou passar aqui o layout infrater ponto from e aqui ele espera um contexto esse contexto vai vir da minha atividade principal que é a minha mente então eu posso criar aqui o contexto aqui na parte superior eu vou criar uma variável privada nesse
caso vai ser uma constante Então vou colocar como final e vai se chamar contact né vai ser o nosso contexto aqui eu vou dar um Alt enter para importar o contexto e eu também vou precisar criar uma variável e vai ser referente a minha lista de comidas né de prato de comida Então nesse caso vai ser uma playlist eu vou criar aqui uma Rei list uma playlist de que de comida Então nesse caso vai ser a nossa classe food que já vai ter aqui ó todas as propriedades necessárias a imagem do produto o nome a
descrição e o preço Então a gente vai criar uma playlist baseado nessa classe food né e eu vou chamar de food food list então a gente criou aqui uma lista ele precisa de um Construtor então eu vou adicionar um Construtor para esses parâmetros aqui vou selecionar os dois clicar em OK e ele vai adicionar aqui não Construtor um Construtor dessa classe food adapter com dois parâmetros a minha lista e o contexto aí ele vai receber né disfood list o de list diz contest recebe o contexto aqui eu preciso passar o contexto então vou passar aqui
o context eu vou dar uma vírgula aqui aquele espera o pervert que é o group e aqui eu vou passar o falso Vou definir ponto e vírgula e aqui eu vou retornar alguma coisa vou retornar um novo food View holder eu vou retornar um food View holder passando o meu item de lista Então o meu food viu holder e basicamente é a minha classe de visualização vai receber o meu item de lista Então a gente vai criar essa visualização aqui para nossa lista eu acabei de criar a visualização Acabei de criar o meu item de
lista porém mesmo assim o usuário não vai conseguir visualizar para o usuário conseguir visualizar isso daqui corretamente nós precisamos do obide viu holder então aqui eu vou criar os itens de lista e aqui eu vou exibir esses itens que foram criados no walkreator então é aqui que eu vou exibir esses itens para o usuário então através dessa propriedade holder aqui que é o nosso food viu holder nós vamos conseguir recuperar todos esses essas propriedades e passar para o nosso item de ilícito e aqui a gente tem a posição dos itens de lista então eu vou
pegar aqui ó ponto bind Então agora eu já tenho o rio mais de configurado então eu vou recuperar o primeiro Então vou recuperar a imagem do produto Então eu tenho aqui né IMG food Então vou colocar IMG food eu vou definir o método 7 background Resort eu vou passar uma nova imagem que já foi configurada eu vou passar para minha lista de pratos aqui né food list eu vou estar utilizando o get baseado na posição desse produto eu vou recuperar a imagem desse produto utilizando aqui é o get e MG food Então nesse caso a
gente vai estar recuperando a imagem que a gente vai definir a gente tá recuperando aqui o get pode ver que já foi selecionado aqui depois a gente vai utilizar o sete também né porque a gente vai precisar passar uma imagem depois holder ponto eu vou recuperar o TXT nome e você dá um texto eu vou passar a minha lista baseado na posição da minha lista eu vou esperar o meu nome Então vou estar utilizando aqui o get food nome eu vou recuperar o nome vou fazer para todos eles óder.descrição vou dar um sete teste porque
é um texto vou passar minha lista baseado na posição da minha lista Eu vou recuperar a descrição de cada produto é o holder ponto bind vou recuperar o ID do TXT Price sete textos food list.gat baseado na posição vou recuperar o preço de cada produto e aqui no get a itainkout eu preciso falar para minha para o meu adapter né quantos itens tem na minha lista tá tem 30 itens tem 10 Então nesse caso ele vai pegar de maneira dinâmica eu posso vir aqui no retorno né tá zero aqui ele vai retornar a minha lista
ponto size ele vai pegar o tamanho Total Então esse site é o tamanho Total ele vai pegar o tamanho total da minha lista e vai passar para o get em Airton count Então nesse caso ele vai saber quantos itens tem no total na minha lista beleza pessoal adapter configurado nós vamos Acessar agora a nossa mente e nós vamos configurar o View balance na Mac Tivit para poder recuperar o ID da minha Website então aqui na parte superior eu vou definir aqui uma variável privada aqui eu vou passar layout né activity ou seja activite Men é
o meu layout activit Men e bind o nome da biblioteca e aqui vou passar uma variável chamar chamada de bind né E aqui vou dar ponto e vírgula beleza aqui dentro Eu vou configurar então bind recebe aqui tivity ponto em frente eu preciso inflar um layout então eu vou estar utilizando aqui ó get layout infrater eu vou pegar esse layout aqui e aqui no site conta a gente viu e aonde a gente vai exibir esse layout a gente vai passar o nosso bind que já tem o layout aqui ó já tem o layout dentro dele
get Rute e automaticamente ele já sabe que é um linear layout agora eu consigo recuperar a referência de todos os componentes de ponto eu consigo recuperar o ID da minha werestle View se eu tiver outros componentes eu consigo recuperar Beleza o primeiro passo é configurar a ressign view eu vou colocar aqui o tipo de dado né é View ressign views food recebe binding eu recuperei o ID está dentro dessa variável agora e é do tipo ressign View eu vou pegar a minha variável ressaca o tipo de layout ou seja essa lista ela vai ficar na
horizontal na vertical eu preciso definir o formato dessa lista nesse caso essa lista vai ficar na vertical os itens vão ficar um embaixo do outro então eu vou estar utilizando aqui ressign ponto eu vou estar utilizando o método 7 layout Manager e aqui no layout Manager eu vou aqui um novo linear layout Manager eu vou instanciar um novo tipo de layout que é um layout linear e aqui eu vou passar o diz que é o contexto quando eu faço isso daqui eu tô definindo que a minha lista por padrão ela vai começar na vertical eu
vou definir aqui o ressign View eu vou definir aqui o método 7 fixa de Vou passar como verdadeiro esse daqui é para é para dar mais desempenho para minha lista para minha Website e agora vou precisar configurar o adapter Então eu preciso aqui definir o adapter eu vou passar aqui food adapter eu vou passar minha classe adapter e uma variável chamada de food adapter e eu preciso de uma lista né aqui no construtor da minha classe ele espera o contexto da minha atividade na qual a lista vai ser renderizada e ele espera uma lista Então
nesse caso eu vou definir aqui uma playlist uma Rei list uma playlist de food né vou passar a minha classe pude eu vou chamar de food list e a gente vai instanciar novamente um Array list é que eu vou definir um ponto e vírgula então aqui a gente tem a nossa lista e a gente tem aqui o nosso food adapter vamos configurar o food adapter aqui então food adapter minha variável aqui recebe uma Instância de food adapter e aqui no food adapter ele espera a minha lista e o contexto por enquanto a minha lista tá
vazia daqui a pouco a gente vai criar os itens da nossa lista a gente vai Popular essa lista de maneira local Então nesse caso eu vou passar a minha lista aqui por enquanto tá vazia para cá vou deixar configurado né vou passar minha lista aqui eu vou passar o contexto o contexto da minha atividade e aqui eu vou definir o ponto e vírgula feito isso eu vou definir aqui o meu insider View novamente e eu preciso configurar no meu refler View um adaptador então é agora que eu vou definir aqui o método 7 adapter eu
vou configurar esse adapter no meu ressign View Ou seja eu vou adaptar esses dados do adapter no meu site agora vou passar o meu food adapter que contém a minha lista e o contexto né já tá tudo configurado Então nesse caso eu tô passando a minha lista completa para minha universidade agora não vai aparecer nenhum item de lista porque eu preciso criar esses itens Então nesse caso eu vou criar um método aqui eu vou criar um método privado que eu vou chamar de get food eu vou criar todos esses itens aqui e passar para nossa
para nossa lista que tá vazia por enquanto então eu vou pegar aqui a minha classe food eu vou chamar de food 1 eu vou criar o primeiro prato aqui né de comida Então vai ser o produto 1 a gente vai silenciar novamente a classe food e aqui dentro de food ele espera ele vai esperar aqui né no seu Construtor eu preciso criar um Construtor inclusive para essa classe aqui ó porque eu tenho gather Center mas eu não tenho Construtor dessa classe então eu não consigo criar eu não consigo criar esse objeto aqui então vou vir
aqui aqui na parte superior eu vou clicar com o botão direito eu vou gerar aqui ó o Construtor dessa classe Então vai ter aqui a imagem o nome a descrição e o preço vou clicar em ok para mim poder criar esses objetos vou precisar do Construtor Então vou precisar da imagem do nome da descrição e do preço Aí sim ó se eu vim aqui na mem ó pode ver que ele espera agora uma imagem o nome da descrição e o preço eu vou definir a imagem a imagem é um inteiro certo a imagem é um
inteiro Então nesse caso vou dar um rrobo .fod 1 ele retorna um inteiro eu vou dar uma vírgula aqui o próximo ó vou colocar o mouse aqui o próximo é uma string é o nome do produto eu vou abrir aspas duplas aqui eu vou colocar aqui por exemplo food o de um vai ser o nome do prato vírgula o próximo vai ser a descrição vai ser uma string também então já tem a descrição aqui né inclusive eu posso pegar até essa descrição vou dar um Control eu vou passar a descrição para cá vou dar uma
vírgula aqui beleza e por último vai ser o preço e vai ser mais 30 então aqui Vou definir o preço que vai ser por exemplo sei lá 120 e aqui eu vou definir um ponto e vírgula beleza acabamos de criar aqui né o primeiro item e eu preciso passar esse primeiro item para minha lista então vou passar aqui ó food list essa lista que está vazia e eu vou estar utilizando o método add e eu vou adicionar o meu primeiro item na minha lista e eu vou criar basicamente cinco itens Então vou dar um control
c aqui vou criar mais três mais quatro Então esse aqui vai ser o food 2 ou de dois esse daqui vai ser sei lá 80 reais nós vamos ter três a imagem vai ser três esse daqui vai ser o 3 vou colocar sei lá 70 3 esse aqui vai ser o 4 4 Vou colocar aqui 45 75 aqui né eu vou ter o 5 o teu 5 também vai ser mais ou menos 50 que eu vou passar por 5 Beleza então a nossa lista já vai ter cinco produtos esse aqui eu vou tirar não precisa
e eu vou renderizar esse método aqui na parte de baixo get food eu vou passar todos os produtos para minha mãe activit Então nesse caso a nossa lista já vai ter produtos a gente vai passar lá para o adapter né e o adapter vai vai recuperar utilizando o get aqui vai recuperar cada produto e vai setar nos seus respectivos componentes então ele vai setar aqui na imagem aqui no TXT food name ele vai passar o nome vai recuperar o nome que eu já defini aqui né na minha Active definir o nome aqui ele só recupera
o nome e passa para o TXT name nesse caso é esse textinho aqui e assim por diante então basicamente a gente utilizou aqui o 7 mas a gente utilizou o Construtor Então nesse caso nem precisaria desse sete aqui ó eu só vou recuperar com get e eu tô utilizando dessa forma né eu passei os dados da propriedade da propriedade através do Construtor eu poderia utilizar o set também mas eu não utilizei Então nesse caso eu posso tirar esse 7 e manter só o get aqui ó porque eu tô passando através do Construtor então de boa
e basicamente é isso vamos executar e tá aí pessoal ó de um fu de dois sim qual é a imagem ficou replicada aqui é só acessar o de item e tirar essa imagem padrão tá para tirar aqui deixar Branco executar novamente aí nesse caso vai aparecer a imagem certinho de cada produto beleza então ficou bem legal a nossa listagem de dados peito na linguagem de programação Java só para mostrar para vocês tá se eu fosse passar os dados do produto pelo 7 aqui como a gente é feito eu vou até colocar aqui o 7 da
imagem por exemplo Generation vou dar um sete só na imagem ó vou ter o sete aqui era só fazer o seguinte ó é só eu vir aqui definir aqui food food 1 normal vai receber aí deixa eu tirar esse Construtora aqui seria basicamente isso você iria colocar aqui food ponto aí você utilizar o 7 e mês de fuga e vai utilizar o seter e vai definir uma nova imagem aqui ó r.droble ponto de um eu vou até comentar isso daqui só para você ver teria dessa forma aqui ó aí você vem aqui for de ponto
tem que girar o Setter eu tenho que girar aqui ó o sétter do name do The scription do que eles novamente aqui Aí você coloca aqui ó food Ponto 7 full de name Aí você coloca aqui ó for de um aí fude 1 7 scription Aí você coloca a descrição pô de 1.7 Price Aí você coloca lá o preço E aí depois você vem aqui e dava um food list adicionar lá para lista o fu de um nesse caso eu só vou ter um produto tá vou executar Mas é a mesma coisa você faria isso
aqui com 5 Então nesse caso eu tô passando os valores para esse objeto aqui né através do 7 e aqui no adapter ele vai recuperar através do gatcher get food get name Get The scription get Price vai passar para os seus respectivos componentes vai renderizar naqueles componentes que já estão aqui ó tá E aí você vai ver basicamente esse resultado então você pode fazer utilizando Passa nos dados para o 7 e recuperando com get ou você pode passar os dados pelo construtor da classe e recuperar com o get que é o que a gente estava
fazendo nesse caso eu vou voltar com o Construtor eu tô passando através do Construtor e eu vou tirar esse sets aqui beleza mas só para mostrar para você como que era então só tirar o sete get esse aqui é sete beleza alguete get get get beleza [Música] e aqui eu não preciso mais tranquilo vamos executar e o resultado vai ser isso daqui beleza pessoal Espero que tenha ficado explicado ficou grande a aula porque Foi explicado passo a passo na próxima aula nós vamos criar esse mesmo aplicativo agora na linguagem de programação kotlen porém ainda vai
ser no XML aí depois a gente vai criar utilizando Jetpack composto então espero que você tenha gostado dessa aula de Java acho que você aprendeu muita coisa deixa o seu like se inscreve no canal que eu espero vocês no próximo vídeo até a próxima [Música] [Aplausos]