Velocity powered by Wavelink

Editando Elementos da Tela

Cada tela TE consiste em vários elementos, incluindo texto de tecla, campos de cursor, rótulos de dados, campos, cabeçalhos e itens de menu. Cada um deles é editável por meio do Velocity Console, que oferece várias opções de configuração para criar um estilo único ou de marca, o qual é aplicado por meio do mecanismo de renderização HTML e CSS embutida no aplicativo.

Assista a um vídeo relacionado (3:16)

A guia Telas é composta por quatro colunas:

1.Lista de telas. Todas as telas associadas a um projeto, juntamente com marcas e nomes de modelos, estão listadas aqui. Você pode navegar entre telas selecionando uma tela numerada a partir daqui.

2.Tela importada. A tela tradicional em preto e verde capturada pelo TE client. Esta coluna mostra a tela antes de qualquer reformatação moderna.

3.Tela reformatada. As telas capturadas no TE são renderizadas com o mecanismo HTML e CSS embutido do Velocity para mostrar projetos de tela mais modernos. Elementos individuais podem ser selecionados aqui e suas propriedades editadas na coluna Elementos de tela.

4.Elementos de tela. Aqui, você pode manipular propriedades de elementos reformatados individuais.

Os seguintes recursos para editar elementos de tela estão disponíveis para você por meio do Velocity Console:

Telas preditivas e de modelo. Depois de importar telas para o Velocity Console, as telas preto e verde são automaticamente traduzidas para uma aparência amigável para dispositivos móveis. Essas telas são rotuladas como "Preditiva", o que significa que não são afetadas por quaisquer alterações manuais e estão sujeitas ao mecanismo de renderização HTML e CSS embutido do Velocity e seus estilos universais. Quando alterações manuais são feitas em uma tela, ela é denominada "Modelo", com estilos e formatação únicos para essa página. Para importar telas para o seu projeto para editar estilos de elementos de tela individuais, consulte Importando telas.

Temas. Os elementos em uma tela podem ser editados por tela, o que significa que as alterações feitas em um único elemento de tela não serão aplicadas a todos os elementos de um tipo similar. Ou, por meio do uso de temas, você pode criar estilos de formatação para cada tipo de elemento que é aplicado em todas as telas. Alterar o tema global para um projeto não altera o status de uma tela de "Preditiva" para "Modelo". Para obter mais informações sobre temas, consulte Configurando definições do projeto.

Os temas definidos na guia Tema serão substituídos quando os elementos individuais forem editados na guia Telas.

Texto de tecla e zonas do cursor. Por meio do uso do texto da tecla, você pode criar um modelo de tela no qual as alterações de reformatação se baseiam. Se outras telas contiverem o texto de tecla selecionado, essa tela será reformatada automaticamente para os estilos aplicados na tela em que o texto de tecla está atualmente localizado. Você também pode criar zonas de cursor para estabelecer várias regras de modelo em uma única tela que alteram o modelo à medida que os usuários se movem de campo para campo.

Abrangência. Você pode mover elementos individuais e colocá-los lado a lado para a expansão de elementos. Por exemplo, em um dispositivo Android, você poderia abranger os campos de texto de nome de usuário e senha com seus rótulos de dados para que eles apareçam lado a lado.

Tabelas. Estruturam o layout de elementos em linhas e colunas adicionando uma tabela à tela reformatada. Quando uma tabela é criada, ela consiste em células vazias, para as quais você pode arrastar e soltar elementos. Isso é especialmente útil para apresentar vários elementos, como rótulos de dados e campos, ou mesmo vários itens de menu.

Quero saber como...

 

Para capturar telas para um perfil de host do aplicativo de emulação de terminal Ivanti , consulte Capturando telas do TE Client.

Lista de telas

Todas as telas associadas a um projeto são exibidas aqui, em uma lista ordenada pela data em que foram capturadas pelo TE Client. Além disso, esta lista exibe tags associadas e o modelo aplicado. O objetivo das tags é permitir que você organize tags com base em telas inacabadas, grupos específicos de telas e funções de tela, para citar alguns.

Para auxiliar no agrupamento de telas semelhantes ou para localizar mais facilmente uma tela específica, você pode usar tags para descrever o conteúdo de uma tela. Você pode adicionar tags manualmente clicando duas vezes no espaço à direita do número da tela. Adicione todas as palavras de tag relevantes, separadas por uma vírgula.

Além disso, você pode reordenar as telas arrastando e soltando o número da tela na ordem desejada.

Não é possível incluir símbolos com tags.

Se você associar a mesma tag a várias telas, poderá usar a barra de pesquisa para filtrar com base em tags individuais ou múltiplas. Você pode usar operadores lógicos como + e - para incluir ou excluir tags de uma pesquisa.

Adicionar telas

Abre um diálogo por meio do qual você pode selecionar telas importadas do TE Client.Se você capturou telas por meio do TE client, estas devem aparecer como um único arquivo contendo todas as telas adicionadas. Quando você adiciona este arquivo, todas as telas associadas serão exibidas na coluna Lista de telas.

Quando você selecionar uma tela, seu conteúdo original preto e verde aparecerá na coluna Tela importada, enquanto que a versão renderizada aparece na Tela reformatada.

Você pode adicionar vários arquivos de captura de tela a um projeto. Todas as novas telas adicionadas são juntadas na parte inferior da lista de tela.

Tela importada

A tela tradicional em preto e verde capturada pelo TE client será exibida nesta coluna.Todos os campos de texto aqui são identificados e renderizados usando o mecanismo HTML e CSS embutido do Velocity.

Apesar de a maioria das ações no Velocity ser realizada na Tela reformatada e nas colunas Elemento de tela, você ainda pode realizar funções aqui como corresponder modelos, adicionar zonas de cursos e criar novos elementos.

ClosedPara adicionar texto de tecla para correspondência de modelos

Você pode adicionar vários campos de texto de tecla para correspondência de modelos. Outras telas são comparadas a esta tela, e se o texto de tecla identificado for encontrado, essas telas serão anexadas ao mesmo modelo.

Se você criar dois campos de texto lado a lado, eles se combinarão automaticamente em um único campo de texto.

1.Clique duas vezes onde você deseja adicionar o texto de tecla no painel Tela importada.

2.Clique no botão Adicionar texto de tecla.

3.Clique em Salvar para reter as alterações.

ClosedPara adicionar zonas de cursor

1.No painel Tela importada, clique duas vezes ou clique e arraste onde você deseja adicionar a zona de cursor.

2.Clique no botão Adicionar zona do cursor.

3.Clique em Salvar para reter as alterações.

A primeira zona de cursor que você adicionar a uma tela deve ser onde o cursor está atualmente localizado na tela importada. Da mesma forma, você não pode remover a zona do cursor com o cursor localizado nele até que todas as outras zonas do cursor tiverem sido excluídas.

Tela reformatada

Esta coluna mostra a tela importada com o mecanismo de renderização HTML e CSS embutido aplicado. O que são telas pretas e verdes na coluna Tela importada agora são campos, rótulos e botões amigáveis para dispositivos móveis. Você pode selecionar cada elemento e editar suas propriedades na coluna Elementos de tela.

Modelo

Atribui um nome ao modelo quando as alterações são feitas em uma tela. Todas as telas com o mesmo modelo exibem o mesmo nome de modelo. Se outra tela com o mesmo modelo for alterada, um novo modelo será criado para evitar alterações em outras telas.

Quando o texto de tecla for adicionado ou as zonas do cursor forem removidas, e isso fizer com que um modelo anteriormente pareado não corresponda mais, um novo modelo será criado. Da mesma forma, se você executar qualquer alteração em campos individuais, isso criará um novo modelo. Para corresponder a um modelo anterior, as alterações adicionadas anteriormente devem ser removidas ou as zonas de cursor adicionadas novamente. Ao fazê-lo, os usuários são alertados sobre a alteração e solicitados a confirmar. Se confirmado, o modelo original será substituído pelo modelo atual. Quando você cria um novo modelo de alterações feitas, ele recebe uma prioridade maior sobre outros modelos. O que isso significa é que os modelos alterados sempre anularão os modelos anteriores.

Se você deseja retornar ao modelo anterior, clique no botão Excluir modelo na guia Telas.

Os nomes dos modelos são usados ao criar escopos específicos da tela. Ao criar um nome de tela, você pode associar scripts que são executados somente quando esta tela (e qualquer outra compartilhando o mesmo nome de modelo) for acessada.

Você pode alterar manualmente o nome do modelo conforme necessário.

O nome do modelo é usado na guia Scripts para identificar os escopos específicos do modelo para um script. Use o valor aqui, precedido pelo símbolo @.

Adicionar tabela

Adiciona um elemento de recipiente de tabela que permite arrastar elementos existentes e colocá-los lado a lado dentro de um contêiner com linhas e colunas. As tabelas podem incluir todos os tipos de elementos.

Elementos de tela

Esta coluna oferece todas as configurações e opções para manipular elementos reformatados. A partir daqui, você pode alterar a formatação dos elementos, adicionar itens do menu de contexto e criar banners de tela. Basta selecionar um elemento na coluna Tela reformatada e começar editar as propriedades dele aqui.

ClosedTela

Cor do plano de fundo

Define a cor de plano de fundo de toda a tela.Isso pode ser definido em uma tela por tela ou usando temas.

Suprimir banner

Oculta um banner global na tela individual. Se um banner for criado no nível do tema, esta opção permite ocultá-lo nas telas selecionadas. Até que um banner global seja definido, esta opção não poderá ser alterada.

Elemento de banner

Ativa um elemento de banner que aparece na parte superior da tela. Quando configurado como Não, o aplicativo navegará até a guia Elementos para aplicar estilo, definir um título de banner ou fazer o upload de uma imagem de logotipo. Isso pode ser definido em uma tela por tela ou usando temas.

Elemento de rodapé

Adiciona um rodapé à parte inferior da tela. Você pode arrastar e soltar elementos novos ou existentes nesse elemento. O rodapé e quaisquer elementos incluídos dentro dele são fixados na parte inferior da tela, mesmo durante a rolagem.

Plano de fundo do rodapé

Define a cor do plano de fundo do elemento de rodapé.Isso só pode ser feito se o Elemento de rodapé estiver habilitado.

Excluir modelo

Remove o modelo da tela selecionada e redefine a formatação da tela.

Excluir tela

Remove a tela selecionada do seu projeto.

ClosedElementos

Propriedades da tabela

Linhas

Define o número total de linhas contidas na tabela. Por padrão, ele é definido como 2.

Reduzir o número de linhas em uma tabela não exclui nenhum elemento localizado nas células que estão sendo excluídas. Esses elementos são removidos da tabela e colocados abaixo.

Colunas

Define o número total de colunas contidas na tabela. Por padrão, ele é definido como 2.

Reduzir o número de colunas em uma tabela não exclui nenhum elemento localizado nas células que estão sendo excluídas. Esses elementos são removidos da tabela e colocados abaixo.

Largura

Define o quanto da tela que a tabela ocupa horizontalmente. Por padrão, ele é definido como 100%.

A tabela sempre será alinhada à esquerda.

Cor do plano de fundo

Define a cor do plano de fundo deste elemento.Isso pode ser definido na tabela ou no nível do tema.

Cor alternativa da linha

Define a cor de plano de fundo de cada linha alternada na tabela, começando com a segunda linha. Isso pode ser definido na tabela ou no nível do tema.

Dinâmico

Permite tratar uma tabela como dinâmica, com campos selecionáveis.A ativação desta opção oferece acesso às opções Comando Navegar para cima, Comando Navegar para baixo e Selecionar comando . As linhas selecionadas são distinguidas das outras para alertar os usuários que a linha está sendo usada.

Comando Navegar para cima

Envia um valor de pressionamento de tecla para navegar para cima na linha dentro de uma tabela dinâmica.

Comando Navegar para baixo

Envia um valor de pressionamento de tecla para navegar para baixo na linha dentro de uma tabela dinâmica.

Selecionar comando

Envia um valor de pressionamento de tecla para selecionar o campo atual para inserir dados em uma tabela dinâmica.

Propriedade do elemento

Tipo de elemento

Especifica o tipo ou a classe de um elemento. Quando um tema é definido, elementos do mesmo tipo estão sujeitos aos mesmos estilos. Você só pode editar os tipos de elementos tela a tela.

Os tipos de elementos disponíveis incluem:

Cabeçalho. Título de texto que identifica a tela atualmente ativa. Um cabeçalho não pode ser adicionado aos elementos abrangidos.

Rótulo de dados. Texto estático de sub-cabeçalho que é usado para rotular campos. Este elemento permite que você altere o rótulo para uma tela reformatada, mas ele não alterará a versão em preto e verde deste rótulo.

Valor de dados. Texto estático de subcabeçalho que é usado para rotular campos. O texto para este valor não pode ser alterado.

Campo. Campos de texto vazios nos quais os usuários finais podem inserir texto manualmente.

Item de menu. Botões que possibilitam a navegação de usuários finais em diferentes telas. Um item de menu não pode ser adicionado aos elementos abrangidos.

Botão. Botões que possibilitam a navegação de usuários finais em diferentes telas. Estes são semelhantes aos itens de menu, mas são formatados para exibição em telas. Eles não podem ser adicionados aos elementos e rodapés abrangidos.

Cada elemento possui seus próprios estilos padrão associados, conforme definido pela formatação preditiva do Velocity. Para obter mais informações, consulte Formatação preditiva.

Remover\Remover tudo

Ao selecionar Remover, você remove o elemento de tela selecionado da tela reformatada. Ao selecionar Remover tudo, você remove todos os elementos da tela reformatada. Para adicionar um elemento de tela, veja as etapas abaixo. Isso não pode ser definido no nível do tema.

Propriedades do banner

Título

Criar um elemento de cabeçalho que aparece na parte superior da tela. O texto inserido aqui aparecerá dentro desse elemento. Quando uma imagem também for carregada, o texto neste campo aparecerá à direita da imagem do logotipo. Esta opção só aparece quando Elemento do banner estiver habilitado.

Imagem

Carrega uma imagem de logotipo e coloca-a na parte superior de cada tela. As imagens não devem ser mais largas do que 100 pixels ou mais altas do que 60. Esta opção só aparece quando Elemento do banner estiver habilitado.

Propriedades da fonte

Família

Especifica a família de fontes para ser usada no elemento. Quando um tema for definido, elementos do mesmo tipo estarão sujeitos aos mesmos estilos de família de fontes.

Serif

Sans-serif

Monospace

Tamanho

Define o tamanho do texto da fonte do elemento. Isso pode ser ajustado de 10 para 20 pontos. O valor-padrão depende do tipo de elemento selecionado.

Negrito

Selecionar esta opção fará com que o texto do elemento fique em negrito. Por padrão, ela não está selecionada.

Itálico

Selecionar esta opção fará com que o texto do elemento fique em itálico. Por padrão, ela não está selecionada.

Sublinhado

Selecionar esta opção sublinhará o texto do elemento. Por padrão, ela não está selecionada.

Cor da Fonte

Define a cor do texto visível para este elemento.

Cor do plano de fundo

Define a cor do plano de fundo deste elemento.

Texto

O texto que aparece para esse elemento na tela reformatada. Esta configuração não substitui nenhum texto para as telas pretas e verdes padrão. Isso não pode ser definido no nível do tema.

Comando

Associa o pressionar de uma tecla específica a um item de menu. Quando selecionado, o comportamento associado a esse pressionamento de tecla será enviado para o perfil de host.Por exemplo, no servidor de demonstração, o comando para um item de menu pode ser o número 3. Quando enviado, o usuário navegará para a próxima tela. Isso não pode ser definido no nível do tema.

Os comandos aceitos incluem as seguintes teclas pressionadas:

F1 a F24

CTRL- [letra única, maiúsculas e minúsculas]

Valores hex de código de tecla (p. ex., {hex:E03B} para F1), sem uma \ ou 0x precedendo o valor hex.

Macros (p. ex., {hex:E050}{hex:E04D}{pause}{AutoEnter} para "para baixo", "direita", com pausa de 250 milissegundos e, em seguida, pressionamentos da tecla "Enter")

Para obter uma lista de todos os valores hexadecimais suportados, consulte Códigos e comandos de teclado.

Propriedades do teclado

Exibir teclado

Define o comportamento do pop-up do teclado quando um elemento de Campo for selecionado. Isso não pode ser definido no nível do tema.

Exibir. O teclado aparecerá automaticamente ao usar a tecla Tab para chegar ao campo.

Ocultar. Se o teclado estiver ativo, ele será automaticamente ocultado ao usar a tecla Tab para chegar ao campo.

Desabilitar. Os teclados personalizados e padrão não podem ser usados ao usar a tecla Tab para chegar ao campo.

Teclado em retrato

Define o teclado personalizado padrão a ser usado quando uma tela está sendo exibida no modo retrato. Isso não pode ser definido no nível do tema.

Se for deixado em branco, o teclado-padrão personalizado será usado, que é o teclado mais alto listado no Painel Teclados da tela Teclados.

Teclado em paisagem

Define o teclado personalizado padrão a ser usado quando uma tela está sendo exibida no modo paisagem. Isso não pode ser definido no nível do tema.

Se for deixado em branco, o teclado-padrão personalizado será usado, que é o teclado mais alto listado no Painel Teclados da tela Teclados.

ID do componente

Especifica o identificador de campo. Este campo não pode ser alterado e é automaticamente atribuído após a criação do elemento. A finalidade desse valor é para servir de referência em scripts que afetam campos específicos.

ID do escopo

Especifica o escopo da tela e do campo. Isso não pode ser alterado e é automaticamente atribuído após a criação do elemento.

O valor aqui consiste no nome do modelo e na ID do componente, separados por dois pontos e precedidos pelo símbolo @.Você deve copiar e colar este valor de campo ao definir um escopo específico do campo na guia Scripts.

ClosedMenu de contexto

Adicionar novo

Adiciona um novo item de menu de contexto, permitindo que você especifique um Título de item de menu e Comando de atalho. Os itens de menu não podem ser adicionados ao nível do tema.

Adicionar voz

Habilita capacidades de texto para fala e fala para texto para esse item de menu. Além disso, isso adiciona o campo Frase correspondente, o qual requer uma macro de voz no Comando de atalho para concluir uma ação de voz específica.

Item de menu global

Especifica o item do menu como específico da tela ou global. Se configurado como Ligado, o item de menu aparece no menu de contexto de todas as telas.Se configurado como Desligado, o item de menu aparece apenas no menu de contexto da tela atual.

Itens de Menu

Cria e edita itens de menu para o menu de contexto.

Nesta seção, você pode configurar as seguintes configurações:

Título do item de menu. O texto que aparece como rótulo para um item de menu de contexto.

Comando de atalho. Associa o pressionar de uma tecla específica a um item de menu. Para ver exemplos dos comandos aceitos, consulte Códigos e comandos de teclado.

Remover. Excluir o item de menu selecionado.

Concluído. Aplica as alterações no menu de contexto, que são visíveis no painel Tela reformatada.

Habilitado por voz

Habilita o uso de frases ativadas por voz para acessar as funções do menu de contexto. Isso torna visível o campo Frase correspondente.

Frase correspondente

Define o comando de voz para ativar o item do menu. Qualquer frase pode ser inserida aqui, desde que o Client possa pronunciá-la. Frases correspondentes só podem ser criadas para itens de menu de contexto.

Quando essa frase correspondente for detectada, ele executará automaticamente qualquer macro, texto ou script atribuído ao campo Comando de atalho.

Comandos de atalhos de voz

Ao usar o Velocity Client com Speakeasy, ele vem pré-carregado com comandos-padrão. Para invocar esses comandos, eles devem ser incluídos no menu de contexto global ou na tela com o valor listado abaixo. Esses comandos não requerem arquivos de gramática adicionais.

Aumentar volume

{voice:volumeUp}

Diminuir volume

{voice:volumeDown}

Repetir

{voice:repeat}

Falar mais rápido

{voice:faster}

Falar mais devagar

{voice:slower}

Calibrar

{voice:calibrate}

Editando elementos

Elementos individuais no painel Tela reformatada são interativos, permitindo que você manipule os elementos de estilo ou mesmo crie novos elementos que ainda não estão presentes na tela importada.

ClosedPara adicionar um elemento de tela

1.Clique duas vezes onde você deseja adicionar o novo elemento da tela no painel da tela importada.

2.Clique no botão Novo elemento.

3.Configure o elemento da tela conforme necessário.

4.Clique em Salvar para reter as alterações.

O novo elemento não aparecerá na tela importada, apenas a tela reformatada.

ClosedPara editar um elemento de tela

1.Selecione o elemento de tela desejado no painel Tela reformatada.

2.Edite o elemento da tela conforme necessário.

3.Clique em Salvar para reter as alterações.

ClosedPara alterar a ordem dos elementos da tela

1.Selecione e arraste o elemento de tela desejado no painel Tela reformatada.

Uma seta vermelha aparece no lado esquerdo do painel para indicar onde o elemento será colocado quando solto. Os rótulos de dados, os valores de dados e os campos podem ser colocados um no outro para abrangência horizontal, exibindo os elementos lado a lado nos dispositivos.

2.Solte o elemento no local desejado.

3.Clique em Salvar para reter as alterações.

ClosedPara criar elementos de abrangência

1.Selecione um elemento existente e arraste-o para outro elemento.

2.Quando um > vermelho aparece para indicar a colocação ao lado do elemento estacionário, solte o elemento.

O elemento que você arrastou aparece ao lado do elemento existente. Você pode expandir elementos adicionais, e eles se deslocarão automaticamente para a próxima linha quando elementos suficientes forem colocados lado a lado.

Não é possível adicionar cabeçalhos ou itens de menu para expansão de elementos.

ClosedPara adicionar uma tabela

1.Clique no botão Adicionar tabela acima do painel da tela reformatada. Uma tabela de duas colunas por duas linhas aparece na parte superior da tela.

2.Mova-a para o local desejado na tela reformatada.

3.Clique e arraste elementos para as células individuais para adicioná-las à tabela. Não é possível adicionar mais de um elemento a uma célula.


Este artigo foi útil?

O tópico era:

Impreciso

Incompleto

Não foi o que eu esperava

Outro