Repositórios de Imagens e Símbolos

Existem dois principais repositórios de componentes reutilizáveis, as Imagens, e a galeria de Símbolos Locais.

Detalhando melhor cada uma destas fontes, a seguir.

Imagens: Usado para inserir um arquivo de imagem externa do seu computador para a configuração do projeto, como um ícone, papel de parede, objeto ou imagem de fundo. Pode-se gerenciar as imagens importadas em Edit>Display>Resources. Depois que a imagem é importada, você não precisa mais do arquivo original, pois ela é incorporada ao arquivo do projeto. As imagens podem ser utilizadas para qualquer objeto de desenho, até como "cor" ou para os atributos da dinâmica colorfill.

Símbolos Locais: Os símbolos locais são os símbolos usados com mais frequência, e incluem os símbolos criados no âmbito de um projeto. Os símbolos nesta biblioteca podem ser mantidos sincronizados com a biblioteca, desse modo, ao alterar um símbolo nesta biblioteca, esta alteração será automaticamente aplicada a todas as telas que utilizam o símbolo. O símbolo local também pode ter propriedades dinâmicas que podem ser facilmente mapeadas para Tags em telas; Estes símbolos podem também ser definidos como sendo a representação gráfica padrão de Tags.
Nesta seção são descritas estas possibilidades e a maneira de usá-las.

Recursos de imagens

Image and Symbol Repositories

There are two main repositories of reusable components, the Images, and the gallery of Local Symbols.

Better detailing each of these sources, the following.

Images: Used to insert an external image file from your computer for the project configuration, such as an icon, wallpaper, object, or background image. You can manage the imported images in Edit>Display>Resources. After the image is imported, you no longer need the original file because it is embedded in the project file. Images can be used for any drawing object, even as "color" or for dynamics attributes colorfill.

Local Symbols: Local symbols are the most frequently used symbols, and include symbols created within the scope of a project. The symbols in this library can be kept synchronized with the library, so by changing a symbol in this library, this change will be automatically applied to all screens that use the symbol. The local symbol can also have dynamic properties that can be easily mapped to Tags on screens; These symbols can also be defined as the default graphical representation of Tags.
In this section are described these possibilities and how to use them.

Image features

You must import all the images you want to use on your screens or reports through the Resources in the environment Displays. This creates an image repository for the application.
If you need to update an image with a new version, you can replace it, and it will be updated in all locations of the application in which it is being used. Be sure to keep the same resource name when you swap images.
You can use any image file to fill or paint an object when creating canvases in Draw> Draw .
You can import the following file types:

• . bmp

• . gif

• . ico

• . jpg

• . png

• . tiff

• . wdp

To manage resources:

1. Go to Edit> Displays> Resources.

1. Click Import Images.

Coluna

Descrição

Name

Edite o nome padrão para um nome descritivo.

Description

Digite uma descrição desta imagem.

Folder

Especifique o Folder onde este recurso vai ficar

ResourceType

1. Browse the directories to where the images you want to import are.

2. Select the image files and click Open.

3. On each line, type or select the information as needed.

Para adicionar uma imagem à um Display (tela):

To add an image to a Display:

1. Go to the Drawing environment (Draw) and click on the icon Insert Image Resource.

1. A new window will open. Click the button Import File.

2. The new image will become the fill of a new rectangle. Click Fill of the rectangle object to change image settings. The image will also be included in the image library in the same way as explained in the previous item.

3. You can change Stretch to None, Fill

Image Removed

Gerenciando Símbolos Locais

A biblioteca de símbolos vem com uma série de imagens gráficas que você pode usar. Você também pode criar símbolos para adicionar à biblioteca local do projeto. Os símbolos podem ser apenas um gráfico estático ou um gráfico incluindo e a configuração de uma dinâmica, e até a ligação a Tags.

Para visualizar símbolos:

1. Siga uma das seguintes opções:

   • Para ver apenas os símbolos utilizados neste projeto, vá para Draw > Symbols.

   • Para ver todos os símbolos disponíveis, vá para Draw > Drawing e clique em Open Symbol Library.

2. Para salvar um símbolo como um arquivo de imagem, selecione a linha e clique em Save to Image.

Criando novos símbolos

Pode-se usar as ferramentas de desenho e os comandos COMBINE na barra de ferramentas horizontal para desenhar os seus próprios símbolos.
Também se pode trazer símbolos das Imagens e clicar no comando Desagrupar na barra de ferramentas horizontal, a fim de editar os componentes dos símbolos importados.

Pode-se também usar o cursor Seleção direta para editar elementos internos sem a necessidade de desagrupar.
Para salvar o novo símbolo para a biblioteca de Símbolos Locais, basta selecionar o objeto ou objetos que desejar sejam partes do símbolo, em seguida, clicar com o botão direito e selecione Make New Symbol.

Para adicionar um símbolo na biblioteca:

1. Vá para Draw > Drawing.

2. Desenhe o objeto que você deseja tornar-se um símbolo.

3. Selecione todo o objeto e clique com o botão direito.

4. Selecione Make New Symbol.

5. Digite o nome do símbolo e da pasta (subdivisão da biblioteca) em que quer que o símbolo seja guardado.

6. A partir daí, pode-se pressionar o ícone da barra vertical no DRAW, para pegar símbolos, e usá-los em qualquer outra tela.

Os componentes na biblioteca de Símbolos Locais podem ter embutidos propriedades de dinâmicas e uma maneira fácil de mapeá-los para Tags em tempo de execução na aplicação.

Se você tiver propriedades e dinâmicas para tags sendo usados nesse símbolo, o sistema criará automaticamente os parâmetros de rótulo do Símbolo. Depois de fazer o novo símbolo, dê um duplo clique nele para verificar os seus parâmetros de configuração.

Image Removed

Os objetos de "símbolos locais" são compostos por alguns símbolos padrão do arquivo SymbolLibrary.tproj, adicionado com a instalação do produto, e os símbolos que você criou para seu projeto específico. Se você alterar, excluir ou inserir um símbolo na SymbolLibrary.Tproj, será acessível a todos os projetos que forem editados neste computador. Os símbolos que você está usando em seu projeto são salvos dentro do arquivo de projeto, portanto, completamente independente de qualquer arquivo externo.

Inserindo símbolos em uma tela

Para inserir um Símbolo Local em uma tela:

Image Removed

Image Removed

Parâmetros do Símbolo

Quando você insere um símbolo a partir da biblioteca de Símbolos Locais, este pode conter alguns parâmetros, como no exemplo da seccionadora acima. Neste caso os parâmetros são LevelValue, MaxScale e MinScale. Para alterar as Tags ligadas a esses parâmetros, basta editar os novos nomes de tag na caixa de diálogo.

Editando e modificando símbolos

Clique com o botão direito do mouse sobre o símbolo VerticalTank e selecione Editar
Símbolo. Agora você entra no modo de edição, você pode ver todos os objetos que fazem parte do Tanque Vertical.

Image Removed

Image Removed

Observe-se que foi utilizada a sintaxe #<PropertyName>:TagName.
Esta sintaxe vai criar parâmetros de rótulos expostos, o que torna mais fácil para mapear os Labels ligados aos Tags ao usar o símbolo. Nestes exemplos, o símbolo tem a rótulos "Nível", "MinScale" e "MaxScale". Quando se insere esse símbolo, é possível de definir valores para esses parâmetros. Após o caractere ":", você tem o valor default para o rótulo.padrão.

Exemplo: "#LevelValue: Client.SimulationAnalog", estará criando uma propriedade chamada "LevelValue", que tem "Client.SimulationAnalog" como o valor padrão. Você pode usar qualquer nome para o parâmetro Label.

A fim de salvar o símbolo, clique com o botão direito do mouse sobre o símbolo ou na tela e pressione Salvar para biblioteca de símbolos, ou clique no ícone Salvar na barra de ferramentas superior. Dê um clique duplo sobre o símbolo para verificar a suas propriedades.

Inserindo animação de cores para figuras e símbolos

Se você deseja inserir animação por mudança de cor, sem mudar nada no símbolo, você pode copiar o símbolo e sobrepor uma imagem transparente em cima da imagem do símbolo.

Image Removed

Por exemplo, a seguir são mostradas duas bombas. Pode-se criar uma animação simples que mostra quando a bomba está ON ou OFF.

Para inserir animação ON OFF siga estes passos:

1. Primeiro faça uma cópia do objeto, selecione o símbolo e clique em Ctrl + D para duplicá-lo (pode-se também selecionar o símbolo, mantendo pressionada a tecla CTRL e arrastando o objeto, ou ainda você pode copiar / colar).

2. Image Removed

   Em seguida, selecione a segunda bomba e clique no botão União na barra de ferramentas horizontal.

3. Image Removed

   Com esta nova bomba, localize a propriedade OPACITY no painel esquerdo, selecione uma opacidade 0,2-0,5, de acordo com o efeito visual desejado, e selecione a cor do pincel inicial (vermelho ou verde, por exemplo).

4. Clique duas vezes na segunda bomba e altere a configuração da dinâmica FillColor.

5. Selecione as duas bombas e clique no botão Align Horizontal Center e botão Align Vertical Center.

6. Se a bomba com as mudanças de opacidade ficar atrás da outra bomba, clique no botão Mover para a Frente para trazê-lo para a frente.

7. Agora você pode clicar no botão Exibir visualização

   Image Removed

   na parte superior da barra de ferramentas para ver a animação da nova bomba.

Ligação automática entre tags e símbolos

Pode-se configurar um símbolo para que seja a representação padrão de um tipo de Tag. Desta forma, toda vez que você colar um Tag no ambiente Draw, um símbolo será criado automaticamente na tela correspondendo ao Tag inserido.

Mapeamento entre símbolos e tipos nativos

Os tags do tipo Digital, Integer, Double, Decimal, Texto, DateTime e TimeSpan tem uma visualização padrão que é o nome do tag e uma caixa de texto de entrada / saída. Se você selecionar várias linhas em Edit> Tags> Objects (clique em uma linha, pressione Shift e clique em outra linha para marcar um intervalo), e clicar com o botão direito para copiar essas linhas para a área de transferência e colar em uma tela, o sistema criará automaticamente um objeto para cada um desses tags copiados.
Se você deseja alterar as propriedades dos objetos criados, por exemplo, mudar a dinâmica de textIO "TwoWay" para "OutputOnly", selecione todos os objetos de caixa de texto (clicando com o mouse sobre a tela; mantendo-o pressionado, arraste- para selecionar a área com os objetos), e clique duas vezes em qualquer objeto selecionado para abrir o diálogo de edição de Dynamics, que neste caso mostrará no titulo que há "Multiplos objetos selecionados".

Mapeando um Símbolo para um Tipo (Template)

Da mesma forma que se pode definir símbolos para os Tipos default nativos do Action.NET, também se pode definir um símbolo para ser o padrão de visualização de um tipo definido pelo usuário, isto é de um Template. Um objeto que tenha como tipo este template, será representado na tela por este simbolo.

Para fazer o mapeamento de um símbolo e um template:

1. Vá para Edit> Tags> Templates para criar um novo modelo. Na figura a seguir foi criado um template com o nome Demo.

Image Removed

1. De volta ao ambiente Draw insira alguns objetos que você deseja para fazer parte de um simbolo. No exemplo, são usados um TextBlock e TextBox com os parâmetros #Tag (Tag.Demo.Integer1) em suas propriedades dinâmicas

Image Removed

Image Removed

• Agora selecione o TextBox e o TextBlock, e com o botão direito do mouse

escolha no menu Make New Symbol; Preencha os campos Name e Folder com o nome do template "Demo". Os parênteses () na expressão do TextBox e TextBlock, defininem o âmbito de aplicação, sobre o que deve ser substituído quando você mapear o símbolo. A sintaxe #Label: quando você cola os Tags, é o marcador de posição que irá mostrar onde nas animações dinâmicas ou expressões o nome de tag deve ser substituído. Label é um nome qualquer para o parâmetro.

• Vá para Editar> Tags e copie todas as tags com Tipo: Demo.

Image Removed

• Volte para o ambiente DRAW e cole as tags, na tela.

Ao inserir Tags deste tipo (template), o sistema fará a procura de um objeto Símbolo, com o mesmo nome do template. Se for encontrado na biblioteca de símbolos, esse símbolo é criado e vinculado ao Tag que foi colado na tela.
Image Removed

Mapeando Tags e Símbolos utilizando Categorias

Quando se deseja mapear um símbolo com um grupo de tags, mas não se quer fazer que este símbolo mapeie todos os Tags com o mesmo tipo, pode ser usada a coluna Categoria, na definição do Tag, para conectar-se os símbolos que devem ser usados como o padrão de visualização para um grupo de Tags. Isto é, somente serão considerados correspondentes os Símbolos com mesmo nome dos tipos dos Tags, cujos objetos possuam as mesmas categorias.

Parta utilizar esta funcionalidade, siga o exemplo:

• Vá para Run> Dictionaries> Categories e crie novas categorias.

Image Removed

• Volte para o ambiente DRAW e insira um símbolo.

• Neste ambiente escolha a ficha Symbols e na coluna categoria clique e selecione a categoria desejada para cada símbolo.

Image Removed

• Vá para Edit>Tags para definir as categorias apropriadas para cada grupo de tags.

Image Removed

• Selecione todos os Tags, e faça a cópia, vá para o DRAW e cole na tela. Veja que somente os Tags que possuem a mesma categoria que foi definida para o símbolo terão seus correspondentes simbolos criados, apesar de todos terem o mesmo tipo.

1. or UniformTofill. You can also view all the objects that are in the project and change between them using the Select Resource or just by clicking on the image in the top toolbar.

Image Added

Managing Local Symbols

The symbol library comes with a number of graphic images that you can use. You can also create symbols to add to the local project library. Symbols can be just a static chart or a chart including and setting a dynamic, and even linking to Tags.

To view symbols:

1. Follow one of the following options:

   • To see only the symbols used in this project, go to Draw > Symbols.

   • To see all available symbols, go to Draw > Drawing and click Open Symbol Library.

2. To save a symbol as an image file, select the line and click Save to Image.

Creating new symbols

You can use the drawing tools and COMBINE commands in the horizontal toolbar to draw your own symbols.
You can also bring symbols of the Images and click the command Ungroup horizontal toolbar in order to edit the components of the imported symbols.

You can also use the cursor Direct selection to edit internal elements without the need to ungroup.
To save the new symbol to the Local Symbols library, simply select the object or objects you want to be parts of the symbol, then right-click and select Make New Symbol.

To add a symbol to the library:

1. Go to Draw > Drawing, drawing, drawing.

2. Draw the object that you want to become a symbol.

3. Select the entire object and right-click.

4. Select Make New Symbol.

5. Enter the name of the symbol and folder (subdivision of the library) in which you want the symbol to be saved.

6. From there, you can press the vertical bar icon in DRAW to pick up symbols, and use them on any other screen.

Components in the Local Symbols library can have built-in dynamic properties and an easy way to map them to runtime tags in the application.

If you have properties and dynamics for tags being used in this symbol, the system automatically creates the symbol label parameters. After you make the new symbol, double-click it to check its configuration parameters.

Image Added

The "local symbols" objects are composed of some standard symbols from the SymbolLibrary.tproj file, added with the product installation, and the symbols that you created for your specific project. If you change, delete, or insert a symbol in SymbolLibrary.Tproj, it will be accessible to all projects that are edited on this computer. The symbols that you are using in your project are saved within the project file, therefore completely independent of any external file.

Inserting symbols on a screen

To insert a Local Symbol on a screen:

1. Go to the DRAW environment, right-click anywhere on the screen and select Insert Symbol; alternatively you can click the icon Insert Symbol on the vertical toolbar.

2. A window appears with all the symbols available in the project. On the left side of the window is a list of Folders (groupings of symbols). On the right side are shown the symbols belonging to the selected Folder.

3. After selecting the Folder and symbol, click the symbol and then click on the screen to position the symbol, you can also drag and drop the symbols to the screen. If you double-click a symbol, the library window will close, allowing you to insert the selected object.

4. Image Added

5. Double-click the symbol to see its runtime properties and the tag map it used. Each tag used has a Label that can be used in scripts (code behind) to reference the corresponding tag. See the Symbol Setup window in the figure below. In Value is the tag to be used.
   
   

   Image Added

Symbol Parameters

When you insert a symbol from the Local Symbols library, it may contain some parameters, such as in the sectioner example above. In this case the parameters are LevelValue, MaxScale, and MinScale. To change the Tags linked to these parameters, simply edit the new tag names in the dialog box.

Editing and modifying symbols

Right-click on the VerticalTank symbol and select Edit
Symbol. Now you enter edit mode, you can see all the objects that are part of the Vertical Tank.

Image Added

Now click the black rectangle to see its Dynamics properties.

Image Added

Note that the syntax was used #<PropertyName>:TagName.
This syntax will create parameters of exposed labels, which makes it easier to map labels linked to tags when using the symbol. In these examples, the symbol has the labels "Level", "MinScale" and "MaxScale". When you insert this symbol, you can set values for these parameters. After the ":"character, you have the default value for the default label.

Example: "#LevelValue: Client.SimulationAnalog", you will be creating a property called "LevelValue", which has "Client.SimulationAnalog" as the default value. You can use any name for the Label parameter.

In order to save the symbol, right-click on the symbol or screen and press Save to symbol library, or click the Save icon in the top toolbar. Double-click on the symbol to check its properties.

Inserting color animation for figures and symbols

If you want to insert animation by color change, without changing anything in the symbol, you can copy the symbol and overput a transparent image on top of the symbol image.

Image Added

For example, the following are two bombs. You can create a simple animation that shows when the pump is ON or OFF.

To insert ANIMATION ON OFF follow these steps:

1. First make a copy of the object, select the symbol and click Ctrl + D to duplicate it (you can also select the symbol by holding down the CTRL key and dragging the object, or you can copy/paste).

2. Image Added

   Then select the second pump and click the Union button on the horizontal toolbar.

3. Image Added

   With this new pump, locate the OPACITY property in the left pane, select an opacity from 0.2 to 0.5, according to the desired visual effect, and select the color of the initial brush (red or green, for example).

4. Double-click the second pump and change the FillColor dynamic setting.

5. Select the two pumps and click the Align Horizontal Center button and align vertical center button.

6. If the pump with the opacity changes gets behind the other pump, click the Move Forward button to bring it forward.

7. You can now click the View Preview button

   Image Added

   at the top of the toolbar to see the animation of the new pump.

Automatic link between tags and symbols

You can configure a symbol to be the default representation of a kind of Tag. This way, every time you paste a tag into the Draw environment, a symbol will be automatically created on the screen corresponding to the inserted tag.

Mapping between native symbols and types

The tags of type Digital, Integer, Double, Decimal, Text, DateTime and TimeSpan have a default view that is the name of the tag and an inbound/outgoing text box. If you select multiple lines in Edit> Tags> Objects (click one line, press Shift, and click another line to mark a range), and right-click to copy those lines to the clipboard and paste to a screen, the system automatically creates an object for each of those copied tags.
If you want to change the properties of the created objects, for example, change the dynamics of textIO "TwoWay" for "OutputOnly", select all text box objects (by clicking your mouse on the screen; holding it down, drag- to select the area with the objects), and double-click on any selected object to open the editdialog of Dynamics, which in this case will show in the title that there are "Multiple selected objects".

Mapping a Symbol to a Type (Template)

Just as you can define symbols for the native default types of Action.NET, you can also set a symbol to be the display pattern of a user-defined type, that is from a Template. An object that is typed in this template will be represented on the screen by this symbol.

To map a symbol and template:

1. Go to Edit> Tags> Templates to create a new template. In the following figure, a template with the name Demo has been created.

Image Added

1. Back in the environment Draw insert some objects that you want to be part of a symbol. In the example, a TextBlock and TextBox with the #Tag (Tag.Demo.Integer1) are used in their dynamic properties

Image Added

TextBox Dynamic

Image Added

• Now select the TextBox and TextBlock, and right-click

choose from the menu Make New Symbol; Fill in the Name and Folder fields with the template name "Demo". The parentheses () in the TextBox and TextBlock expression, define the scope, on what should be overridden when you map the symbol. The syntax #Label: When you paste the Tags, it is the placeholder that will show where in dynamic animations or expressions the tag name should be overridden. Label is any name for the parameter.

• Go to Edit> Tags and copy all tags with Type: Demo.

Image Added

• Go back to the DRAW environment and paste the tags on the screen.

When you enter Tags of this type (template), the system will search for a Symbol object, with the same name as the template. If found in the symbol library, this symbol is created and linked to the tag that was pasted on the screen.
Image Added

Mapping Tags and Symbols using Categories

When you want to map a symbol with a tag group, but you don't want to have this symbol map all Tags to the same type, the column can be used Category, in the tag definition, to connect the symbols that should be used as the preview pattern for a tag group. That is, only symbols with the same name of the tag types, whose objects have the same categories, will be considered matching.

Go to use this feature, follow the example:

• Go to Run> Dictionaries> Categories and create new categories.

Image Added

• Go back to the DRAW environment and insert a symbol.

• In this environment choose the plug Symbols and in the category column click and select the desired category for each symbol.

Image Added

• Go to Edit>Tags to define the appropriate categories for each tag group.

Image Added

• Select all Tags, and copy, go to DRAW and paste on the screen. See that only Tags that have the same category that was defined for the symbol will have their corresponding symbols created, even though they all have the same type.