vamos adicionar o comportamento ao nosso mini navegador né nosso app navegador decidindo qual página web nós gostaríamos que fosse aberta em nosso webview então bem-vindo a todos que estão acompanhando essa playlist ou se você ter caiu de paraquedas diretamente nesse vídeo sugiro que acompanhe os vídeos anteriores da playlist que a gente tá começando fazendo desde o início do projeto discutindo ali questões con de cada configuração de cada implementação de código mas se você já tá familiarizado é apenas alguma dúvida também bem-vindo a esse vídeo nós temos aqui o nosso formulário esse formulário que parece um
mini navegador e é de propósito esse desejo de que pareça o mini navegador nós temos aí um Edit texto para digitar o conteúdo a a o conteúdo né da url que nós queremos que seja executada e temos algumas alguns botões de ação normalmente botões de ação né estão Associados a gente fazer alguma confirmação né ou pedir que algo seja feito por exemplo num botão de ação de um atualização quero que seja feita uma atualização Ah num botão de ação eem avançar e voltar eu quero que seja feito o avanço do num caminho que eu tenho
de acesso de sites né numa árvore para a frente ou que ela retorne e nós temos também como confirmações é muito utilizado em formulários a gente tem um formulário inteiro para preencher preench ali meu nome endereço ao concluir esse preenchimento Eu tenho um botãozinho de ação em que eu digo o que ó eu concluí pode finalizar esse formulário enviar pra nuvem me devolver se teve alguma coisa de errado validar meu formulário etc então nós temos esses comportamentos para esses botões então observem que esses botões aqui né estão Associados a algo que eu queira quero que
seja executado aqui mas esses botões não estão fazendo solicitações a um preenchimento que eu fiz antes como por exemplo preencher Qual a URL qual o endereço do site que eu gostaria que fosse aberto então faria sentido a gente também ter esse botão poderia poderia fazer sentido sim né a gente tem um botão aqui que seja confirmar por exemplo uma lupa né processar algum algum ícone que represente bem para que abra essa URL então Primeiro passo é isso mas a gente também pode parar para analisar e pensar pô mas numa situação em que eu tenho apenas
um campo de texto será que faria sentido eu ter um botão de confirmação Será que eu não consigo ah inserir nesse campo de texto algo mais automático já que é apenas um campo a gente consegue ver por exemplo ali na no Google Chrome né Eu acredito que é que tá 100% assim nós preenchemos na hora que a gente tá preenchendo o próprio teclado já nos dá uma opção ali de uma lupa né de uma setinha para confirmar e o que que acontece automaticamente o texto que foi digitado aqui nessa caixinha de texto né nesse text
é processado e enviado para carregar nesse webview então não precisei do botão mas se alguém opcionalmente quiser utilizar um botãozinho para confirmar né então considerando os dois caminhos as duas possibilidades e que nós não sabemos o que seria o melhor Ambos são certos nós vamos utilizar as duas opções perfeito mas numa situação aí do teu app em produção você poderia analisar né Poderia lançar com os dois nada impede e através de uma análise de uma anal que esteu aí no teu app você poderia identificar onde tá sendo mais utilizado né o botão foi utilizado por
uma quantidade maior de pessoas ou se o enter para abrir o a URL do site na webview foi utilizado mais vezes ou não e através dessa dessa tua análise você decide se permanece com os dois né com as duas formas de fazer o acesso à página ou se você escolheria pelo enter ou se você escolheria por exemplo apenas o botão de confirmação tá então isso acaba sendo uma decisão de usuário né de experiência de usuário você teria que fazer bem então vamos seguir com os dois caminhos a gente vai precisar de um outro botão aqui
né Vamos adicionar esse outro botão fazer uma cópia tá a gente já tem um botão aqui todo implementado tá legal né V fazer uma cópia desse botão anterior e vamos colocar um botão aqui ó do ladinho do do Edit text tá então tá aqui o edit text até selecionei ele aqui ó já fez a seleção na nossa tela de visualização então V um enter bem aqui e vamos colar o que eu acabei de copiar 100% igual esse aqui então quando a gente verificou aqui esse tá ou esse aqui tá igual a esse né E tem
os demais que acontece primeiro ponto que a gente vai precisar modificar É o quê É o nome a identificação né então vou chamar aqui de submit tá seria a identificação de submissão da nossa URL tá poderia até ser submit URL submit o RL ficaria mais legal submit URL então perfeito tá até no padrão aqui dos demais nomes demais identificações é através dessa identificação que a gente consegue identificar esse elemento lá na nossa M activity Java e fazer nessa M activity Java né o acesso ao comportamento né a atribuição de de eventos né de regras para
para para os eventos desse elemento temos o que mais aqui ó a gente tem um ícone né esse rap content de altura e largur a gente vai manter para quem não não sabe seriam essas determinações também estão esclarecidos em outros vídeos da playlist bem Então temos esse ícone né da vindo do drawable do Android e a gente não quer ele né Vamos fazer a modificação dele tem uma for forma aqui legal de fazer essa modificação tá a gente vai continuar utilizando essa esse conjunto de arquivos do próprio Android tá tem um um ícone que fica
aqui do lado esse ícone representa a referência que a gente tá fazendo aqui no nosso src tá nosso resource Então se a gente dar um clique nele aqui ó que ah um clique só deu certo se a gente fizer um Clique nele já vai abrir essa essa telinha E nessa telinha que tá sendo aberta a gente tem tem algumas opções ó eu quero recursos do meu projeto eu quero recursos do Android ou outros ah nós vamos querer do Android né selecionei aqui Android e nós temos inúmeros ah ícones que nós poderíamos usar aí nesse elemento
que estão disponíveis aqui nos recursos do Android então eu poderia colocar aqui por exemplo palavra cheque ó temos aqui por exemplo um cheque tá eu vou utilizar esse Tá bom vou adicionar esse cheque aqui ó deu um duplo clique e já fez a modificação aqui em cima né primeiro que eu não acho tão legal esse cheque porque parece que é um checkbox que já foi marcado mas não não é isso né só como a gente não tem tantas opções a gente pode até procurar aqui se temos outras aqui Android e a gente também pode pegar
ícones né posso pegar um ícone png por exemplo tá que pode até ser interessante eu ter esse png em várias dimensões E e trazer el aqui meu drawable tá e através drawable eu fazer o acesso a esse elemento esse ícone eu posso inclusive construir em uma ferramenta nem tenho que baixar construir o meu ícone do jeitinho que eu quero tá png por exemplo com as bordinhas ali transparentes e trazer para cá e fazer o acesso aqui através do projeto a gente tá pulando tá evitando esse caminho mais demorado vai procurar um aqui seja legal tá
ver aqui um Play por exemplo Ah tem um aqui Play tipo uma setinha eu acho que esse play fica mais legal né ó ó fica mais legal ficou tipo Play né terminei aqui apertei um playzinho aqui para startar o carregamento da nossa tela Então não é o melhor mas eu acho que serve pro nosso exemplo então fizemos essas duas modificações aqui tem o content description a gente também já falou em outros vídeos da playlist valei voltar então voltar a palavra voltar ã coincidentemente Então vale você regressar a esses vídeos para verificar vou modificar o nome
aqui para ah Open abrir né porque no caso tá em português né bom abrir voltar avançar e recarregar bem e aqui tá uma mensagenzinha também né se a gente olhar tá uma mensagenzinha aí que que tá aparecendo nessa mensagem né Eu acho que a gente também já falou né Tá sugerindo que a gente faça o uso do string tá Ah então é interessante antes da gente acabar essa playlist Pode até ser que a gente também a tem falado de fazer essa modificação mas antes da gente fechar essa playlist que a gente também faç essa melhoria
tá de que lá no arquivo de string criar um um identificador nesse arquivo de string colocando os valores para todos os idiomas que a gente quer que o nosso app seja preparado para dinamizar a exibição de conteúdo ou seja exibir e abrir em portug inglês né e outros idiomas Então vamos deixar assim por enquanto sempre lembrando que a gente vai precisar em outra aula fazer essa modificação talvez na próxima ou na outra ou nas últimas feito isso vamos para o nosso m activity por para m activity através do activity que nós temos a implementação Java
associada a essa interface activity aberto fizemos essa impin na em uma das aulas anteriores e ela abrindo praticamente na hora que nos Create na hora que é executado ali nosso nosso activity é aberto através do load URL essa página do Google né mas a gente quer que abra com uma página Nossa tá e com e também possa abrir ah mudando né quero uma página quero outra né então enfim nós vamos utilizar esse comando bem aqui tá set1 editor Action list n a gente tem outro que é set setk list n para para pegar o comportamento
de uma confirmação da caixa de texto mas professor e o botão que a gente colocou bem aqui Ah então nós temos duas formas para executar nós temos tanto uma forma em que nós vamos pegar o comportamento da caixa de texto para identificar quando foi clicado num enter por exemplo né num Don numa numa conclusão né num botão de conclusão como também esse botão Então nós vamos ter duas formas de acionar Então vamos fazer essa implementação tá então primeiro vamos fazer a implementação do botão tá então para fazer a implementação do botão a gente vai utilizar
esse aqui tá para o edit textos então V deixar ele em standby então o que que a gente precisa aí a gente precisa de um elemento para fazer um instanciamento ao elemento que tá na nossa tela a gente precisa de uma variável de Instância pra gente acessar o elemento que tá na tela elemento que tá na tela é esse bem aqui né submit URL vou copiar aqui essa identificação ele é um image Button ou seja precisamos que a nossa Instância seja também um image Button então vamos aqui ó Image image buton Confirmei já veio automaticamente
aqui nos imports né ó ah image buton para os nossos imports não tinha Ah vamos criar aqui com o nome submit o nome é nosso critério ele vai receber através do find vi byad que é encontrar ali o elemento pela identificação nós vamos dizer aqui através do RD Qual que é a identificação desse elemento que no caso é o submit URL Pode ser que no primeiro momento apareça desse jeito aqui né porque a gente pode não tenha salvo né dar um Crol S aqui para garantir que tenha salvo mesmo se a gente voltar bem aqui
eu acredito que vai sumir a qualquer instante então com isso aqui né funcionando a gente tem o elemento que a gente tá vendo aqui na tela que é o nosso submit URL tá sendo instanciado através da variável submit então agora a gente consegue utilizar o comando submit e chamar por exemplo ó on Click on Click e aqui ó no nosso terceiro O que que a gente tem ó Set On Click list n nós queremos adicionar adicionar não nós queremos acessar e reescrever esse comportamento de clique através de um set clique nós temos nós estamos enviando
um um on clique para esse nosso para essa nossa Instância e essa nossa Instância representa aquele elemento que tá ali na tela que a gente acabou de ver né então a fazer isso aqui né confirmei tá Set On Click list né apareceu aqui on Click list né sugestão aí vou clicar aqui New e espaço quando você digitar New espaço ele vai aparecer já outra sugestão né que é View on Click is né se você confirmar já vai exibir automaticamente ó toda a estrutura prontinha já fazendo um override de um um clique com o parâmetro View
sendo recebido para aqui dentro a gente poder implementar o que seria o comportamento de clique que nós estamos setando perfeito então o que que nós queremos que seja setado nesse nesse nosso set clique nós queremos que seja setado o site que foi digitado no Edit texto tá para o nosso load URL ou seja seria isso aqui né só que a invés de ser esse texto estático seria o que tá dentro do Edit texto só que professor para eu acessar o edit texto também vou precisar da instância a Edit texto vamos Inclusive a gente vai implementar
também regras nessa Instância então já que a gente vai fazer isso vamos criar também essa Instância do Edit texto né Eu tenho um Edit texto chamado URL Field então vamos aqui ó vou criar aqui antes Edit text ó criei o edit text aqui eu fiz a a o pedido para usar essa classe de text já foi feito o impost automaticamente aqui em cima né ah porque como eu confirmei né já inseriu automaticamente se eu não tivesse confirmado provavelmente eu teria que nas sugestões também de fazer esse Import ou poderia também fazer digitando na unha mesmo
bem então vou chamar aqui de edt L edt URL também vou utilizar o find by ID ponto id e qual é o nome dele ó nós copiamos lá né URL Field tá então deu certo aqui é Edit URL então aqui nós conseguimos acessar absolutamente tudo que tá ali dentro daquela caixa de texto e o que que nós vamos fazer aqui na no evento de clique do botão nó vamos pegar o que tá dentro do Edit texto e mandar para o carregamento da nossa webu vamos fazer aqui ó web vi que já foi instanciado aqui em
cima né foi instanciado ali em cima e vamos atribuir através do load URL o carregamento desse conteúdo que vai ser o qu vai ser Edit texto Edit URL né ponto get texto tô pedindo através do evento de leitura de texto né que retorna um texto observem o seguinte ol retorna um editable tá pelo fato dele retornar um a table a gente vai precisar converter para string ó tanto que ficou aqui ó tá um problema qual problema que tá porque tá retornando o editable mas o load URL recebe um string ó recebe um string mas tá
sendo enviado um editable O que que a gente vai fazer two string tá então peguei esse texto editável e mandei para um two string e agora funcionou Beleza então através do nosso clique agora né O Clique bem aqui que que cli vai acontecer vai executar o Set On Click list e já tem um clique ali esperando esse um clique quando eu clicar vai determinar que o nosso webview que já foi instanciado antes vai carregar uma url que vai ser a URL está digitada na nossa caixinha de texto Então aqui já foi o primeiro passo o
segundo é se o nosso usuário opcionalmente não decidiu por usar esse botão nós vamos o comportamento também do Edit T eu vou tirar aqui da página inicial Tá vou deixar na hora que inicialize com Página em Branco tá bom bem então o nosso Edit texto vai ser outro vai ser outra regra tá então vai ser Edit Edit URL esse Edit URL a gente vai determinar o que ó tá vendo que eu comentei que a gente utilizar set Edit Action list o que que nós estamos dizendo aqui eu quero enviar ações quando meu editor for submetido
tá então esse S editor Action Listen que é o primeiro sendo sugerido aqui ele vai nos permitir capturar a ação da submissão daquele ah daquele editor de texto é submissão pode ser um botão de enter pode ser uma uma opção que o teclado sugeriu de pesquisar tá pode ser ah um enter do teclado numérico ou um enter do teclado Bird vai ser acionado a essa conclusão Então vão ter poucos eventos Associados aí dentro que vão dizer que tipo que tipo de ação Ele usou nessa submissão tá que a gente já vai ver New fiz a
mesma coisa ó New apte espaço já deu a opção aí ó de sugestão e a sugestão foi text viw que é o nosso tipo ponto editor Tex Então a gente vai concordar aqui ó perfeito tivemos ex mesado que nós tivemos quando fizemos ali a Adesão da sugestão com o click então só que no sugeriu n já gerou aqui editor Action editor Action vai ser onde nós vamos colocar regra interpretar Qual foi o botão que el utilizou para essa Action de submissão que nós poderamos fazer aqui I éde vem o código da ação perfeito Então vê
aqui o código da ação vem a Instância do elemento e vem um k um k event tá vamos utilizar esse I que é o código do evento que foi acionado para essa submissão se ele for igual aí ok aqui vai ser editor editor info tá vai ser editor info ponto e nós temos várias opções aqui ó se ah esse editor Action foi acionado por um Action de search de pesquisa por alguma opção que foi dada pelo teclado código E3 fo um Don vai ser código 6 esse Don abrange por exemplo ah entes que pode ser
de teclado numérico de teclado ah teclado default ah Action go então nós temos essas opções todas representadas por códigos Tá eu vou utilizar o Action que normalmente funciona bem para mim mas Observe se no teclado virtual de vocês isso vale lembrar de Quando vocês tiverem testando virtualmente quem tiver testando aqui com a máquina virtual não sei se tá exibindo a máquina virtual para vocês ó eu tenho duas máquinas virtuais Android quando vocês estão testando com a máquina virtual é muito comum de que na configuração aqui do Edit ele tenha settings de que ele venha com
esse enable keb input habilitado se tiver habilitado isso não não vai exibir o teclado virtual dentro do teu Android virtual Então você não vai conseguir simular bem a experiência né no teclado do teu usuário final né então a sugestão que vocêver vai fazer esse teste ó desabilite esse enable keb input tá tiver testando aí no teu celular virtual por que que eu tô dizendo isso porque quando você for testar comportamento ali das confirmações de submissão você vê se esse Action Don atendeu bem o fluxo de comportamento que você gostaria perfeito então aqui colocamos essa condição
do Action Don você pode inclusive utilizar um debug tá para quem vai utilizar debug não sei se exibe aí para para vocês Ah não sei se O OBS tá pegando mas aqui logo no topo tem um né Tem uma mini barata né esse esse inseto que tá exibindo em cima é do debug né o Icone muito utilizado para debug você pode utilizar o debug com o o Break Point acionado aqui tá com esse Break Point bem aqui ó Line idas Break Point tá com esse Break Point acionado e você clicar neste inseto em cima ele
vai fazer a parada aqui você vai poder ver qual o valor de I que tá vindo e cada acionamento tá do teclado então dá para você fazer uma análise bem legal bem vou tirar aqui então aqui né nós sabemos que foi acionada ali um evento de Dom de finalizado de fechado de concluído né feito isso O que é que nós vamos fazer absolutamente a mesma coisa que tá bem aqui né mesma coisa tá bem aqui então vai pegar o wv vai fazer o load el Edite texto etc etc e observe o seguinte que tá retornando
falso el vai retornar true né para confirmar de que foi tratado que foi trabalhado o comportamento desse Action é até melhor se a gente fizer tipo assim ó ó passou verdadeiro aqui nesse M Action Down rne né true caso contrário aí deixa cair lá no no entrou no IF né deixa cair aí no falso porque não foi executado nenhum comportamento nesse tion perdão e a outra coisa né é Observe o seguinte nós tivemos a mesma implementação para os as duas formas né que era carregar aqui a página tá as duas formas exatamente igual Até copiei
e colei essas duas formas foram apenas a cópia de uma única linha mas no futuro vocês vão encontrar muitas vezes situações que vão vir um conjunto de códigos tá então considerando situações que vocês possam ter trechos de código repetido então convém aí você ter um método para isso né eu vou chamar aqui de void né void Open URL por exemplo tá em que eu receberia o parâmetro qual seria a o texto né para abrir essa página então poderia ter aqui um URL e ao invés de eu ter esse mesmo código para todos os casos eu
teria isso sendo executado através de um método agora fica esse problema você copiou para cá né E nessa cópia ó webview não existe Professor Por que que não existe porque foi criado aqui Ah tudo bem como ele foi criado aqui ele só existe no escopo do on Create então o que que nós precisaríamos fazer ter a classe instanciada no escopo da própria classe fazendo a referência no onate para que eu pudesse no escopo da classe né o meu método ter acesso a esse nosso test vi da mesma forma nosso Edit texto também poderia fazer dessa
forma tá o nosso Edit texto no escopo da classe Opa para o escopo da classe e nós faros apenas a o instanciamento no Create então a gente teria consciência de que sempre qualquer método que fosse posteriormente sempre existi Instância por porque no Create do nosso activity sempre tá sendo gerada a Instância tá então gerou isso aqui ó Então já deu certo né como já deu certo porque já temos acesso direto a Edit texto eu poderia até tirar o parâmetro né Tiraria o parâmetro seria só openurl e aqui o que é que nós teríamos Open URL
né E aqui nós teríamos o qu open URL então se eu tivesse alguma modificação no carregamento da minha página tivesse até mesmo alguma regra para evitar que um conjunto de sites fosse aberto eu poderia adicionar essa regra aqui né eu não precisaria me preocupar nas duas formas que são diferentes de que chamar a mesma coisa tá então quando você for executar não vou executar aqui porque gera um delay ao mesmo tempo rápido de verificar tá um teste aí na máquina de vocês mas lembrem-se de no teste fazer a modificação aqui na edição do teu do
teu Android virtual device e show Advance settings e desabilitar o enable keb input porque ess aqui vai possibilitar que você veja o teclado virtual teu usuário fica ruim para você que não CONSEG digitar ali no teu teclado né você vai ter que fazer o teste digitando no teclado virtual mas é melhor porque você vai ter a noção mais realista de como o comportamento vai acontecer na situação de pesquisa na caixa de texto sem utilizar o botão perfeito Muito obrigado
