Versions Compared

Old Version 11

changes.mady.by.user Jose Porto

Saved on

compared with

New Version 12

changes.mady.by.user Jose Porto

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Tip

Para facilitar a criação de telas, além do desenho direto de objetos, há também a possibilidade da inserção direta de objetos completos, como caixas com listas, botões, gráficos, listas de alarmes, e outros mais que podem ser importados de bibliotecas externas WPF.

Toolbox de controles

Na área DRAW, no lado esquerdo é mostrado o painel de configuração de propriedades de telas e de controles de visualização. As seções seguintes mostram detalhes sobre estas configurações.

UId e Texto

Quando se cria um objeto ou um símbolo novo na tela, ele recebe um número que o identifica univocamente: O <Uid>. Este Uid pode ser rebatizado por um String qualquer, o que tem muita utilidade quando se necessita, por exemplo, escrever código de Script (CodeBehind) envolvendo o controle.
Como exemplo, apresenta-se um objeto tipo Texto usado na janela de Login para receber o código do usuário. Este objeto teve o seu numero alterado para txbUserName para facilitar seu entendimento dentro do código, conforme se pode ver na figura a seguir:

Para cada objeto item de tela ou também a própria Tela , pode-se escolher se o mesmo deve ou não participar dos Temas de cores, que podem ser utilizados não apenas na interface de engenharia, mas também nas telas dos projetos.

Text é a área onde se pode especificar uma legenda ou titulo para um controle que permita esta funcionalidade. Pode se especificar a Fonte, o tamanho e a cor do texto, além do texto propriamente.

Toda vez que se pode especificar uma cor e o objeto foi marcado como habilitado para Temas, ao invés de se escolher uma cor se escolhe uma função para a cor, por exemplo cor de fundo, cor de frente etc. Depois, conforme o Tema escolhido será apresentada a cor utilizada para aquela função no tema atual.

A opção Localizable deve ser marcada em caso de se estar utilizando dicionários de linguagens no projeto, e se desejar que este texto seja alterado de acordo com o dicionário. 

Propriedades dos Itens de Visualização

Para cada objeto item de tela ou também a própria tela possui propriedades de visualização que são mostradas a seguir.

Alinhamento de Conteúdo - Nos controles que há um conteúdo, como um texto, dentro de uma caixa ou quadro, são oferecidos os ajustes mostrados, que permitem a escolha do alinhamento deste conteúdo.

Aparência - Aparência do controle, inclui a escolha da cor de fundo ( ou de figura de fundo), e a existência ou não de uma linha ao redor do controle. Também pode ser escolhida a cor da linha e sua forma, tracejado, pontilhado, cheia. O fundo pode ainda ter a definição da percentagem de opacidade ou até transparência completa.

Transformação- Serve para definir inclinação do controle ou deformação angular do mesmo.

Layout- Define a posição na tela e o tamanho do controle.

Cores e Temas

Nesta nova versão foram melhorados tanto os temas no ambiente de desenvolvimento quanto os temas de projeto!

Temas do ambiente de desenvolvimento

  • Escolha entre vários temas para o estilo que você mais gosta, talvez para se adequar ao seu ambiente de uso (descanse seus olhos com o modo escuro).

  • Abra vários projetos ou várias cópias do mesmo projeto e cada um pode ter seu próprio tema para facilitar qual projeto você está trabalhando ou referenciando.

Temas de Projeto

  • Permite que os usuários escolham facilmente um tema com o novo seletor de tema para melhor se adequar ao seu ambiente ou habilidades visuais.

  • Construa facilmente seu próprio tema ou use um de nossos temas predefinidos.

  • É possível desabilitar o tema para um item ou até mesmo para uma página inteira, basta apenas preencher a caixa de seleção.

Janela Editor de Cores

Como já mencionado, em vários locais pode-se especificar cores, como em fundos, linhas textos. Nestes mesmos locais, neste caso somente em fundos, pode-se especificar ao invés de uma cor de uma imagem ou padrão como um reticulado.

Para esta definição, ao clicar-se nos locais apropriados para esta escolha (normalmente quadros com cores), aparece a janela para escolha de cores, Editor de Cores, mostrada na figura seguinte.

Nesta janela pode-se escolher não somente a cor, mas também, aparências de gradientes e saturação de cores com pretos e brancos.

Também nesta janela, pode-se escolher além da cor, uma função para esta escolha. Isto é a definição básica para o uso de Temas de cores. Na janela aparece a palavra DefaultColor, que será a cor utilizada sempre que não houver uma escolha de função. Então, se se usou esta cor e esta função para o fundo de um controle, sempre este local estará com esta DefaultColor, qualquer que seja o tema escolhido. Trata-se de uma virtualização da escolha da cor.

Janela de Cores de Temas

Na janela Editor de Cores, clicando-se ao lado do nome da função para uma cor, aparece a janela de definição de temas, com todas as cores que são definidas para cada função e para cada tema.

Na figura é mostrada esta janela. Nas colunas são apresentadas as cores de cada função para um determinado tema. Veja na coluna do tema Blue , são mostradas as cores que serão utilizadas em cada função de cor como DisplayBackground, TextForeground, etc.

Dinâmicas e Animações

A área de configuração Dynamics permite que você configure as mudanças em tempo real na aparência de um objeto, sua posição, seu tamanho, suas cores, o valor mostrado pelo objeto, a ação que o objeto deve apresentar quando um usuário o clica, e outras coisas. Esse comportamento dinâmico é configurado através da criação de elos entre as propriedades do objeto e as propriedades das Tags ou outras propriedades em tempo de execução do projeto.
Em alguns sistemas, a denominação animação é usada para se referir a essas mudanças dinâmicas em tempo de execução. No Action.NET usa-se o termo Dynamics para distingui-las claramente dos recursos de animação fornecidos pelo WPF. As animações WPF também se referem a alterações nas propriedades gráficas dos objetos executando nos monitores, mas usando temporizadores e outros status de objetos para dirigir a animação, e não os valores da base de dados em tempo real.
Quando você clicar duas vezes em um objeto, ou pressionar o botão Dynamics, ou selecioná-lo no menu de contexto do botão direito, é apresentada uma lista das dinâmicas que podem ser aplicadas no objeto selecionado.
A Tabela 3 lista as dinâmicas disponíveis.
Tabela 3: Dinâmicas e Animações

Configuração

Descrição

Action

Executa ações e comandos acionados pela interface do usuário.

Shine

Altera a aparência objeto dinamicamente.

TextIO

Dinâmica de Entrada e saída de textos

HyperLink

Abre um hiperlink.

Security

Define as permissões do objeto para executar ações, em tempo de execução

FillColor

Muda dinamicamente a cor de preenchimento do objeto

LineColor

Muda dinamicamente a cor da linha do objeto

TextColor

Muda dinamicamente a cor de texto do objeto

Bargraph

Dinâmica de barra gráfica

Visibility

Altera dinamicamente a visibilidade e opacidade objeto.

MoveDrag

Move dinamicamente o objeto.

Scale

Muda dinamicamente o tamanho do objeto.

Rotate

Gira o objeto dinamicamente.

Skew

Distorce o objeto dinamicamente.

TextOutput

Cria a dinâmica de saída de texto.

Anchor
Action_Dynamic
Action_Dynamic
Action Dynamic

Configuração

Descrição

Action

Executa a ação desencadeada pela interface do usuário.

Event

Escolha um dos eventos do mouse. Mais do que um evento pode ser selecionado para cada ação. Por exemplo: Uma ação para o evento MouseLeftButtonDown e outra ação para MouseLeftButtonUp.

Action

Selecione uma ação para o evento determinado:

  • Nenhum - Nenhuma ação.

  • SetValue - Define o valor do objeto.

    • Object - O objeto que vai receber o valor.

    • Valor - O valor que será passado para o objeto.

  • ToggleValue - Alterna o valor do objeto. Se o valor atual do objecto é zero, o valor vai para 1. Se o valor atual do objecto é diferente de zero, o valor vai para 0.

    • Object - O objeto que será alternado.

  • OpenDisplay - Abre um display.

    • Display- O nome da Tela que será aberta.

  • CloseDisplay-Fecha um display.

    • Display-O nome da Tela que será fechada.

  • OpenLayout - Abre um layout.

    • Layout - O nome do layout que será aberto.

  • RunScript - Executa um script que deve ser colocado na aba Display> CodeBehind. Execute uma das seguintes ações:

    • Digite o nome do novo método e clique Novo .

    • Escolha um dos métodos existentes no comboBox.

  • RunExpressions - Executa a expressão dada.

    • Expressão - Digite a expressão. Por exemplo: Tag.a + 1, ou Tag.a + Tag.b ou Math.cos (Tag.angle) * Math.PI.

    • Resultado (opcional) - Digite o tag ou a propriedade que irá receber o valor da expressão.

Info

Exemplos de Run Expresssions:

  • Somar dois valores e passar o resultado para outra tag.

Expressão-Tag.quantity1 + Tag.quantity2. Resultado-Tag.totalQuantity.

  • Incrementar um tag.

Expressão-tagCounter + 1. Resultado-tagCounter.

  • Incrementar um tag (0 - 10).

Expressão- If (tagCounter <10, tagCounter + 1,0). Resultado:-tagCounter.

Para mais informações, consulte "Configurando Expressões".

Dinâmica de Brilho (Shine Dynamic)

Configuração

Descrição

Shine

Altera a aparência do objeto dinamicamente.

IsMouseOver

Digite um tag que receberá o OverValue ou o NotOverValue.

OverValue

O valor de IsMouseOver quando o mouse está sobre o objeto.

NotOverValue

O valor de IsMouseOver quando o mouse não está sobre o objeto.

Tooltip

Um texto para legenda ao passar com mouse sobre o objeto

Mouse Over

A aparência do objeto quando o mouse está sobre ele. Appearance  Opacidade - A opacidade do objeto (0 = transparente, 1 =
opaco).

  • Scale - O tamanho do objeto (0.5 = metade, 1 = o mesmo tamanho, 1,5 = um ano e meio, 2 = dobro do tamanho).

  • OuterGlow - Define a cor do OuterGlow, deve-se marcar a seleção para ativar ou desativar este efeito.

  • TextColor - Define a cor do texto, deve-se marcar a seleção para ativar ou desativar este efeito.

Mouse Not Over

A aparência do objeto quando o mouse não está sobre ele: Appearance  Opacidade - O opacidade do objeto(0 = transparente, 1 =
opaco).

  • Scale - O tamanho do objeto (0.5 = metade, 1 = o mesmo tamanho, 1,5 = um ano e meio, 2 = dobro do tamanho).

Is Selected

A aparência do objeto quando o mesmo está selecionado: Appearance  IsSelected - Define se o objeto está selecionado

  • Opacidade - O opacidade do objeto(0 = transparente, 1 = opaco).

  • Scale - O tamanho do objeto (0.5 = metade, 1 = o mesmo tamanho, 1,5 = um ano e meio, 2 = dobro do tamanho).

Scale Reference

Anchor
Dinâmica_Text_I/O
Dinâmica_Text_I/O
Dinâmica Text I/O

Configuração

Descrição

TextIO .

Dinamica de entrada e saida de texto.
Se o texto é um valor de Tag ou uma propriedade, ele deve estar entre colchetes. Por exemplo: {Tag.analogInt1}

Binding Mode

Associar um objeto com uma tag:

  • TwoWay - Permite entrada e saída.

  • InputOnly - Somente permite entrada de tetxo (o valor do tag atual não é mostrado, mas novos valores podem ser inseridos).

  • OutputOnly - Somente saída de texto é permitida.

Object or Expression

Objeto (entrada) ou Expression (somente saida) que está conectada com a caixa de texto.

DesignModeCaption

O valor mostrado no modo de engenharia:

  • ShowObjectNames - O conteúdo do campo de texto é mostrado exatamente como ele é.

  • ShowPlaceHolders - São mostrados carcteres # # # , o número de caracteres é definida pelo campo MaxLength.

Input Range

Define o intervalo numérico para o valor inserido.

MaxLength

Define o número máximo de caracteres.

Format

Define o formato a ser usado para números na visualização

Configuração

Descrição

HyperLink

Abre um hyperlink.

HyperLinkType

Selecione o tipo de hyperlink:

  • http

  • ftp

  • file

  • mailto

  • telnet

Url

Configurar o URL para abrir om hiperlink

Anchor
Dinâmica_de_Security_(Segurança)
Dinâmica_de_Security_(Segurança)
Dinâmica de Security (Segurança)

Configuração

Descrição

Security

Defina as permissões do objeto em tempo de execução:

Disable

Digite um Tag, uma propriedade, ou uma expressão que retorna um valor. Considerando o valor resultante:

Verify Permissions

Quando selecionado, apenas os grupos de permissões escolhidos, podem acessar o objeto.

Confirm Message

Mostra um diálogo de confirmação antes de tomar alguma ação:

  • textBox - Digite a mensagem que irá aparecer na caixa de diálogo.

  • checkBox - Ativa ou desativa a Confirmar Mensagem.


Dinâmica Fill, Line e Text Color

Configuração

Descrição

FillColor

Muda a cor de preenchimento do objeto dinamicamente.

Expression

O valor usado para a dinâmica FillColor.

Change Color

  • UsingLimits - A cor resultante é determinada quando o valor for igual ou superior a um dos limites.

  • AbsoluteValue - A cor será o valor da expressão. O valor deve ser um nome válido de cor ou numero hexadecimal para cores. Por exemplo: "White" ou "# FFFFFFFF"

    Exemplo Limites:
    1 - Red
    10 - Blue
    Quando o valor é 0, o objeto terá sua própria cor (a dinâmica de preenchimento cor não vai fazer nada)
    Quando o valor é de 1 a 9, o objeto terá a cor vermelha. Quando o valor é superior a 10, o objecto terá a cor azul.

LineColor

Muda a cor da linha objeto dinamicamente:.

Expression

O valor usado para a dinâmica LineColor.

Configuração

Descrição

Change Color

  • UsingLimits - A cor resultante é determinada quando o valor for igual ou superior a um dos limites.

  • AbsoluteValue - A cor será o valor da expressão. O valor deve ser um nome válido de cor ou numero hexadecimal para cores. Por exemplo: "White" ou "# FFFFFFFF"

    Exemplo Limites:
    1 - Red
    10 - Blue
    Quando o valor é 0, o objeto terá sua própria cor (a dinamica de LineColor não vai fazer nada)
    Quando o valor é de 1 a 9, o objeto terá a cor vermelha. Quando o valor é superior a 10, o objecto terá a cor azul.

TextColor

Muda a cor do texto objeto dinamicamente:.

Expression

o valor usado para a dinâmica TextColor.

Change Color

  • UsingLimits - A cor resultante é determinada quando o valor for igual ou superior a um dos limites.

  • AbsoluteValue - A cor será o valor da expressão. O valor deve ser um nome válido de cor ou numero hexadecimal para cores. Por exemplo: "White" ou "# FFFFFFFF"

    Exemplo Limites:
    1 - Red
    10 - Blue
    Quando o valor é 0, o objeto terá sua própria cor (a dinamica de TextColor não vai fazer nada)
    Quando o valor é de 1 a 9, o objeto terá a cor vermelha. Quando o valor é superior a 10, o objecto terá a cor azul.


Dinâmica Bargraph

Configuração

Descrição

Bargraph

Dinâmica de gráfico de barras

Expression

o valor usado para a dinâmica de gráfico de barras.

Value Range

Os valores mínimos e máximos que correspondem ao percentual de preenchimento máximo e mínimo.

Fill (%)

O percentual mínimo e máximo de preenchimento. da barra gráfica

Bar Color

A cor do gráfico de barras.

Orientation

A orientação do gráfico de barras:


Dinâmica Visibility

Configuração

Descrição

Visibility

Altera dinamicamente a visibilidade e opacidade do objeto

Visible

Digite um tag, uma propriedade, ou uma expressão que retorne um valor. Considerando-se o valor resultante:

Tooltip

Um texto que será exibido como uma dica de ferramenta

Opacity

Opacidade

  • ObjectValue - O valor usado para definir a opacidade.

  • Range - Os valores mínimos e máximos que correspondem ao máximo e mínimo. de opacidade.

  • Opacidade - A mínima e máxima opacidade (0 - invisível, 0,5 - um pouco transparente, 1 - opaco).

Anchor
Dinâmica_MoveDrag
Dinâmica_MoveDrag
Dinâmica MoveDrag

Configuração

Descrição

MoveDrag

Movimenta dinamicamente o objeto

BindingMode

  • TwoWay - Entrada e saída causam movimentação

  • InputOnly - Apenas entrada causa movimento. O objeto não se move quando o valor do objeto muda.

  • OutputOnly - Apenas saída causa movimento. O objeto não se move com interação do usuário.

Horizontal Move

  • Expressão com a referência para movimento horizontal

  • Range - Os valores mínimos e máximos que correspondem à posições horizontais mínima e máxima.

  • Posição - As posições horizontais mínima e máxima

Vertical Move

  • Expressão com a referência para movimento vertical

  • Range - Os valores mínimos e máximos que correspondem à posições verticais mínima e máxima.

  • Posição - As posições verticais mínima e máxima

Dinâmica Scale

Setting

Descrição

Scale

Muda o tamanho do objeto dinamicamente.

Width Scale

  • Expressão - o valor usado para a escala de largura.

  • Range - Os valores mínimos e máximos que correspondem aos percentuais minimo e máximo da largura de escala

  • Escala (%) - O percentual mínimo e máximo de largura de escala.

Height Scale

  • Expressão - o valor usado para a escala de altura

  • Range - Os valores mínimos e máximos que correspondem aos percentuais minimo e máximo da altura de escala

  • Escala (%) - O percentual mínimo e máximo de altura de escala.

Scale Reference:

Anchor
Dinâmica_Rotate
Dinâmica_Rotate
Dinâmica Rotate

Configuração

Descrição

Rotate

Gira o objeto dinamicamente.

Expression

o valor utilizado para a rotação.

Value Range

Os valores mínimos e máximos que correspondem ao ângulo máximo e mínimo de rotação. Por exemplo: de 0 a 100

Angle

O ângulo mínimo e máximo de rotação. Por exemplo: 0-360

Center Reference

Anchor
Dinâmica_Skew
Dinâmica_Skew
Anchor
_bookmark259
_bookmark259
Dinâmica Skew

Configuração

Descrição

Skew

Distorce o objeto dinamicamente.

X-axis Skew

  • ObjectValue - o valor usado para a inclinação do eixo-X.

  • Range - Os valores máximo e mínimo que corresponde ao ângulos de desvio máximo e mínimo do eixo X. Por exemplo: de 0 a 100.

  • Skew (º) - O mínimo e o máximo ângulo de desvio do eixo X. Por exemplo: de 0 a 180 º.

Y axis skew

  • ObjectValue - o valor usado para a inclinação do eixo-Y.

  • Range - Os valores máximo e mínimo que corresponde ao ângulos de desvio máximo e mínimo do eixo Y. Por exemplo: de 0 a 100.

  • Skew (º) - O mínimo e o máximo ângulo de desvio do eixo Y. Por exemplo: de 0 a 180 º.

Skew Reference

Dinâmica TextOutput

Configuração

Descrição

TextOutput

Dinâmica de saída de texto.

Expression

Indica o texto que será mostrado no objeto.

Localizable

Indica se o texto deve ser traduzido quando o dicionário muda.

DesignModeCaption

O valor mostrado no modo de design:

  • ShowObjectNames-O conteúdo do campo de texto é mostrado exatamente como ele é.

  • ShowPlaceHolders - São mostrados os caracteres # # #, o número de caracteres é definido pelo campo

MaxLength

Define o número máximo de caracteres.

Format

Define o formato a ser usado para números na visualização

Panel

Nesta pagina:

Table of Contents
maxLevel2