Versions Compared

Version Old Version 1 New Version Current
Changes made by

Jose Porto

Leonardo Porto

Saved on

Key

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

O ambiente de trabalho Desenhar (Draw) disponibiliza todas as ferramentas para a construção de telas gráficas para a aplicação. Pode-se partir de telas vazias e criar objetos, ou pode-se incorporar objetos prontos com várias dinâmicas de visualização ou de ação.

Drawing (Desenhar)

Image Removed

Para entrar neste ambiente clique o ícone de Desenhar (Draw)
No Action.NET o ambiente Desenhar possui três abas:

  • Drawing (Desenho) onde são mostradas e podem ser editadas as telas. Na aba de Desenho, existem uma barra de ferramentas vertical no lado esquerdo da área de trabalho e uma barra horizontal na parte de baixo da mesma área, orientadas a tarefas sobre os objetos dentro de uma tela.

  • CodeBehind para a escrita de Scripts relacionados à tela. Nesta aba há um Editor de Código fonte e já aparecem os textos dos protótipos dos procedimentos que são ativados por eventos básicos sobre telas. Se necessário estes textos devem ser preenchidos com códigos para modificar o procedimento padrão da tela.

  • Symbols com a biblioteca de símbolos gráficos disponíveis no projeto. Neste grid pode-se editar atributos de símbolos. Para criar um símbolo, usar o botão direito do mouse sobre um objeto em uma tela.

Code Behind - Scripts de Telas

Use a aba CodeBehind para definir um conjunto de funções relacionadas com a Tela. Você pode escrever código tanto em VB.Net como em CSharp. Você também pode alternar entre os dois. Se você alterar a seleção da linguagem, o sistema converterá automaticamente o código existente para o correspondente na linguagem selecionada.
Se você precisar de referências a outras partes de código também criados por você, use Run > Build > References para estabelecer estas referências.
As funções colocadas no CodeBehind podem ser executadas ao abrir ou fechar uma tela, ou quando a tela já está aberta, dependendo de como você configura o código. Você pode usar CodeBehind para definir métodos de tratamento dos cliques do mouse sobre a tela ou de entrada de comandos para serem executados em telas específicas.
Para Telas do tipo diálogo, use o método pré definido DialogOnOK, que é chamado quando o botão OK, também pré definido na caixa de diálogo, é pressionado. Se este método retornar True, o diálogo é fechado, se retornar False, o diálogo continua aberto. Este método é comumente usado para garantir a validação de dados na caixa de diálogo (que deve então solicitar ao usuário para corrigir entradas incorretas antes de fechar o diálogo).
O código por trás das telas tem os seguintes métodos pré-definidos
Tip

The work environment Draw provides all the tools for the construction of graphic displays for the application. You can start from empty displays and create objects, or you can embed ready-made objects with various visualization or action dynamics.

Nesta pagina:

Table of ContentsmaxLevel2

Drawing

Image Added

To enter this environment click the Draw (Draw)
In Action.NET the environment Draw has three tabs:

  • Drawing where the displays are shown and can be edited. In the Drawing tab, there is a vertical toolbar on the left side of the desktop and a horizontal bar at the bottom of the same area, oriented to tasks on the objects within a display.

  • CodeBehind for writing display-related Scripts. In this tab there is a Source Code Editor and already appear the texts of the prototypes of the procedures that are activated by basic events on displays. If necessary, these texts must be filled with codes to modify the standard display procedure.

  • Symbols with the library of graphic symbols available in the project. In this grid you can edit symbol attributes. To create a symbol, right-click on an object on a display.

Displays Code Behind

Use the tab CodeBehind to define a set of display-related functions. You can write code in both VB.Net and CSharp. You can also switch between the two. If you change the language selection, the system automatically converts the existing code to the corresponding one in the selected language.
If you need references to other pieces of code also created by you, use Run > Build > References to establish these references.
The functions placed in CodeBehind can be performed when opening or closing a display, or when the display is already open, depending on how you configure the code. You can use CodeBehind to define methods of handling mouse clicks on the display or input commands to run on specific displays.
For Dialog displays, use the predefined method DialogOnOK, which is called when the OK, also predefined in the dialog box, is pressed. If this method returns True, the dialog closes if it returns False, the dialogue remains open. This method is commonly used to ensure data validation in the dialog box (which should then prompt the user to correct incorrect entries before closing the dialog).
The code behind the displays has the following predefined methods:

Code Block
languagec#
DisplayOpening () - ExecutadoExecuted quandowhen athe telascreen estáis abrindoopening.
DisplayIsOpen () - ChamadoCalled emat intervalosregular regularesintervals deof tempotime enquantowhile ascreen telais está abertaopen
DisplayClosing () - ExecutadoExecuted quandowhen athe telascreen estáis se fechandoclosing.
DialogOnOK () - ChamadoCalled quandowhen othe botão OK debutton umaof telaa dedialog diálogoscreen éis pressionadopressed:
                Retornando Returning 1 allows permitethe dialog oto diálogobe serclosed Fechadoby pelothe sistemasystem.
                 RetornandoReturning 0 impedeprevents othe diálogodialog defrom serbeing fechado.
Você pode adicionar suas próprias variáveis e outros métodos dot NET neste texto de código
closed.

You can add your own variables and other DOT NET methods in this code text.

Info

NOTA - Como as Telas nos Clientes são projetadas para funcionar em ambientes distribuídos e web, recomendamos evitar o uso de funções que não permitam a execução em "confiança parcial", ou que se referem a caminhos de arquivos físicos.

Ferramentas de desenho

A aba Drawing tem os seguintes barras de ferramentas e controles para criar, formatar e configurar as Telas:

  • Barra Vertical - No lado esquerdo da aba Drawing. Use estes botões para desenhar formas, adicionar botões, e criar janelas especiais. Para detalhes sobre estes botões, ver Tabela 1.

  • Barra Horizontal - Na parte inferior da aba Drawing. Use estes botões para agrupar, combinar, alinhar e fixar os objetos selecionados. Para mais informações, ver Tabela 2.

  • Aparência, Dynamics, DisplaySettings e outras configurações - No painel a esquerda da aba, abaixo dos botões do menu principal. Estas configurações variam de acordo com as características e funcionalidades do tipo de objeto selecionado.

Drawing - Barra de ferramentas vertical

A tabela a seguir apresenta os ícones da barra de ferramentas Vertical do espaço Drawing e as suas funcionalidades.

Botão

Descrição

Image Removed Selection Tool

  • Clique em um objeto para selecioná-lo.

  • CTRL + clique para selecionar vários objetos (e grupos de objetos), um de cada vez. Mantenha pressionada a tecla CTRL enquanto clica em cada objeto.

  • Shift + clique para alternar objeto selecionado entre mais de um objeto selecionado.

  • Clique em uma área aberta da tela, em seguida, selecione um grupo de elementos, destacando os elementos enquanto arrastando o mouse e mantendo pressionado o botão esquerdo do mouse.

  • Clique duas vezes em um objeto para abrir a janela de configuração Dynamics, que permite definições para propriedades de objetos dinâmicos.

Image Removed Direct Selection Tool

  • Use esta ferramenta para selecionar um objeto dentro de um grupo (e modificar suas propriedades). Clique no objeto para selecioná-lo.

    • Você também pode adicionar, remover e modificar os pontos em um polígono com a Direct Selection Tool:

    Para mover o ponto, selecione-o clicando no ponto e segurando o botão esquerdo do mouse
    pressionado. Arraste o ponto para sua nova posição.

  • Clique duas vezes em um ponto para adicionar um novo ponto adjacente ao ponto selecionado.

  • Para excluir um ponto selecionado pressione o botão direito.

    • Image Removed Hand Tool

    Use a ferramenta Mão para modificar a janela de visualização clicando no fundo da Tela e mantendo pressionado o botão esquerdo do mouse em seguida, mudar a tela para a posição desejada.

    Geometric objects tools

    Use o Botão direito do mouse para encerrar o uso de cada
    ferramenta. Para adicionar, alterar e remover os pontos depois de criar um polígono ou poli-linha, use a ferramenta de seleção direta.

    Image Removed
    Rectangle

    Cria um objeto retângulo.

    Image Removed
    Ellipse

    Cria um objeto elipse.

    Image Removed
    Polygon

    Cria um objeto polígono.

    Image Removed Polyline

    Cria um objeto polilinha.

    Image Removed Button

    Cria um objeto botão.

    Image Removed
    Text Output

    Cria um objeto de saída de texto.

    Image Removed Text Box

    Cria um objeto de entrada/saída de texto.
    Para vincular o objeto de texto de I / O com uma tag, clique duas vezes no objeto de texto de I / O. Na janela de configuração dinâmica selecionar TextIo dinâmico.

    Image Removed CheckBox

    Cria um objeto do tipo "check box". Clicando com o botão direito do mouse tem-se acesso a criação dos seguintes outros objetos:
    Image Removed Cria um objeto radio button Image Removed Cria um objeto combo box. Image Removed Cria um objeto list box.

    Image RemovedCria um objeto senha.
    Image Removed Cria um objeto "Pega data"
    Image Removed Cria um objeto date/time text box. Image Removed Cria um objeto rótulo.
    Image Removed Cria um objeto controle deslizante.
    Depois de selecionar o objeto deste menu, ele se torna o objeto default para este botão na barra vertical.

    Image Removed Insert Symbol

    Clicando este botão mostra a Biblioteca de Símbolos que inclui tanto os símbolos pre definidos como os definidos pelo usuário.

    Image Removed Symbol Factory

    Abre o aplicativo Symbol Factory para obtenção de símbolos prontos, vetoriais, em grande variedade.

    Image Removed Image Resource

    Abre a janela de biblioteca de imagens (recursos), para se obter delas imagens para uso na tela.

    Image Removed Web Browser

    Cria um objeto Web Browser. Clicando com o botão direito do mouse tem-se acesso a criação dos seguintes outros objetos:
    Image Removed Cria um objeto Page Selector, onde os usuários podem ir para escolher diretamente para uma outra Tela na aplicação.
    Image Removed Cria um objeto Report Viewer . Image Removed Cria um objeto n XPS Viewer.
    Image Removed Cria um objeto janela filha (Child Window).
    Image Removed Cria um componente WPF externo. - Neste caso aparece uma janela para a escolha do objeto a ser criado, dentre os controles WPF cadastrados no projeto. Veja em "Configurando componentes WPF"
    Nota: Depois de selecionar o objeto deste menu, ele se torna o objeto default para este botão na barra vertical.

    Image Removed Alarm Window

    Cria um objeto Janela de Alarme. Posicione a janela de alarme na tela e faça um duplo clique sobre ela para configurar seus parâmetros. Para mais informação veja em "Configurando uma Janela de Alarmes" Também está disponível o ícone para criação de um objeto AlarmArea.

    Image RemovedTrend Window

    Cria um objeto Janela de Tendência. Posicione a janela de tendência na tela e faça um duplo clique sobre ela para configurar seus parâmetros. Para mais informação veja em "Configurando a Janela de Tendência (Legacy)"

    Image Removed DataGrid Window

    Cria um objeto janela DataGrid. Posicione a janela DataGrid na tela faça um duplo clique sobre ela para configurar seus parâmetros. Para mais informação veja em "Configurando uma Janela DataGrid"

    Drawing - Barra de ferramentas Horizontal

    A tabela a seguir apresenta os ícones da barra de ferramentas Horizontal do espaço Drawing e as suas funcionalidades.

    Image Removed

    Panel

    NOTE - Because Client displays are designed to work in distributed and web environments, we recommend avoiding the use of functions that do not allow "partial trust" execution, or that refer to physical file paths.

    Drawing tools

    The tab Drawing you have the following toolbars and controls to create, format, and configure displays:

    • Vertical Bar - On the left side of the Drawing tab. Use these buttons to draw shapes, add buttons, and create special windows. For details on these buttons, see Table 1.

    • Horizontal Bar - At the bottom of the Drawing tab. Use these buttons to group, combine, align, and pin selected objects. For more information, see Table 2.

    • Appearance, Dynamics, DisplaySettings and other settings - In the left panel of the tab, below the main menu buttons. These settings vary depending on the characteristics and functionality of the selected object type.

    Drawing - Vertical Toolbar

    The following table displays the Vertical toolbar icons of the Drawing space and their features.

    Button

    Description

    Image Added Selection Tool

    • Click an object to select it.

    • CTRL + click to select multiple objects (and groups of objects), one at a time. Hold down the CTRL key while clicking on each object.

    • Shift + click to switch selected object between more than one selected object.

    • Click an open area of the display, then select a group of elements, highlighting the elements while dragging the mouse and holding down the left mouse button.

    • Double-click an object to open the Dynamics configuration window, which allows settings for dynamic object properties.

    Image Added Direct Selection Tool

    • Use this tool to select an object within a group (and modify its properties). Click the object to select it.

    • You can also add, remove, and modify points in a polygon with the Direct Selection Tool:

      • To move the point, select it by clicking the point and holding the left mouse button

        Pressed. Drag the point to its new position.

      • Double-click a point to add a new point adjacent to the selected point.

      • To delete a selected point press the right button.

    Image Added Hand Tool

    Use the Hand tool to modify the preview window by clicking on the bottom of the display and holding down the left mouse button then changing the display to the desired position.

    Geometric objects tools

    Use the right mouse button to end the use of each
    tool. To add, change, and remove points after you create a polygon or poly-line, use the direct selection tool.

    Image Added
    Rectangle

    Creates a rectangle object.

    Image Added
    Ellipse

    Creates an ellipse object.

    Image Added
    Polygon

    Creates a polygon object.

    Image Added Polyline

    Creates a polyline object.

    Image Added Button

    Creates a button object.

    Image Added
    Text Output

    Creates a text output object.

    Image Added Text Box

    Creates a text input/output object.
    To link the I/O text object with a tag, double-click the I/O text object.

    Image Added CheckBox

    Creates a "check box" object. By right-clicking the mouse button, you have access to the creation of the following other objects:
    Image Added Creates a radio button object Image Added Creates a combo box object. Image Added Creates a list box object.

    Image AddedCreates a password object.
    Image Added Creates a "Catch date" object
    Image Added Creates a date/time text box object. Image Added Creates a label object.
    Image Added Creates a slider object.
    After selecting the object from this menu, it becomes the default object for this button in the vertical bar.

    Image Added Insert Symbol

    Clicking this button shows the Symbol Library that includes both pre-defined and user-defined symbols.

    Image Added Symbol Factory

    Opens the Symbol Factory app to obtain ready-made, vector symbols in wide variety.

    Image Added Image Resource

    Opens the image library window (resources) to get images from them for use on the display.

    Image Added Web Browser

    Creates a Web Browser object. By right-clicking the mouse button, you have access to the creation of the following other objects:
    Image Added Creates a Page Selector object, where users can go to choose directly to another display in the application.
    Image Added Creates a Report Viewer object. Image Added Creates an XPS Viewer n object.
    Image Added Creates a child window object.
    Image Added Creates an external WPF component. - In this case appears a window for the choice of the object to be created, among the WPF controls registered in the project. See in "Setting up WPF components"
    Note: After selecting the object from this menu, it becomes the default object for this button in the vertical bar.

    Image Added Alarm Window

    Creates an Alarm Window object. Position the alarm window on the display and double-click on it to configure its parameters. For more information see "Setting up a Alarm Window" Also available is the icon for creating an AlarmArea object.

    Image AddedTrend Window

    Creates a Trend Window object. Position the trend window on the display and double-click on it to set up its parameters. For more information see "Setting up the Trend Window (Legacy)"

    Image Added DataGrid Window

    Creates a DataGrid window object. Position the DataGrid window on the display double-click on it to configure its parameters. For more information see "Setting up a DataGrid Window"

    Drawing - Horizontal Toolbar

    The following table displays the horizontal toolbar icons of the Drawing space and its functionality.

    Image Added


    Scroll ignore
    scroll-viewporttrue
    scroll-pdftrue
    scroll-officetrue
    scroll-chmtrue
    scroll-htmltrue
    scroll-docbooktrue
    scroll-eclipsehelptrue
    scroll-epubtrue

    On this page:

    12false