Aula 06
createViewManagers e createNativeModules – Modulos Nativos do Android no React Native
Summary
# Resumo da Aula sobre Módulos Nativos do Android e React Native
Nesta aula, o instrutor continua a implementação de um módulo nativo chamado `Toast` no React Native. A seguir, estão os principais pontos abordados:
1. **Implementação do Método Show**:
- O método `show` foi implementado para o componente `Toast`.
- O instrutor menciona a possibilidade de encadear métodos, usando `toast.show()` diretamente.
2. **Registro do Módulo**:
- É necessário criar uma nova classe que implementa `ReactPackage` para registrar o módulo `Toast`.
- A classe é chamada `PacoteToast.java`.
3. **Criação da Classe PacoteToast**:
- A classe implementa a interface `ReactPackage` do React, importando do pacote correto.
- O construtor pode ser omitido, mas um construtor vazio também pode ser adicionado.
4. **Método CreateViewManagers**:
- Este método deve retornar uma lista vazia de `ViewManager`, utilizando `Collections.emptyList()`.
5. **Método CreateNativeModules**:
- O método `createNativeModules` será responsável por criar uma lista de módulos nativos.
- Uma lista chamada `listaModulos` é criada e uma nova instância do módulo `Toast` é adicionada a essa lista, passando o `ReactContext`.
- O retorno do método é a lista de módulos, que contém a instância criada.
6. **Considerações Finais**:
- O instrutor enfatiza a importância de importar as classes corretas e de definir corretamente os métodos.
- A aula termina com a promessa de continuar na próxima sessão.
O instrutor se despede e convida os alunos para a próxima aula.
Video Transcript
Olá pessoal, estamos de volta.
Nossa aula para poder aprender a fazer módulos nativos do Android e no React Native.
Então vamos aqui continuar.
Estou dentro da classe módulo toast.
Acabamos de fazer o método show.
Vamos na toast mas esqueci de mostrar toast.
Você tem a opção de pôs caro na variável ou você pode fazer uma corrente já com o
ponto show aqui.
Está na mesma.
Então vamos...
Pode fazer assim e falar toast positivo.
Pode dar no chain.
Tanto faz.
Então vou deixar assim mesmo.
Então toast.show e eu pôs essa nova toast na variável e chamei o método show.
Atenção.
Não se esqueça aí.
Pronto.
Agora só nos registrar esse módulo.
A gente vai ter que criar uma nova classe.
Para criar uma classe que vai entender do React Package, pacote react.
Então aqui dentro da parte da módulo os nativos.
Vamos criar aqui o nosso pacote.
Vamos ver aqui.
Vamos chamar de pacote toast.java.
Então vamos criar uma classe.
Criar uma classe chamada pacote toast.
Esqueci do nome class.
Vamos ver se eu não esqueci class aqui.
Tem class.
No pacote toast.
Nem precisa de construtor.
Se você quiser construtor sem vazio pode escrever também mas eu não vou escrever.
Então para esse cara aqui ele vai ter que implementar uma interface para o React Package.
Deixa eu dar aqui.
So implementa.
implementa react package.
Se você interface aqui react package que vai vir da onde?
Import react package.
Vai vir do com facebook.react.pacage.
Não tem bridge.
Cuidado não tem bridge aqui não importa.
com facebook.react.pacage.
Não esqueci de definir o pacote package modos nativos do com.
Tá bom.
Então criamos a classe pacote toast que implementa react package.
Agora vamos fazer aqui.
Tá bom.
Essa primeira função aqui não vai ter nada para a gente fazer é só retornar uma lista
vazia tá.
Essa é a função chamada create view managers tá.
Create view managers.
Não vamos retornar nada somente uma lista vazia.
Para isso tá eu vou usar o collections.
Return.
Vou retornar o que?
Lista vazia usar o collections.emptylist.
Vão lista vazia para poder usar o collections tem que importar.
Vou importar aqui em cima.
Java util.collections.
Tá bom.
Legal agora vamos definir a assinatura dessa função.
Essa função vai retornar uma lista.
Então vamos dizer aqui list mas é lista de que tá bom.
Lista de chamado view manager tá view manager.
Então vamos ter que importar esse cara também mas da onde é que vem.
Então vai vir da onde com.facebook.react.
Pode aqui ponto UI UI UI UI UI manager.
Manage tá.
Ponto view manager.
Vamos cuidar com os imports.
Então ele vai retornar a lista de view manager.
Vou botar aqui public tá.
Público.
Agora o parâmetro tá parâmetro vai ser o contexto do react.
Aquela mesma coisa react a application context.
React context tá.
Mas a gente não tá usando né.
Mas deixa aí mesmo tá.
Então vamos importar react application context import com Facebook ponto react ponto bridge
ponto react application context tá.
Tá bom então vamos terminar com o override a anotação override pra esse método tá
bom.
Se aumentar aqui pra você ver melhor.
Vamos usar o método create view manager.
Definimos né na verdade que já tava lá.
Então vamos dar um override com a anotação.
Ele retorna uma lista vazia os collections ponto empty list chamei esse método.
Note que ele retorna uma lista de view manager lista de view manager.
O parâmetro é o react context que a gente não usou.
Tá bom.
Legal.
Tudo certo aí.
Agora vamos continuar com outro método tá esse método aqui a gente vai se importar
é o create native módulos tá esse método aqui vai retorna uma lista tá e a gente vai
fazer uma instância do nosso módulo toast tá.
Então vamos primeiro aqui tá criar uma lista tá vamos criar uma lista.
Vou chamar-se lista de módulos.
Agora a lista de que é lista de que vai ser uma lista de native módulo tá vamos já
já importar.
Lista de native módulos eu vou usar o realist mesmo tá o realist você pode digitar native
módulo de novo aqui se quiser mas também não precisa pode ser assim também.
Depende de você tá qualquer maneira eu deixar aí mesmo.
Vamos importar agora onde é que vem o list Java ou Tio import Java ou Tio ponto list tudo
certo né.
Onde é que vem o realist mesmo coisa Java ou Tio a realist tá agora onde é que vem
native módulo vem do bridge tá então vou aqui e duplicar essa linha a native módulo
então com Facebook react bridge native módulo tá tá certo então criamos uma lista de módulos
nativos né.
Agora eu pego o que eu pego a lista de módulos vou adicionar o item a lista mas adicionar
o que né o que tá vamos já já ver no final você retorna a lista de módulos tá.
Return módulos.
Agora o que que vai adicionar essa lista.
Vai ser o novo módulo tos tá então se lembra do módulo tos módulo tos você quase aqui
vamos fazer nova instância usando o new módulo tos tá bom se lembra que a gente tem que
passar o contexto do react então vamos fazer o react context tá bom.
react context mas da onde é que vem esse cara vai vindo o parâmetro tá que a gente
ainda não definiu então vamos definir que o reac context vem com o parâmetro é aquela
mesma coisa viá que apliquei esse contexto tipo tá já que a gente já tá aqui vamos
terminar de definir o valor de retorno tipo vai ser uma lista de native módulo né e
vai ser público public e não se esqueça do override override anotação tá bom então
vamos ver aqui se a gente não esqueceu de importar nada.
Criamos o método create native módulos argumento é react context tipo react application
context falou de retorno a lista de native módulos tá criamos uma lista o rei list tem
nada ainda adicionamos uma nova instância do nosso módulo tos passa o react context
que é necessário para o construtor se lembra construtor aqui react context.
E aí eu vou estar voltando aqui para o pacote do sbd já retorna essa lista tá muito
importante você escrever esse cara certo que é isso que eu importo aqui esse parte aqui
é adicionar a nova instância.
Tá bom então o que tá a gente fazer uma pausa e te vejo na próxima aula tá até mais.
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: