Versões comparadas
Chave
- Esta linha foi adicionada.
- Esta linha foi removida.
- A formatação mudou.
O
cronappCronapp permite que novos
componentes para o blocoblocos de programação (cliente ou servidor) sejam criados
. É possível criar esses novos componentes dentro da própria plataforma e de acordo com a necessidade de cada projetoe adicionados na lista de blocos do Editor de Blockly. Dessa forma, é possível criar funções para atender as necessidades de cada projeto.
Dica |
---|
Esse documento apresenta como utilizar o Java para criar seus próprios blocos de programação e desenvolver blocos mais complexos, como a personalização de parâmetros, por exemplo. Caso necessite de blocos básicos, com a entrada de parâmetros e retorno, desenvolva-os de forma low-code, acesse o tópico "Criar blocos low-code customizados" da documentação Bloco de programação. |
Pré-requisitos
Antes de começar a seguir os passos do tutorial é preciso ter certeza de que se tem um ambiente minimamente preparado para reproduzir o exemplo. Abaixo estão os requisitos principais.
Requisitos:
- Projeto do tipo mobile que possua o lado servidor criado. Caso haja dúvidas de como criar esse tipo de projeto acesse o link ( Criar novo projeto );a documentação Criar projeto.
- Habilitar o botão Modo Avançado.
Visão Geral
Nesse tutorial iremos criar um componente, que obtém a quantidade de itens que uma lista possui, para os blocos uma função de bloco de programação do tipo servidor que obtém uma lista de números e retorna o menor valor.
Passos
CriarCriando pacote
Criar um novo pacote ( Em nosso exemplo o nome do pacote será menorValorLista) que É recomendável criar diretórios ou arquivos referentes aos novos blocos de programação do tipo servidor em um diretório específicos, de forma a melhorar a organização. Dessa forma, criaremos o pacote menorValorLista
que irá conter a classe java Java referente ao componente. Faz parte da boa prática de desenvolvimento criar diretórios ou arquivos referentes ao bloco de programação do tipo servidor no diretório Códigos Fonte Servidor.
Image Removed
Figura 1 - Criação do pacote
Clique com o botão direito no diretório java
Tooltip | ||||
---|---|---|---|---|
| ||||
|
, em seguida, escolha Novo, selecione Pacote e insira o valor "menorValorLista" na janela de Confirmação.
Image Added
Figura 1 - Criando o pacote
Criando classe Java
Criar classe javaO pacote criado deve receber um novo arquivo do tipo Java, Pacote>Novo>Java , dessa forma, clique no botão "+" ao lado do pacote criado e selecione Java (Figura 2).
Image Added
Figura 2 - Criação da classe Java
Após solicitar a criação do arquivo Java, o Cronapp Após selecionada a opção a IDE irá exibir a tela de escolha do modelo do de arquivo. Para o caso da criação de componentes, o modelo correto é o Selecione a opção Nova Função para Bloco de Programação como pode ser visto na (Figura 32.1). O botão Avançar confirma a seleção do modelo e exibe a tela de definição das informações.
Image RemovedImage Added
Figura 2 - Criação da classe java
Image Removed
Figura 3 - .1 - Escolha do modelo do arquivo
Definir informações do componente
O componente a ser criado pode ter as seguintes informações definidas: Nome da classe, Nome da função, Nome reduzido da função, Descrição da função e Categoria.
Image Removed
Para finalizar, preencha os campos informados na Figura 2.2.
Image Added
Figura 2.2 Figura 4 - Definindo informações sobre o componentebloco
title | Informações da função |
---|
Campos:
- Nome da classe: define o nome da classe Java onde está inserida a função.
- Nome da função: atribui o nome da função ao bloco de programação que será exibido no Editor de Blockly.
Nome da classe - MenorValorLista
Nome da função - obterMenorValorLista- Nome reduzido da função
- : define o nome para a função Java.
- Descrição da função
Categoria - Obter Valor
- : descreve a finalidade da função e será exibida na aba lateral da lista de blocos ou ao colocar o mouse em cima do bloco.
- Categoria: define o nome da nova categoria que será criada para o bloco.
As informações preenchidas acima serão exibidas posteriormente ao selecionarmos a função criada no editor de blocos de programação servidor (Figura 6).
Alterando anotações do método
Alterar parâmetros do componente(função)
A geração do código base para o componente vem com alguns parâmetros padrõesalgumas anotações padrão, como, por exemplo: type
, returnType
e Var e String input
. Esses valores não são fixos e podem ser alterados. Ver Ver Figura 53.
title | Mais sobre |
---|
Atributos dos parâmetros:
- type: tipo
- do parâmetro de entrada da função
- .
- description: descrição do parâmetro de entrada da função
- .
- returnType: tipo do parâmetro de saída da função String.
- String input: tipo da variável e seu nome "input". O nome da variável pode ser alterado
Exemplo de definição do tipo do parâmetro:
type = ObjectType.STRING
- para qualquer outro.
Image Added
Figura 3 - Classe Java recém-criada
Utilize CTRL + Espaço para exibir os ObjectTypes
disponíveis (Figura 3.1):
Image Added
Figura 3.1
Image RemovedFigura 5 - Estrutura interna do componente
Image Removed
Figura 6 - Alguns dos tipos de parâmetro que podem ser utilizados
Image Removed
Figura 7 - Alguns dos métodos contidos em uma instância de um objeto do tipo Var
Informações | ||
---|---|---|
| ||
Mais detalhes sobre as anotações acesse Utilizando anotações. |
Adicionando
Adicionarcódigo
Primeiramente, devemos alterar os tipos de dados atuais para list e , além disso, devemos acrescentar algumas informações sobre o parâmetro no código:código. Após a adequação dos parâmetros, o código referente a funcionalidade pode ser adicionado ao corpo da função. Nesse exemplo, o código retorna o menor valor contido em uma lista.
Bloco de código | ||||
---|---|---|---|---|
| ||||
package menorValorLista; import cronapi.CronapiMetaData; import cronapi.ParamMetaData; @CronapiMetaData(categoryName = "Obter Valor") public class MenorValorLista { @CronapiMetaData(type = "function", name = "obterMenorValorLista", description = "Função que retorna o menor valor contido em uma lista") public static String obMenVaList(@ParamMetaData(description = "Parâmetro: Descrição do parâmetro") String input) throws Exception { return "Input " + input; } } |
Bloco de código | ||||||||||
---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||
package menorValorLista; import java.util.Comparator; import java.util.Optional; import cronapi.CronapiMetaData; import cronapi.ParamMetaData; import cronapi.Var; import cronapi.CronapiMetaData.ObjectType; @CronapiMetaData(categoryName = "Obter Valor") public class MenorValorLista { @CronapiMetaData(@CronapiMetaData(type = "function", name = "obterMenorValorLista", description = "Função que retorna o menor valor contido em uma lista") public static Var obMenVaList(@ParamMetaData(type = ObjectType.LIST ,description = "Lista: listaLista que será passadaenviada para a função") Var list) throws Exception { } |
Após a adequação dos parâmetros, o código referente a funcionalidade pode ser adicionado ao corpo da função. Nesse exemplo, o código que retorna o menor valor contido em uma lista é o seguinte:
Bloco de código | ||||||||||
---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||
Optional<Var> opt = list.getObjectAsList().stream().min(Comparator.comparingLong(Var::getObjectAsLong)); return opt.get(); |
Image RemovedFigura 8 - Código adicionado ao corpo da função referente a funcionalidade do componente
}
} |
Image Added
Figura 4 - Alterações realizadas na função
Algumas alterações foram realizadas no código base, são elas, respectivamente:
- Tipo de retorno da função: alterado de String para Var;
- Tipo do parâmetro da função: foi acrescentado que o tipo do parâmetro é uma lista;
- Descrição do parâmetro: essa descrição será exibida no editor de bloco de programação (Figura 6);
- Variável do parâmetro: o nome da variável do parâmetro foi definido como list e seu tipo é Var;
- Corpo da função: o corpo adicionado para a função é responsável por retornar o menor valor da lista recebida como parâmetro.
Caso seja apontado algum erro em algum
temotrecho do código, clique no termo e aperte "CRTL + . (ponto)"
e após isso aparecerá uma lista com o comando importar biblioteca. Clique no comando referente a primeira biblioteca que aparece na lista. (Repita isso para todos os termos que estão grifados como erro e caso não funcione verifique se o termo não foi digitado errado)ou clique no ícone da lâmpada para exibir uma opção de correção. Ao digitar o código é possível usar o "CTRL + Espaço" para exibir os métodos de um objeto (Figura 4.1). Salve o arquivo Java em seguida.
Image Added
Figura 4.1 - Alguns dos métodos contidos em uma instância de um objeto do tipo Var
Acessando a função
Após salvar o método da classe Java que criamos, clique, no menu do sistema, em Projeto > Recompilar > Recompilar e Reabrir Projeto para que a nossa função seja carregada (Figura 5).
Image Added
Figura 5 - Recompilando e reabrindo o projeto
O último passo
Acessar a função
O último passo após a inserção do código no componente é a visualização desta função como disponível para utilização no um bloco de programação disponível. Abra um bloco de programação . Primeiro devemos recarregar o projeto para que a nossa função seja carregada.
Image Removed
Figura 9 - Recarregar projeto
Image Removed
do tipo Servidor e verifique na categoria Obter Valor o bloco obterMenorValorLista (Figura 5.1).
Image Added
Figura 5.1 Figura 9.2 - Função sendo exibida em sua respectiva categoria no bloco de programação
Exibição de informações
servidor
As É possível visualizar as informações definidas durante o desenvolvimento da função passando-se são exibidas ao passar o ponteiro do mouse sobre o componente bloco ainda na Categoria (Figura 105.2).
Image RemovedImage Added
Figura 10 - Exibição das informações da função5.2 - Exibição das informações da função
Testando a função
Agora vamos testar a função que desenvolvemos nesse tutorial. Para isso foi criado a variável "lista" que recebe uma lista com 3 valores inteiros, essa variável é passada por parâmetro para o bloco criado (obterMenorValorLista), que retornará o menor valor da lista e exibirá em uma notificação na tela. Criamos um botão na tela para chamar a função de bloco mostrarMenorValor (Figura 6) e o resultado será exibido no navegador (Figura 6.1).
Âncora figura6 figura6
Image Added
Figura 6 - Bloco que exibe o menor valor da lista
Image Added
Figura 6.1 - Menor valor da lista exibido na tela
Âncora anotacaoJava anotacaoJava
Anotações
As Anotações (annotations) têm o objetivo de possibilitar a declaração de metadados ao longo do código que podem ser posteriormente interpretadas por um compilador ou pré-compilador que irá realizar alguma tarefa predefinida. As anotações evitam, em muitos casos, a criação de arquivos XML de configuração que tornam tão difícil a compreensão de alguns sistemas. Anotações podem ser utilizadas, por exemplo, para indicar que um método não deve mais ser usado (@Deprecated
) ou que ele foi sobrescrito (@Override
).
Nos exemplos citados, é importante que fique claro que a presença de anotações não influi no comportamento da classe ou de seus objetos, mas sim adicionam funcionalidades anexas a uma determinada classe.
Observações:
- metadados são informações (dados) que falam sobre a classe mas não fazem parte da classe em si.
- Anotações são representadas com o símbolo prefixo @ (arroba).
Como usar anotações na plataforma Cronapp
As anotações na plataforma Cronapp podem ser aplicadas nos seguintes casos: declaração de métodos, classes, interfaces, parâmetros e enumerações.
Existem duas anotações principais que podem ser referenciadas e utilizadas em classes do tipo Java, são elas:
- @CronapiMetaData
- @ParamMetaData
A anotação @CronapiMetaData contém os seguintes elementos:
Tipo | Elemento | Valor |
---|---|---|
String | type | Se o valor definido for "function " a função criada ficara visível no editor de blockly, se "internal " a função ficará disponível apenas de forma interna via código. |
String | platform | Se o valor definido for "M " significa que a função criada será exibida apenas no editor de bloclky "Mobile", se o valor for "W " apenas do blockly "Web". |
String | categoryName | Permite que o usuário final determine uma nova categoria. |
String[] | categoryTags | Palavra(s)-chave utilizada(s) para auxiliar a busca de categorias de funções dentro do bloco de programação. Esse elemento pode receber mais de um valor. |
String | name | Nome da função a ser apresentada no bloco de programação. Permite chave de internacionalização. |
String[] | nameTags | Palavra(s)-chave utilizada(s) para auxiliar a busca de funções dentro do bloco de programação. Esse elemento pode receber mais de um valor. |
String | description | Descrição da função. Permite chave de internacionalização. |
String[] | params | Descrição sobre o(s) parâmetro(s) de entrada da função. Esse elemento pode receber mais de um valor. Permite chave de internacionalização. |
boolean | displayInline | Permite que os parâmetros da função no bloco de programação sejam passados, em apenas uma linha, ao invés de serem passados de forma individual, uma linha por parâmetro no bloco da função. |
boolean | arbitraryParams | Define se a função poderá receber parâmetros além dos definidos durante sua criação no momento da utilização desta no bloco. |
ObjectType[] | paramsType | Tipo do(s) parâmetro(s) de entrada da função. Esse elemento pode receber mais de um valor. (O tipo do parâmetro é baseado no enum ObjectType) |
ObjectType | returnType | Tipo de retorno da função. (O tipo de retorno é baseado no enum ObjectType) |
CategoryType | category | Tipo de categoria a qual a função faz parte. (O tipo de categoria é baseado no enum CategoryType) |
Nota | |||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| |||||||||||||
Os elementos ObjectType e CategoryType são do tipo enumeradores (enum) definidos respectivamente a seguir:
|
Image Added
Figura 7 - Exemplo do código de uma função utilizando alguns elementos da anotação @CronapiMetaData
A anotação @ParamMetaData contém os seguintes elementos:
TIpo | Elemento | Valor |
---|---|---|
ObjectType | type | Tipo do parâmetro. (O tipo do parâmetro é baseado no enum ObjectType) |
String | defaultValue | Valor padrão adicionado a um parâmetro de entrada de uma função. |
String | description | Descrição do parâmetro. Permite chave de internacionalização. |
String[] | keys | Opções de valores a serem adicionados num parâmetro de entrada do tipo seletor vertical (dropdown). Esse elemento pode receber mais de um valor. |
String[] | values | Valores a serem passados para função de acordo com a opção selecionada (keys) no seletor vertical (dropdown) do parâmetro da função. Esse elemento pode receber mais de um valor. Permite chave de internacionalização. |
Âncora | ||||
---|---|---|---|---|
|
Internacionalização
As chaves de internacionalização ficam contidas em um arquivo de extensão "*.properties
". Arquivos desse tipo podem ser utilizados para armazenar parâmetros do tipo string no formato (chave=valor). Para utilização das chaves de internacionalização durante a criação de componentes de software na IDE Cronapp coloca-se a chave desejada entre chaves duplas, como por exemplo: description = "{{functionToQueryInDatasource}}".
Diferentemente das aplicações desenvolvidas no Cronapp que suportam todos os idiomas, o conteúdo desenvolvido para ser utilizado dentro do Cronapp, como bloco de programação ou componente visual, só poderão ser internacionalizados nos idiomas português e inglês.
Nota | ||
---|---|---|
| ||
As chaves de internacionalização não são fixas e podem ser alteradas ou adicionadas quando necessário. Para saber mais, acesse: Internacionalização. |
Para conseguir internacionalizar os blocos de programação, uma pasta com o nome "i18n
" (destaque 2 da figura 8) deve ser criada no mesmo diretório (destaque 1) onde está o arquivo Java que vão gerar os blocos de programação (destaque 8). A pasta "i18n
" deve conter os arquivos de internacionalização: "Messages_en_US.properties" e "Messages_pt_BR.properties". Ao abrir os arquivos de internacionalização JSON, a ferramenta Chave de internacionalização é exibida, permitindo adicionar as novas chaves e traduzi-las automaticamente.
Image Added
Figura 8 - Local do diretório i18n em relação ao arquivo Java e ferramenta que facilita a internacionalização
Nesta página
Índice |
---|