fala pessoal beleza tudo bem com vocês meu nome é Marcos Duarte sejam bem-vindos a mais um vídeo nesse vídeo eu vou te ensinar a criar aplicativos para TVs É isso mesmo a gente vai aprender nesse vídeo a criar aplicativos que podem ser executados em Smart TVs TV Box e etc muita gente perguntou para mim se era possível criar aplicativos para TVs e sim pessoal é possível Inclusive eu recebi vários comentários aqui no canal e também lá no meu perfil do Instagram várias pessoas querendo que eu criasse um aplicativo de TV Muitas pessoas não sabem como
criar e queriam saber se era possível utilizando o Android Studio sim é possível eu vou te mostrar nesse vídeo a gente vai tá utilizando o Android Studio e a linguagem cotlin para est desenvolvendo um aplicativo bem interessante que é essa lista de filmes aqui ó a gente vai est criando esse aplicativo que vai ter vários filmes onde o usuário vai poder assistir Beleza então você vai aprender a criar esse aplicativo que pode ser executado na TV então fica comigo até o final do vídeo você vai aprender a criar esse aplicativo e também eu vou dar
várias dicas nessa parte de desenvolvimento de aplicativos na parte de Android TV mas antes de a gente começar esse vídeo tudo que eu peço para você é que você deixe o like nesse vídeo o like é muito importante para você ajudar o nosso trabalho e também ajudar esse vídeo a ser posicionado aqui na plataforma com esse vídeo sendo posicionado outras pessoas que precisam desse conteúdo de Android TV consigam achar com mais facilidade então ajude o meu trabalho e ajude outras pessoas a encontrar esse conteúdo de maneira mais fácil deixando o seu like é de graça
é rapidinho Muito obrigado pela sua colaboração eu quero fazer um convite para você também se inscreve no nosso canal clica nesse botão em vermelho inscrever-se porque toda semana eu tô trazendo dicas valiosas no universo Android eu trago dicas eu trago tutoriais de desenvolvimento de aplicativos eu trago atualizações então toda semana eu trago um vídeo totalmente diferente para você não perder os meus conteúdos se inscreve nesse canal e Ative o Sininho Então bora começar mais o vídeo Então bora [Música] lá galera começando mais um vídeo nesse vídeo a gente vai aprender a criar aplicativos para TVs
e nesse vídeo eu vou criar um aplicativo que vai ser uma lista de filmes e vai ser bem interessante porque você vai aprender conceitos bem legais bom então você vai abrir o seu Android Studio e a gente vai acessar aqui o new Project só que agora a gente não vai est utilizando phone and tablet a gente não vai acessar essa parte aqui do menu por quê justamente porque esses templates Eles foram projetados somente para celular e tablet então se você quer criar aplicativos Android para celular e para tablet que a grande maioria cria para esses
dispositivos você vai selecionar phone and tablet que são os aplicativos convencionais que a gente já cria aqui no canal agora no nosso caso a gente quer criar aplicativos Android com sistema operacional Android que vão ser executados na TV né Smart TVs TV Box E por aí vai então a gente vai est utilizando essa opção aqui ó Android TV e aí a gente vai ter os templates ideais pra gente criar aplicativos para TVs Nesse caso a gente só tem dois tipos de template né a gente tem esse template que é no activity é um template que
não vem atividade nenhuma e a gente tem o template Blank activity basicamente é um template que já vem com algumas classes criadas e é só a gente configurar essas classes a gente pode escolher qualquer um dos dois nesse caso eu vou estar escolhendo Blank activity por mais que já ven algumas coisas criadas aqui justamente porque é mais fácil de a gente excluir as classes e configurar aqui no no activity tem muita coisa que eu preciso configurar do zero então acaba ficando mais trabalhoso Então vou escolher Blank activity vamos clicar aqui em next e aqui o
nome do nosso aplicativo eu vou colocar lista de filmes lista de filmes aqui no package name eu vou colocar com pon stack mobile lista de filmes e vou salvar o meu projeto dentro da pasta Android Studio projects a linguagem que a gente vai est utilizando é a linguagem cotlin e a api mínima é api 21 Android 5.0 Lollipop eu vou clicar aqui em finish e vamos aguardar o o projeto ser criado Beleza meu projeto acabou de ser carregado e antes de a gente executar o projeto pra gente ver como é que ele tá a gente
vai vir aqui na pasta Java e repare que dentro do pacote tem várias classes que o Android Studio disponibiliza aqui ó que foi criado por padrão basicamente ele cria um aplicativo padrão pra TV só para Exemplo né mas a gente não vai est utilizando essas classes aqui então o que que a gente vai fazer primeiro passo a gente vai excluir tudo Exatamente tudo que tá aqui ó Então a gente vai fazer o seguinte a gente vai apertar aqui o control vai clicar com o botão esquerdo do mouse a gente vai selecionar todas essas classes aqui
e atividades vai clicar com o botão é direito do mouse e a gente vai deletar vamos excluir isso daqui delete anyway já deletamos todas as classes e atividades vamos vir aqui em layout e vamos excluir também esses layouts aqui então vou vir aqui em delete vou clicar aqui em ok Eu Já deletei tudo Vamos acessar aqui o Android manifests vai ter aqui ó várias atividades foram criadas na nossa aplicação a gente vai excluir isso daqui tudo ó vou apertar delete aqui e aqui na M activity A gente não tem mais a m activity mas a
gente vai criar uma uma atividade principal que vai ser a nossa lista de filmes aqui dentro de Java dentro do pacote eu vou criar a minha primeira atividade então vou clicar aqui new activity emp activity e aqui o nome da minha atividade vai ser lista de filmes ou só lista de filmes mesmo só lista filmes vou clicar aqui em finish aqui eu vou fechar não preciso marcar nada ali ó ele já criou a minha atividade e aqui é o layout da atividade de filmes agora vou vir aqui no meu Android Manifest e eu vou falar
pro meu pro meu aplicativo que a minha atividade lançadora a primeira atividade que vai ser iniciada vai ser a minha lista de filmes então vou passar aqui ó Então eu vou passar aqui ó a minha lista de filmes essa daqui vai ser a minha atividade Launcher né minha minha atividade lançadora então a gente já tem aqui o nosso aplicativo configurado a gente já pode começar a trabalhar nele mas antes de a gente começar a criar a nossa lista de filmes a gente vai executar esse projeto e você não vai executar utilizando qualquer tipo de device
a gente não pode executar um projeto né é um aplicativo que é projetado paraa TV em um celular em um device que é um celular ou que é um tablet então a gente precisa criar um novo device aqui no Android Studio Então a gente vai vir aqui ó em Device Manager a gente vai criar um novo emulador vamos vir aqui ó Create device e a gente não vai est utilizando phone e Eos tablet ou automóveis a gente vai estar utilizando a TV porque a gente quer executar e ver como é como é que fica em
uma TV e a gente tem aqui ó três tipos de device a gente tem TVs é de 720p que é TV de 55 aqui né 55 poadas a gente tem aqui a resolução 1280 por 720 A gente tem TV 4K também aqui né 55 então a gente pode testar em uma TV de 4K e a gente tem aqui a TV 1080p então você pode testar em uma TV de 1080 4K ou 720 eu vou colocar 1080 porque pra gente aqui é mais o suficiente mas se você quiser testar em 4K é só você criar um
device com uma TV de 4K aí para você vou colocar aqui 1080 é mais que suficiente aqui pra gente vou clicar aqui em next e aqui você vai escolher a versão do Android que você vai colocar no seu dispositivo que nesse caso é esse dispositivo de TV então a gente pode colocar qualquer versão do Android aqui ó a última disponível na aba recomendado é o Android 11 Mas se a gente vir aqui em x86 a gente consegue testar com Android 12 tá então não tá na aba recomendada mas na aba x86 você consegue baixar e
testar então se você não tiver nenhuma aqui é só você fazer o download depois que você fizer o download já vai conseguir utilizar essa imagem no seu dispositivo nesse caso eu já baixei aqui né o Android 11 vou est selecionando no seu caso aí não vai ter nenhuma então você vai baixar Você vai clicar aqui em download ele vai fazer o download depois que fizer o download você vai conseguir utilizar essa imagem eu vou pegar essa daqui api 30 Android 11 vou clicar aqui em next aqui você escolhe né a orientação se vai ficar com
a tela em pé ou com a tela deitada nesse caso é mais interessante pra gente a tela deitada né porque a TV a tela é deitada Então vamos manter landscape e vamos clicar aqui em finish e a gente acabou de criar aqui ó um device para o Android TV feito isso eu já tô com ele selecionado eu vou executar o nosso projeto a gente precisa executar porque a gente precisa fazer uma configuração aqui repare que já abre uma tela muito mais justamente pra gente poder ter uma ideia de como que ficaria numa TV Então se
ficar perfeito aqui na TV vai funcionar perfeitamente vamos aguardar para você tá testando seu aplicativo você precisa fazer o login com uma conta de Gmail do Google aqui no device Então você precisa ter uma conta de Gmail pode utilizar qualquer conta de Gmail a gente precisa fazer o login aqui no no no nosso emulador paraa gente poder acessar a tela principal Então vou est utilizando aqui ó vou clicar aqui eu vou colocar uma conta de Gmail que eu tenho vou fazer o login Aqui faça isso acabei de colocar o e-mail vamos clicar aqui em next
você vai colocar a senha você pode utilizar o teclado aqui né ou você pode digitar com seu teclado normal eu vou colocar minha senha aqui acabei de colocar minha senha vou voltar aqui vou clicar em next no meu caso tem verificação em dois fatores então você pode verificar com seu número de se celular se o seu não tiver não precisa fazer essa verificação E aí ele vai fazer o login e a gente vai conseguir acessar a tela principal vamos lá eu preciso explicar como é que funciona essa parte aqui para você porque é um pouco
diferente do emulador Android utilizando celular beleza então aqui a gente tem a nossa Smart TV bem parecido também com o sistema de TV Box né então a gente consegue descer aqui com o próprio Mouse a gente consegue descer só que para ficar mais fácil clica aqui nos três pontinhos e a gente vai est utilizando Esse controle aqui ó que é o dpad Esse controle ele é baseado ali no no controle de TV mesmo então a gente vai estar testando com esse controle aqui ó não vou estar utilizando o mouse não então você pode ir pro
lado para baixo aqui ó então para baixo para cima e aqui no meio você confirma Então os aplicativos eles vão estar aqui ó em apps a gente pode descer a gente já tem alguns aplicativos que a gente pode testar e vindo aqui do lado a gente tem a nossa lista de filmes então a gente precisa desinstalar esse aplicativo como é que a gente desinstala ele para desinstalar a gente vai acessar o próprio sistema aqui a gente vai subir ó ó eu tô utilizando aqui ó a gente vai subir aqui vai vir aqui na parte ó
Onde tá o seu e-mail a gente vai vir aqui ó em settings a gente vai descer aqui ó em apps vou clicar aqui no meio e tá aqui a nossa lista de filmes ó vou passar para cá para você você V ó a gente vai passar pro lado direito e aqui eu vou desinstalar ó uninstal então preciso desinstalar esse aplicativo vou clicar aqui vou clicar no meio aí vai falar se você quer desinstalar ou não né OK ou cancel Ok E aí ele já desinstalou ó se eu vi aqui em voltar eu posso voltar por
aqui ó Ou posso clicar aqui no Home ele já vai vai voltar na tela inicial Eu vou acessar aqui apps já não tem mais o nosso aplicativo outra coisa que a gente vai fazer também a gente vai acessar aqui ó Vales tem.xml a gente vai tirar esse tema aqui porque ele tava pegando o tema padrão vamos escolher um outro tema senão vai dar erro aqui então vou colocar o tema vou colocar esse tema aqui ó tema app compat day night vamos executar e agora o nosso aplicativo já foi executado com sucesso então vou acessar aqui
ó se eu voltar meu aplicativo tá aqui ó a a minha tela tá Branca por enquanto a gente vai começar a criar a nossa lista de filmes então o que que a gente vai fazer a gente vai criar aquela lista de filmes então a gente precisa ter todas as imagens pra gente poder criar uma lista com dados fakes então eu vou criar um aplicativo onde tem uma lista com dados fakes a gente não vai pegar de nenhum tipo de servidor de uma API justamente porque é algo mais avançado então aqui eu não quero criar algo
mais avançado eu quero criar um aplicativo bacana para você entender como é que você cria aplicativo para TV mas a gente vai criar com dados fakes mesmo então eu vou acessar aqui uma pasta de imagens eu vou deixar para você na descrição para você acessar essas imagens aqui a gente tem as imagens de todos os filmes aqui que a gente vai estar utilizando na nossa aplicação Então vou copiar essas imagens aqui vou dar um cont contrl C eu vou colar dentro da nossa pasta drawable aqui vou dar um cont Crol V vou dar ok aqui
e a gente já tem todas as imagens dos filmes a nossa lista vai ter capa e título a gente vai estar utilizando o componente de agem recycler View aqui no canal já mostrei vários vídeos sobre recycl View então se você não conhece recycler viw eu vou deixar alguns vídeos aqui na descrição do vídeo basicamente é o mesmo conceito não vai mudar nada só porque é aplicativo de TV é a mesma coisa eu vou criar aqui dentro de Java dentro do pacote um novo package e a gente vai criar o nosso Model o nosso modelo de
dados dentro de Model a gente vai clicar com o botão direito New eu vou criar uma nova classe cotlin que eu vou chamar de filme vai ser o nosso objeto de filme e o nosso objeto de filme ele vai ser um data Class porque a gente vai ter o getters and setters inferidos dentro dessa classe eu vou colocar aqui data Class eu vou tirar esse fechamento e eu vou abrir e fechar parênteses e aqui eu vou criar duas propriedades pro meu objeto de filme A gente vai ter a capa do filme e a gente vai
ter o título do filme então aqui eu vou criar uma variável que vai ser a cap fil como a gente vai est pegando essa imagem do Android Studio dentro do Android Studio de forma local essa imagem vai retornar um inteiro então ela vai ser do tipo int se fosse do Servidor a gente poderia converter para string mesmo então a gente vai ter aqui a capa que vai ser do tipo inteira nesse caso eu vou colocar aqui como n e aqui eu criar o título vai uma string tulo um texto e aqui eu vou iniciar ele
como nulo também então o nosso filme tem a capa e o título agora a gente precisa criar o item de lista o item que vai ser replicado na nossa recycl View Então a gente vai criar o layout a gente vai vir aqui em layout clicar com o botão direito New Vamos criar um novo layout resource file e aqui eu vou chamar de filme item que é o nosso item de filme aqui eu vou colocar um linear e aqui eu vou clicar em OK tá aqui ó filme item vou clicar aqui no split e a gente
vai criar o nosso item que vai ser replicado na lista nesse caso aqui eu vou trocar o linear layout por constraint layout Eu acho que vai ser melhor nesse caso eu vou tirar a orientação vertical Então dentro do constraint layout eu vou ter uma imagem eu vou colocar aqui 200 de largura e na altura do 250 de altura eu vou colocar uma imagem fake aqui utilizando o src vou pegar o filme Número Um só pra gente ver ali ó eu posso dar um zoom aqui pra gente conseguir visualizar eu vou definir as constraints então constraint
start to start off eu vou definir como parent então a gente vai fazer o alinhamento da esquerda eu preciso fazer o alinhamento da direita né a imagem precisa se alinhar aqui na direita do meu contêiner principal que é o constr layout então constraint end to end off eu vou alinhar ao final do meu conteúdo P então eu já alinhei ao final aí no começo eu vou alinhar aqui no topo também então constraint top top off eu vou alinhar na parte de cima do meu conteúdo P eu quero colocar uma margem no topo aqui ó de
20 DPS porque tá muito colado Então vou definir aqui uma margem no topo de 20 DPS e basicamente é isso agora Vou definir uma Ed para essa imagem eu vou chamar de capa filme vai ser a capa do filme e aqui embaixo a gente vai ter o título do filme Eu vou definir aqui um text View que vai ser R content R content aqui eu vou definir um texto padrão que eu vou colocar aqui por exemplo o nome do filme ali só pra gente ver ó Thor amor e Trovão Beleza o texto tá lá em
cima preciso colocar esse texto embaixo dessa imagem Então vou est utilizando uma constraint top Bottom off ou seja o meu texto vai ficar abaixo da minha capa do filme então ele já tá abaixo aqui eu preciso fazer o alinhamento da esquerda e da direita vou fazer o alinhamento da esquerda utilizando constraint start start off eu vou alinhar no começo do meu conteúdo P eu vou alinhar no final do meu conteúdo P utilizando constraint end end off parent eu já alinhei e ele vai ficar centr vou colocar uma margem aqui no topo Vou definir uma margem
no topo aqui de 20 DPS mais ou menos vai ficar assim eu vou colocar um tamanho para esse texto Então text size vou colocar 22 SP Vou definir que esse texto vai ter vai ficar bold e esse texto aqui eu preciso colocar ele na cor branca porque o fundo vai ser preto Então o texto vai ser branco então text Color eu vou criar aqui algumas cores inclusive aqui no arquivo de cores que a gente não tem né então você vai acessar aí ó rest values você vai acessar aqui ó Colors eu vou criar aqui duas
cores então color a primeira vai ser o black preto né eu vou criar aqui o preto 00 se vezes a letra zer e aqui eu vou criar o branco que é o White seis vezes a letra F esse aqui é o hexadecimal já vai aparecer aqui só para ficar mais fácil e aí eu vou definir aqui a cor branca que vem do nosso arquivo de cores o nosso texto tá branco Eu vou colocar um ID aqui que vai ser o meu título filme e por enquanto é isso E aí eu vou definir aqui na minha
largura ele vai pegar toda a largura da tela mas na altura ele vai pegar a altura baseada no tamanho dos meus componentes como os meus componentes só chegam até aqui então vai ser R content então a gente já criou o item de lista agora a gente precisa acessar a lista de filmes que é a tela principal onde vai ser renderizado os itens de lista né a nossa lista a gente precisa definir um componente de listagem que é o recycl View então aqui na lista de filmes no layout eu vou definir um componente de listagem que
vai ser o meu recycler View Inclusive eu vou definir aqui como linear layout pra gente não precisar definir constraint como só vai ter uma lista aqui não há necessidade de eu colocar constraints então linear layout vertical vou criar meu componente de listagem recycler viw vai pegar toda a largura da tela match parent e eu vou pegar toda a altura da minha tela utilizando match parent também feito isso Vou definir um ID paraa minha recycler View vai ser recycler View de filmes né né que a gente tá trabalhando com filmes e basicamente é isso agora a
gente precisa criar o adapter ou seja o adaptador para adaptar esses dados para uma recycler View então eu vou acessar aqui o projeto vou vir aqui em Java vou vir aqui no pacote vou criar um novo package que vai ser o pacote do adapter adapter vou clicar aqui em enter e dentro de adapter vou clicar com o botão direito New vou criar uma nova classe cotlin que eu vou chamar de adapter filme vai ser o nosso adaptador de filme vou clicar aqui no enter Acabei de criar minha classe adapter aqui em adapter film eu vou
configurar o meu adapter então aqui eu vou colocar um Construtor eu vou precisar do contexto que vai vir da atividade Então vou criar uma variável context que herda de um contexto eu vou precisar definir uma lista de filmes eu vou criar uma variável chamada de lista de filmes que herda de uma lista mutável mutable list uma lista mutável de filme então a gente vai passar o nosso objeto filme que tem aqui né a propriedade capa e título Então a gente vai criar um filme com capa e título a gente já tá passando aqui para a
nossa lista de filmes e essa classe de adapter precisa herdar de um recycl View Então a gente vai utilizar os dois pontos e vai herdar vai herdar aqui ó de recycler recycl View ponto adapter e aqui a gente precisa passar o View holder que é a visualização dos nossos itens de lista Então a gente vai criar o View holder do zero que eu vou chamar aqui de filme View holder agora a gente precisa criar essa classe film View holder Então vou criar aqui dentro mesmo então vou chamar de Inner Class vou criar uma classe interna
chamada de filme View Holder aqui eu vou abrir e fechar parênteses e abrir e fechar Chaves aí ele pede pra gente importar aqui ó então vou clicar aqui em cima vou dar um Alt enter e a gente vai invocar o Construtor Beleza invoquei o Construtor eu vou dar out enter novamente e ele vai importar o adapter de filme aqui no filme View holder essa classe ela vai herdar de um recyclerview pview holder a classe na de visualização e aí a gente vai clicar aqui na lâmpada vermelha a gente vai invocar um Construtor e dentro desse
Construtor a gente vai adicionar alguns parâmetros que nesse caso é o item View que a gente vai substituir pelo viewbinding vamos clicar aqui no adapter de filme na lâmpada vermelha e vamos implementar alguns métodos necessários on Create View holder on View holder e get item C seleciona os três clica aqui em Ok e a gente tem todos os métodos necessários eu vou pegar a minha classe interna vou dar um cont contrl x eu vou passar ela aqui para baixo só para manter uma organização feito isso eu preciso definir o viewbinding no nosso projeto pra gente
poder recuperar a referência aqui né do nosso layout o ID da capa do filme E o ID do título do filme então vou vir aqui no projeto Eu vou acessar o build p gdle a nível de app vou dar dois cliques e eu vou configurar aqui o View binding e aqui eu vou utilizar aqui View binding enable recebe verdadeiro vou sincronizar o projeto a biblioteca do View binding já está no nosso projeto a gente vai acessar o adapter e Vamos definir aqui o binding no nosso film View holder eu vou criar aqui uma propriedade binding
que vai herdar do nosso filme item binding que é o nosso layout aqui né filme item binding o nome da biblioteca Então esse layout tá dentro dessa propriedade e aqui a gente precisa dar um root para pegar o ID dos componentes então binding root feito isso eu vou recuperar a referência de cada componente aqui no caso da Imagem e o título Então vou acessar o adapter e a gente vai criar uma variável primeiro para capa do filme vai receber aqui n binding Eu vou recuperar a do filme né que é uma imagem uma image View
a gente vai criar uma outra variável que vai ser pro título do filme e vai receber o binding ponto e eu vou recuperar o título do filme e basicamente é isso aqui no oncreate vi holder esse aqui é o método responsável por criar os itens da nossa lista porém ele não é responsável por exibir o que vai exibir é o on by vi holder Então a gente vai criar os itens de lista aqui eu vou criar uma variável chamado de item de lista essa variável vai receber o meu próprio layout ali né filme item binding
aqui eu vou dar um ponto e aqui eu vou passar um inflate eu preciso inflar um layout que layout é esse é o nosso layout aqui então vou dar um layout inflater pon from e ele espera o contexto Então a gente vai passar o context que vai vir da nossa atividade l de filmes vou dar uma vírgula aqui eu vou passar o parent do View group eu vou passar aqui verdadeiro falso nesse caso falso pro at to parent e aqui eu vou retornar o nosso filme View holder passando o item de lista Então a gente
vai criar um item de lista aqui já no ONB View holder a gente vai exibir esses itens de lista que foi criado aqui no on Create então aqui eu vou est utilizando holder ponto primeiramente pegar a capa do filme Como é um inteiro eu vou est utilizando o set background resource e aqui eu vou pegar da minha lista de filmes através da posição Eu vou recuperar a capa de cada filme e como é um inteiro eu preciso colocar aqui ó um nul Então vou colocar aqui os dois pontos de de exclamação e agora eu vou
recuperar o texto Então holder ponto título filme nesse caso título string então pon Tex vou recuperar da minha lista de filmes através da position através da posição vou recuperar o título de cada filme Beleza E aqui no get a gente precisa falar pro nosso adapter Qual é a quantidade de itens que tem na nossa lista nesse caso ele vai receber a nossa lista de filmes size que é o tamanho Total dessa lista então o adapter já foi configurado eu posso tirar essa View aqui e aí a gente vai fazer o seguinte a gente vai acessar
aqui ó a nossa lista de filmes que é onde vai ser renderizado os itens de lista através de my recycler View eu vou configurar o View binding nessa tela para poder recuperar a referência da recycler View então Private late nar binding recebe activity activity lista de filmes binding que é o nosso layout aqui eu vou estar utilizando binding recebe activity lista de filmes pon inflate eu vou inflar um layout através do layout inflater e aqui no set content vi vou dar um binding p Rot feito isso eu vou recuperar a referência do meu recycl View
Então vou criar uma variável recycl View de filmes vai receber o Bing P recycl viw de filmes já recuperei vou utilizar a minha recycler View E aí eu vou definir o layout Manager a minha lista vai ser na vertical vai ser na horizontal vai ser em formato de grade nesse caso a gente vai colocar a nossa lista em formato de coluna numa coluna com mais ou menos é quatro itens Então vou colocar aqui layout Manager nesse caso vai ser um Grid um Grid layout Manager porque a nossa lista vai ser em grade E aí eu
vou est utilizando aqui o dis que é o contexto e e o número de colunas que eu quero que vai ser quatro Ah eu quero duas colunas posso colocar dois vai aparecer um item do lado do outro né Um item aqui e outro aqui ah eu quero três pode colocar três aqui vai aparecer três itens aí ele vai pular pra linha de baixo mais três depois mais três mas nesse caso eu quero colocar quatro feito isso eu vou est utilizando aqui o recycler View vou dar mais desempenho pra minha lista utilizando o método set has
fixed size como true passando como verdadeiro e aqui eu preciso instanciar o meu adapter e passar uma lista de filme também Lembrando que o meu adapter ele espera o contexto da atividade contexto da lista de filmes e uma lista de filmes Então a gente vai vir aqui na lista de filmes e vai criar Primeiramente um objeto que vai ser o adapter de filme vai herdar da minha classe adapter de filme e aqui eu vou criar uma variável privada que vai ser a minha lista de filmes que vai herdar de uma lista mutável de filme e
a gente vai iniciar essa lista utilizando mutable list off então a gente já tem o adapter e a gente já tem a lista de filme então aqui eu vou trabalhar com adapter adapter de filme recebe a classe adapter de filme aqui ela espera o contexto e a lista de filme então a gente vai passar o contexto que é dis e a gente vai passar a nossa lista de filmes para ela feito isso a gente precisa passar um adapter pro recycler View Então a gente vai estar utilizando recycler View ponto adapter e a gente vai receber
o nosso adapter de filme agora a gente precisa criar já tá tudo configurado a gente precisa criar os itens de lista de forma manual criar esses dados genéricos para passar pra nossa lista Então a gente vai criar oito itens de lista pra gente ter uma lista ali com pelo menos duas colunas interessantes Então vou criar um método privado aqui um método privado que eu vou chamar de get filmes a gente vai recuperar todos esses filmes aqui então eu vou criar o filme Número Um Então vou criar o filme Número Um que vai herdar da minha
classe filme né do meu objeto filme e aqui eu vou criar o meu filme através desse objeto então a gente precisa da capa que é um inteiro e o título que é uma string né se a gente acessar aqui a gente tem aqui o primeiro parâmetro do objeto uma capa e o segundo é o título Eu vou acessar aqui a lista eu vou utilizar R PDW acessar a passa drawable onde est as minhas imagens eu vou pegar a primeira imagem que é o filme número um né vai ser o filme Um ali vou dar uma
vírgula e aqui eu vou colocar o título desse filme então vou abrir aspas duplas que vai ser uma string eu vou colocar aqui ó Thor amor e Trovão Esses são os títulos dos filmes a gente pode acessar aqui ó dentro de drawable a gente consegue ver qual filme é então esse aqui é é Thor amor Trovão beleza Qual que é o filme dois vamos clicar aqui ó é Sonic o filme então vou vir na lista de filmes e vou criar o o filme Dois beleza feito isso eu vou vir na minha lista de filmes eu
vou utilizar o método add e eu vou adicionar o primeiro filme na minha lista que é o filme Um que eu acabei de criar aqui eu vou copiar e vou colar aqui oito mais sete vezes né porque agora a gente vai criar sete filmes Então vai ser o filme Dois f 2 f 3 fil 4 M5 [Música] 6 7 deu certinho aqui ó F8 beleza Qual que é o filme 2 do é o Sonic então vou passar aqui mi2 eu vou colocar aqui ó Sonic o filme Qual que é o filme TRS Vamos colocar o
filme TR aqui vou fechar o filme 3 é o coringa né Vou colocar aqui ó Coringa Qual que é o filme 4 filme 4 é Meu Malvado Favorito TR eu peguei alguns exemplos de filmes pra gente poder criar então vamos lá Meu Malvado Favorito TR Qual que é o filme 5 v vi aqui filme 5 ó é Homem Aranha sem volta para casa beleza vamos lá vamos colocar aqui ó Homem Aranha sem volta para casa o próximo é o fil 6 ó o contador vou trocar aqui para filme 6 no filme 6 Vou colocar aqui
o nome do filme então você vai colocando conforme as imagens ó o contador próximo é veloc Furiosos 8 né Vamos colocar aqui o fil 7 Velozes e Furiosos o esse aqui é o s né e o último é pixels o filme então vou colocar aqui o filme 8 pixels o filme Beleza Acabei de criar todos os filmes aqui a gente vai carregar fil aqui na parte de baixo ó a gente vai carregar todos os filmes a nossa recycler View vamos executar vamos ver como é que tá ficando bom tá aqui a nossa lista só que
tá aparecendo todas as imagens de um filme só bom Por que que isso tá acontecendo não tem interferência nenhuma disso acontecer vamos vir aqui no adapter tem alguma coisa de errado aqui pessoal vamos lá ah tá aqui ó set background resource tá pessoal não é set background resource a gente vai colocar aqui ó e set image resource ali eu tô definindo uma imagem de background aqui não eu tô setando uma imagem então é set image resource eu vou executar Agora sim ele vai pegar os filmes com a capa correta tudo certinho foi só esse detalhe
e tá aí ó tá tudo certo pegando cada capa do filme agora a gente precisa colocar um fundo preto porque as letras elas estão brancas Então vamos lá vamos vir aqui na lista de filmes eu posso colocar uma cor no próprio linear layout eu vou definir aqui um background que eu vou pegar aqui o black do arquivo de cores a gente vai ter aqui a nossa lista e a gente vai ter os títulos tudo em branco aqui né ó Thor amor e Trovão Sonic o filme Coringa Meu Malvado Favorito TR e homem-aranha sem volta para
casa o contador velo Furiosos 8 e pixels o filme muito bacana ficou bem interessante essa lista aqui a única coisa que eu vou mudar é que eu não quero que essa barra de ação apareça Então vou retirar eu vou vir aqui na lista de filmes e aqui na parte de cima eu vou colocar esse comando aqui ó suport Action bar e aqui eu vou definir o ponto Hide vou executar e a gente vai tirar essa barra de ação do aplicativo aqui a gente já terminou de criar só que agora o que que eu quero fazer
eu quero colocar algumas funcionalidades que só tem em TV eu posso fazer isso num aplicativo normal pode você pode fazer isso qualquer aplicativo só que essas funcionalidades que a gente vai colocar elas são muito mais interessantes para uma TV por exemplo na TV eu não consigo selecionar aqui com o meu mouse com o meu teclado até posso colocar essa configuração mas na TV você vai ter um controle então a pessoa vai acessar esses itens aqui através desses comandos Pô vou apertar aqui pro lado eu vou selecionar o filme de Sonic vou apertar para cá vou
selecionar esse filme como é que a gente você colocar um efeito de selecionar bom a gente precisa fazer alguma coisa para selecionar quando a gente clicar aqui no botão a gente vai selecionar o filme porque na TV a gente não pode simplesmente colocar um clique normal como a gente colocaria numa recycler View utilizando no celular na TV eu não consigo fazer esse tipo de clique eu vou est utilizando o botão do meio do controle para fazer o clique eu não vou selecionar utilizando o meu dedo né o meu toach porque é uma V eu vou
est utilizando o controle para selecionar então tem uma diferença nessa parte o desenvolvimento de aplicativos vai ser a mesma coisa mas na parte de navegação é um pouco diferente você precisa pensar para esses usuários da TV Então vamos lá é isso que eu vou te mostrar agora que que eu quero fazer eu quero colocar uma funcionalidade quando eu apertar pro lado aqui ó eu vou selecionar o filme Se eu Descer vou selecionar esse e assim por diante eu quero que apareça uma borda aqui ó com o fundo branco né para mostrar que tá selecionado eu
preciso colocar aqui no meu item de lista uma borda atrás dessa imagem por isso que a gente escolheu aqui o constr layout então aqui em cima eu vou colocar uma View Vou definir uma View essa View ela vai ter 20 DPS a mais de largura e 20 DPS a mais de altura então por exemplo aqui na imagem a gente tinha 200 DPS de largura aqui vai precisar ser 220 por que 220 para eu conseguir pegar uma margem da direita e da esquerda de 20 pra gente ter aqui uma borda nessa imagem que vai ser a
borda de seleção e aqui na altura a altura é 250 DP a gente vai colocar 270 para ter exatamente esses 20 DPS de borda Então vou colocar aqui ó 270 e aí eu preciso fazer o mesmo alinhamento que eu fiz aqui na imagem Ou seja eu vou alinhar essa View eu vou alinhar essa View aqui ó constraint start aqui no meu conteúdo P eu vou alinhar aqui no meu conteúdo P eu vou alinhar no final também então constraint End of parent Então pode ver que el já ficou Centralizado e eu vou alinhar também no topo
então preciso fazer isso constraint top top par também já fiz e eu preciso descer a margem do Topo para 20 DPS para ficar idêntico aqui então se eu colocar aqui margem top 20 DPS a gente consegue visualizar que a borda da esquerda da direita da parte de baixo tá funcionando mas a de cima perdeu porque 20 DPS é a mesma quantidade da imagem tem que ser menos Então a gente vai colocar 10 aí vai ficar perfeito então a gente precisa ter essa sensibilidade para entender essas margens V colocar uma cor de background só para você
ver como é que vai ficar vou colocar um Black ó tá vendo aqui a gente consegue ver a margem ó se eu não colocar 220 Se eu colocar 200 ele vai pegar a mesma largura da imagem tá vendo se eu colocar 250 ele vai pegar a mesma Alt altura aqui ele tá 10 porque eu tô tirando 10 do Topo ainda mostra aqui mas o resto não vai mostrar então aqui eu preciso colocar 270 e 220 aí a gente vai ter uma borda aqui a gente selecionar vai mostrar uma cor aqui que nesse caso Vai ser
branco quando a gente selecionar vai mostrar branco e quando não tiver selecionado vai ficar preto nesse caso eu vou tirar o background foi só para teste e a gente vai definir um ID para essa View eu vou colocar aqui item selecionado E aí o que que eu vou fazer eu vou acessar o meu adapter Eu vou recuperar Vou colocar aqui ó item item selecionado recebe binding ponto item selecionado já fiz a recuperação e a gente vai fazer tudo isso aqui no onbind View holder a primeira coisa que eu quero fazer é o seguinte quando eu
clicar aqui no botão do controle para ir pro lado eu quero acessar o filme do lado aqui Sonic se eu apertar pro lado de novo eu quero acessar o coringa Então vai mostrar aquela borda Branca quando eu não selecionar quando ele tiver fora do foco vai ficar com a margem preta mesmo exatamente da mesma cor do fundo então eu vou vir aqui no omb vi holder eu vou utilizar aqui o holder que é o meu próprio adapter film viw holder vou dar um ponto eu vou pegar o meu item View que é o me é
o meu próprio item de lista tá é cada item desse daqui vou dar o ponto novamente e vou est utilizando esse método aqui ó que é o Set On Focus Change listener Então vou trabalhar com a parte de focos ou seja se a gente selecionar esse item a gente vai mostrar uma borda se o item não tiver selecionado a borda vai ficar preta na mesma cor do fundo eu vou est utilizando Set On Fox change listener a gente vai ter aqui uma View e a gente vai vai ter esse H Focus que ele retorna um
boleano verdadeiro ou falso se for verdadeiro quer dizer que a gente selecionou Um item da nossa lista Então a gente vai colocar a borda Branca se for falso quer dizer que a gente não selecionou então a borda vai se manter preto mesmo então aqui eu vou fazer uma verificação se esse has foxus for verdadeiro a gente quer colocar uma borda Branca então eu vou est utilizando aqui o holder ponto item selecionado e aqui eu vou est utilizando um set background color a gente vai definir uma cor de fundo para essa nossa View aqui que nesse
caso branco para selecionado e Preto para quando não for selecionado E aí eu vou estar utilizando a classe color eu vou est utilizando o parse Color que ele retorna uma string então que eu vou colocar uma cor ex decimal em string mesmo é muito mais fácil então vai ser branco né quando eu tiver selecionado vou colocar seis vezes a letra F E quando não for senão se não for selecionado a gente vai definir uma cor de fundo pro nosso item selecionado que é a cor da borda lá né a gente vai colocar Preto então vai
ficar 00 beleza só que para funcionar esse Focus eu preciso definir aqui no meu filme item no meu item de lista aqui no layout principal dele eu preciso definir esses atributos que é o atributo Android focusable né Então nesse caso eu vou colocar como verdadeiro e a gente vai estar utilizando também esse to aqui ó focusable inem to mode e é pra gente acessar na TV também a gente vai colocar esses dois atributos Focus como true e esse daqui como true também e agora se a gente Executar a gente vai conseguir e tem um foco
do nosso item Então pode ver que ó que o primeiro item já tá com a borda branca ele já tá selecionado se eu clicar aqui pro lado ele já selecionou aqui ó no Sonic pode ver ele já selecionou aqui no Sonic e assim por diante só for clicando ó ó vou clicar para baixo ele selecionou aqui beleza só que repare ó que tem uma diferença de borda quando eu seleciono daqui para cá a borda da e esquerda e direita tem uma aumenta aqui ó por que que tá aumentando Justamente que eu preciso definir uma margem
no meu layout Então vou definir uma margem no topo aqui de 20 DPS Vou definir uma margem start de 10 DPS e uma margem Final de Um item pro outro de 10 DPS e na parte de baixo uma margem Bottom de 20 DPS e outra coisa que eu vou fazer aqui que eu acabei esquecendo eu vou vir aqui na imagem e Vou definir um scale Type porque tem imagens e tem tamanhos diferentes Então vou colocar aqui como Center crop aí ele vai arrumar essas imagens também então faltou essas margens aqui também faltou alinhar essa imagem
então agora se eu acessar aqui ó agora vai ficar tudo igual as bordas ó Então vou pro lado vou pro outro ó e a gente já consegue selecionar então a gente precisa fazer essa seleção porque na TV a pessoa não tem teclado não tem mouse não tem como tocar na tela ela vai ter um controle então no controle ela vai apertar pro lado vai selecionar o filme Ela precisa ter essa experiência de tá selecionando beleza eu tô selecionando mas eu não consigo escolher o filme certo como é que eu faço para clicar no filme eu
também não vou estar utilizando o clique convencional vai ter que trabalhar com o clique do botão então a única diferença aqui é que a gente vai trabalhar com clique do botão do controle quando a gente clicar a gente quer que a borda fica amarela quer dizer que a gente clicou e a gente quer exibir o nome do filme que a gente clicou então para fazer isso vou acessar o adapter e aqui na parte de baixo eu vou est utilizando aqui ó o holder ponto item View ponto e vou est utilizando esse daqui ó Set On
k listener a gente vai est utilizando esse daqui ó set onk listener pra gente trabalhar com eventos e também com códigos e aí a gente vai est utilizando aqui um if eu vou fazer uma verificação E aí eu vou fazer o seguinte ó se o meu k code ele for igual event Então posso colocar aqui ó event ponto e aí eu vou ter V códigos aqui eu posso colocar ke code aqui ó já vai aparecer vários códigos ó eu posso trabalhar com vários tipos de código ó quando eu apertar pro lado pra esquerda aqui ó
e tem botão nesse caso eu quero trabalhar com dpad que é o controle da TV ó então a gente pode apertar para baixo fazer alguma coisa apertar para baixo meio que pra esquerda fazer outra coisa apertar para cima fazer uma coisa nesse caso eu quero clicar no item quando eu apertar no no botão do meio então vai ser o dpad dpad Cadê Center né que é o Centralizado cadê onde é que tá ele aqui a gente tem que procurar porque são muitas informações então a gente pode colocar aqui ó com letra maiúscula k code underline
dpad né dpad e vai aparecer todos com dpad ó vou colocar Center quando eu apertar né nesse botão do meio aqui eu preciso retornar aqui um set on Key listener Vou passar como falso e quando eu clicar nesse botão do meio do controle eu quero fazer o quê eu quero trocar a cor do item selecionado né que nesse caso é a borda para amarelo então vai ficar amarelo e eu também querem exibir um Tust mostrando né o nome do filme que eu cliquei então Tust PM text vou pegar aqui o contexto e aqui vai ter
a mensagem por exemplo filme dois pontos e aqui eu vou colocar o filme que eu cliquei então aqui eu vou ter o título o título do filme E aí eu vou colocar um tempo para minha resposta L short pon show então aqui que que eu vou fazer eu vou criar uma variável chamada de título filme que vai receber da minha lista de filmes baseado na posição vou recuperar o título de cada filme então vai ter o título baseado na posição aqui do clique eu vou executar tá ó vou clicar pro lado ele vai selecionando tá
aí a nossa lista né ô vou clicar no filme do Sonic vou clicar aqui no meio já ficou amarelo e apareceu aqui ó filme Sonic o filme vou clicar aqui no Thor no meio ó filme Thor amor e Trovão Então posso clicar aqui no contador já aparece aqui o contador Então você aprendeu a criar esse aplicativo e você pode executar aí na sua TV é só você subir esse aplicativo normalmente na loja da Google Play você vai gerar o apk ou o aab vai subir na loja você vai poder é baixar na sua Smart TV
ou no TV Box enfim né Essas TVs que já tem a Google Play se se caso a sua TV não tenha você pode utilizar aí um box TV e aí a pessoa consegue acessar o seu aplicativo Então nesse vídeo eu te mostrei como é que você cria um aplicativo pra TV você viu é a mesma coisa de você criar um aplicativo normal para celular e tablet A única diferença é que só vai mudar nessa parte de navegação a gente tem que pensar no controle é de TV Essa é a única diferença o resto vai ser
a mesma coisa eu posso utilizar os mesmos bancos de dados eu posso consumir as mesmas api eu posso trabalhar com Java com cotlin eu posso criar os layouts da mesma forma que eu crio para aplicativo obviamente que eu preciso pensar pro tamanho de tela de uma TV é tem as suas diferenças mas o desenvolvimento é a mesma coisa uma vez que você aprendeu a criar aplicativos nativos para o Android você consegue criar aplicativos para TV você consegue criar aplicativos para relógios que tem sistema operacional Android você consegue criar para automóveis todo tipo de aplicação que
o sistema operacional é Android você consegue criar aqui no Android Studio utilizando a linguagem cotlin ou Java Essa é uma das maiores vantagens do desenvolvimento nativo outras tecnologias você não consegue fazer isso com desenvolvimento híbrido você não consegue fazer isso com nativo sim eu consigo desenvolver aplicativo Android aplicativo para TV aplicativo para relógio aplicativo para automóveis utilizando uma única ferramenta que é o Android Studio e uma única linguagem tem uma grande diferença Ô Marcos você pretende criar um curso para desenvolver aplicativos para TVs então não há necessidade de eu criar um curso você até pode
pesquisar por cursos específicos né para criar aplicativos paraa TV só que não há necessidade uma vez que você já sabe criar aplicativos Android você consegue criar para TV você consegue criar para relógio Eu nunca fiz nenhum curso para criar aplicativos para TV eu acabei de criar um aplicativo bem interessante para você nesse vídeo eu aprendi a criar aplicativos Android uma vez que eu aprendi e eu me tornei um profissional eu consigo criar para TV para relógio para qualquer sistema que lançar hoje se você quiser aprender a criar aplicativos Android vou deixar o meu treinamento aqui
na descrição que é o Android Master lá eu ensino você a criar aplicativos do zero ao mais avançado se você aprender a criar aplicativos depois se você quiser aprender a criar aplicativos para TV você cria na mesma hora porque os conceitos vão ser os mesmos vai ter algumas mudanças de navegação algumas coisas específicas mas que facilmente você consegue com uma pesquisa ou até acessando a própria documentação você consegue resolver esses problemas até no próprio Android estúdio e você ali mexendo você consegue então se você quiser aprender comigo vou deixar aqui o link na descrição do
vídeo Espero que você tenha gostado desse vídeo deixa o seu like se inscreve no canal espero vocês no próximo vídeo até a próxima as I reach out reach out reach out reach out To The Sky I found My Way I found My Way I was in the Dark against It All made the dayuse I found My Way