Telas e Menus do NCL Composer¶
Janela Principal¶
Barra de título¶
Evidencia o nome do NCL Composer e do projeto corrente.
Barra de projetos¶
Lista a tela de boas-vindas e a lista de projetos abertos, permitindo navegar entre eles.
Área das Visões¶
Área de desenho das diversas visões. Cada visão pode ter seus próprios elementos de interface. Também é possível organizar e salvar a disposição das diversas visões por meio das perspectivas.
Barra de perspectivas¶
Apresenta as perspectivas salvas pelo usuário e permite facilmente alternar entre elas.
Barra de menus¶
Mostra as entradas de menu disponíveis.
Menu | Screnshot |
---|---|
File: Da acesso às seguintes opções:
|
|
Edit: | |
View: | |
Share: | |
Help: |
Atalhos¶
Os atalhos globais (válidos em qualquer visão) do NCL Composer são:
- ``Ctrl``+``n`` - Novo projeto.
- ``Ctrl``+``o`` - Abrir projeto.
- ``Ctrl``+``s`` - Salvar o projeto corrente.
- ``Ctrl``+``Shift``+``s`` - Salvar todos os projetos abertos.
- ``Ctrl``+``Alt``+``s`` - Salvar como…: Salva o projeto corrente com outro nome.
- ``Ctrl``+``F4`` - Fechar projeto.
- ``Alt+F4`` ou ``Ctrl``+``Q`` - Fechar o |nclcomposer|.
- ``F11`` - Habilita/desabilita visualização em tela cheia.
- ``F1`` - Abre a ajuda do |nclcomposer|.
- ``F5`` - Atualiza o modelo da visão com foco.
- ``Ctrl``+``1``, ``Ctrl``+``2``, … - Alterna entre as perspectivas.
Visão Estrutural¶
A Visão Estrutural permite que os autores de aplicações interajam visualmente com a estrutura lógica do documento NCL. Em NCL, a estrutura lógica é representada pelos seus objetos (nós de conteúdo e nós de composição) e os elos entre esses objetos (representadas pelos elementos ).
Ações¶
As ações são as diversas atividades que o usuário pode realizar durante o processo de autoria. Uma ação pode ser executada de várias formas: através da barra de ferramenta, do menu contextual, de um atalho de teclado, do mouse e da combinação de várias dessas formas. Abaixo são descritas cada uma das ações disponíveis na Visão Estrutural e como elas podem ser executadas.
Ação | Descrição | |
---|---|---|
Desfazer | Desfaz a última ação realizada na visão. Esta ação é ignorada caso não exista nenhuma ação para ser defeita. Inserir, remover, mover e redimencionar são exemplos de ações que podem ser desfeitas. Por outro lado, selecionar não é uma ação que pode ser desfeita. Na versão atual, não existe um limite na quantidade de ações que podem ser desfeitas. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Refazer | Refaz a última ação realizada na visão. Esta ação é ignorada caso não exista nenhuma ação para ser refeita, ou seja, nenhuma ação foi desfeita anteriormente. Na versão atual, não existe um limite na quantidade de ações que podem ser desfeitas. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Recortar | Copia a entidade selecionada para a área de trânsferencia e remove ela da visão. Esta ação é ignorada caso nenhuma entidade tenha sido selecionada e se a entidade selecionada é do tipo body. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Copiar | Copia a entidade selecionada para a área de trânsferencia. Esta ação é ignorada caso nenhuma entidade tenha sido selecionada e se a entidade selecionada é do tipo body. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Colar | Adiciona a entidade copiada para área de trânsferencia como filha da entidade selecionada. Esta ação é ignorada caso nenhuma entidade tenha sido recortada ou copiada e se a entidade selecionada não permita que seja adicionado como um de seus filhos entidades do tipo selecionada. Por exemplo, não é possível colar um contexto em uma mídia. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Deletar | Remove a entidade selecionada da visão. Esta ação é ignorada caso nenhuma entidade esteja selecionada na visão. | Esta ação pode ser executada através do: menu contextual e atalho. |
Mover | Move a entidade selecionada para uma entidade de destino. Para a structural_view, mover significa alterar o parêntesco da entidade selecionada. A entidade de destino é determinada manipulando a entidade selecionada por meio de drag-n-drop para o interior da entidade de destino. Esta ação é ignorada caso a entidade de destino não permita que seja adicionado como um de seus filhos entidades do tipo selecionado. | Esta ação pode ser executada através de atalho. |
Aumentar Zoom | Aumenta o zoom na visão. Esta ação é ignorada caso a visão tenha alcançado seu zoom máximo. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas) e atalho. |
Diminuir Zoom | Diminue o zoom na visão. Esta ação é ignorada caso a visão tenha alcançado seu zoom mínimo. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas) e atalho. |
Tirar uma Foto | Exporta o projeto como imagem (.png). O projeto pode ser exportado mesmo que nenhuma entidade tenha sido adicionada. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas) e menu contextual. |
Habilitar Ferramenta de Ponteiro | Altera o modo de edição da structural_view para “ponteiro”. Quando no modo de “ponteiro”, a structural_view permite selecionar, mover e redimencionar as entidades da através do mouse. O modo de “ponteiro” é desabilitado sempre o modo de “link” é habilitado. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas) e atalho. |
Habilitar Ferramenta de Link | Altera o modo de edição da structural_view para “link”. Quando no modo de “link”, a structural_view permite criar links (relacionamentos) entre duas entidades. Para criar um novo link, o usuário deve: i) clicar com o botão esquerdo do mouse na entidade de origem, ii) arrastar o mouse até a entidade de destino e, em seguida, iii) soltar o botão esquerdo do mouse. O modo de “link” é desabilitado sempre o modo de “ponteiro” é habilitado. Caso seja permitido criar um relaciomaneto entre as entidades de origem e destino, uma caixa de diálogo será apresentada para finalizar o processo de criação de link. Caso contrário, a ação é ignorada. Detalhes sobre o diálogo de criação de link será discutido mais a frente. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas) e atalho. |
Criar uma Mídia | Adiciona uma entidade do tipo mídia como filha da entidade selecionada. Esta ação é ignorada caso a entidade selecionada não permita que seja adicionada como um de seus filhos entidades do tipo mídia. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Criar uma Contexto | Adiciona uma entidade do tipo contexto como filha da entidade selecionada. Esta ação é ignorada caso a entidade selecionada não permita que seja adicionada como um de seus filhos entidades do tipo contexto. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Criar um Switch | Adiciona uma entidade do tipo switch como filha da entidade selecionada. Esta ação é ignorada caso a entidade selecionada não permita que seja adicionada como um de seus filhos entidades do tipo switch. | Esta ação pode ser executada através da: barra de ferramentas, menu contextual e atalho. |
Criar o Body | Adiciona uma entidade do tipo body na visão. Esta ação é ignorada caso um body já tenha sido adicionado previamente. | Esta ação pode ser executada através da: barra de ferramentas, menu contextual e atalho. |
Criar uma Área | Adiciona uma entidade do tipo área como filha da entidade selecionada. Esta ação é ignorada caso a entidade selecionada não permita que seja adicionada como um de seus filhos entidades do tipo área. | Esta ação pode ser executada através da: barra de ferramentas, menu contextual e atalho. |
Criar uma Propriedade | Adiciona uma entidade do tipo propriedade como filha da entidade selecionada. Esta ação é ignorada caso a entidade selecionada não permita que seja adicionada como um de seus filhos entidades do tipo propriedade. | Esta ação pode ser executada através da: barra de ferramentas, menu contextual e atalho. |
Criar uma Porta | Adiciona uma entidade do tipo porta como filha da entidade selecionada. Esta ação é ignorada caso a entidade selecionada não permita que seja adicionada como um de seus filhos entidades do tipo porta. | Esta ação pode ser executada através da: barra de ferramentas, menu contextual e atalho. |
Criar uma Porta de Switch | Adiciona uma entidade do tipo porta de switch como filha da entidade selecionada. Esta ação é ignorada caso a entidade selecionada não permita que seja adicionada como um de seus filhos entidades do tipo porta de switch. | Esta ação pode ser executada através da: barra de ferramentas, menu contextual e atalho. |
Habilitar/ Desabilitar Minimapa | Habilita/Desabilita o minimapa. Quando habilitado, o minimapa é exibido no canto inferior direito da visão. | Esta ação pode ser executada através da: barra de ferramentas e atalho. |
Barra de Ferramentas¶
A partir da versão 0.3.0 a Visão Estrutural disponibiliza uma barra de ferramentas com as principais ações da visão.
A figura acima apresenta a barra de ferramentas, cujo detalhes de cada ferramenta são descritos a seguir:
- (a) - Desfazer: Desfaz a última ação realizada na visão. Mais detalhes.
- (b) - Refazer: Refaz a última ação reallizada na visão. Mais detalhes.
- (c) - Recortar: Copia a entidade selecionada para a área de trânsferencia e remove ela da visão. Mais detalhes.
- (d) - Copiar: Copia a entidade selecionada para a área de trânsferencia. Mais detalhes.
- (e) - Colar: Adiciona a entidade copiada para área de trânsferencia como filha da entidade selecionada. Mais detalhes.
- (f) - Aumentar o *Zoom:* Aumenta o Zoom na visão. Mais detalhes.
- (g) - Diminuir o *Zoom:* Diminue o Zoom na visão. Mais detalhes.
- (h) - Tirar uma Foto: Exporta o projeto como imagem (.png). Mais detalhes.
- (i) - Ferramenta de Ponteiro: Altera o modo de edição da visão para “ponteiro”. Mais detalhes.
- (j) - Ferramenta de *Link*: Altera o modo de edição da visão para “link”. Mais detalhes.
- (k) - Adicionar Mídia: Adiciona uma entidade do tipo mídia como filha da entidade selecionada. Mais detalhes.
- (l) - Adicionar Contexto: Adiciona uma entidade do tipo context como filha da entidade selecionada. Mais detalhes.
- (m) - Adicionar *Switch*: Adiciona uma entidade do tipo switch como filha da entidade selecionada. Mais detalhes.
- (n) - Adicionar *Body*: Adiciona um body na visão. Mais detalhes.
- (o) - Adicionar Área: Adiciona uma entidade do tipo área como filha da entidade selecionada. Mais detalhes.
- (p) - Adicionar Propriedade: Adiciona uma entidade do tipo propriedade como filha da entidade selecionada. Mais detalhes.
- (q) - Adicionar Porta: Adiciona uma entidade do tipo porta como filha da entidade selecionada. Mais detalhes.
- (r) - Adicionar Porta de *Switch*: Adiciona uma entidade do tipo porta de switch como filha da entidade selecionada. Mais detalhes.
Menus¶
Menu Contextual¶
O menu contextual é exibido sempre que o usuário clica com o botão direito do mouse em qualquer entidade ou nas áreas vazias (em branco) da visão.
A figura acima apresenta o menu contextual, cujo detalhes são descritos abaixo:
- (a) - Exibir Ajuda: Exibe o diálogo de ajuda. Desabilitado nesta versão.
- (b) - Insert: Exibe o submenu de adção de entidades.
- (c) - Desfazer: Desfaz a última ação realizada na visão. Mais detalhes.
- (d) - Refazer: Refaz a última ação reallizada na visão. Mais detalhes.
- (e) - Recortar: Copia a entidade selecionada para a área de trânsferencia e remove ela da visão. Mais detalhes.
- (f) - Copiar: Copia a entidade selecionada para a área de trânsferencia. Mais detalhes.
- (g) - Colar: Adiciona a entidade copiada para área de trânsferencia como filha da entidade selecionada. Mais detalhes.
- (h) - Deletar: Remove a entidade selecionada da visão. Mais detalhes.
- (i) - Tirar uma Foto: Exporta o projeto como imagem (.png). Mais detalhes.
- (j) - Exibir Propriedades: Exibe o diálogo de propriedades. Desabilitado nesta versão
- (k) - Adicionar Mídia: Adiciona uma entidade do tipo mídia como filha da entidade selecionada. Mais detalhes.
- (l) - Adicionar Contexto: Adiciona uma entidade do tipo context como filha da entidade selecionada. Mais detalhes.
- (m) - Adicionar *Switch*: Adiciona uma entidade do tipo switch como filha da entidade selecionada. Mais detalhes.
- (n) - Adicionar *Body*: Adiciona um body na visão. Mais detalhes.
- (o) - Adicionar Área: Adiciona uma entidade do tipo área como filha da entidade selecionada. Mais detalhes.
- (p) - Adicionar Propriedade: Adiciona uma entidade do tipo propriedade como filha da entidade selecionada. Mais detalhes.
- (q) - Adicionar Porta: Adiciona uma entidade do tipo porta como filha da entidade selecionada. Mais detalhes.
- (r) - Adicionar Porta de *Switch*: Adiciona uma entidade do tipo porta de switch como filha da entidade selecionada. Mais detalhes.
Diálogos¶
Diálogo de Link¶
O diálogo de link é utilizado para criação e edição de: links, binds, parâmetros de link e parâmetros de binds. O diálogo para criação de link é exibido quando um relacionamento entre uma entidade de origem e destino é especificado através da ferramenta de criação de *link*.
Logo que exibido (figura abaixo), o diálogo de link apresenta uma lista de conectores para que o usuário possa escolher. A lista de conectores é carregada dinâmicamente a partir das especificações da aplicação em desenvolvimento.
Assim que o usuário começar a preencher a caixa de texto “connector” (figura abaixo), a lista de conectores é filtrada para facilitar a seleção do conector apropriado.
Uma vez selecionado um dos conectores na lista, o usuário pode escolher qual o tipo de condição e ação na seção de binds do diálogo (figura abaixo). Os tipos de condições e ações disponíveis são carregados a patir do conector selecionado.
Ainda na criação do link, quando o usuário habilita a exibição de parâmetros (“show params”), é possível especificar os valores dos parâmetros de link, parâmetros do bind de condição e parâmetros do bind de ação (figura abaixo) que devem ser considerados para criação do relacionamento.
Para editar os parâmetros de um link, o usuário deve clicar duas vezes na entidade do tipo link na visão. Esta ação resultana exibição do diálogo abaixo.
De modo semelhante, para editar um bind, o usuário deve clicar duas vezes na entidade do tipo bind, resultando na exibição do diálogo abaixo.
Referência¶
É possível especificar uma referência através da ação de colar. Assim que a ação de colar é realizada o diálogo abaixo é exibido, solicitando que o autor escolha entre copiar ou criar uma referência da entidade copiada para área de tranferência.
Quando uma entidade é uma referência, ela fica levemente transparente (figura abaixo) e herda todas as interfaces da entidade referenciada. Não é possível referenciar uma entidade que já referencia uma outra. Nesta versão ainda não é possível fazer referência para entidades do tipo: contexto, switch e body.
Atalhos¶
Abaixo segue a lista de atalhos da Visão Estrutural:
- ``Ctrl``+``z`` - Desfazer: Desfaz a última ação realizada na visão. Mais detalhes.
- ``Ctrl``+``Shift``+``z`` - Refazer: Refaz a última ação reallizada na visão. Mais detalhes.
- ``Ctrl``+``x`` - Recortar: Copia a entidade selecionada para a área de trânsferencia e remove ela da visão. Mais detalhes.
- ``Ctrl``+``c`` - Copiar: Copia a entidade selecionada para a área de trânsferencia. Mais detalhes.
- ``Ctrl``+``v`` - Colar: Adiciona a entidade da área de trânsferencia como filha da entidade selecionada. Mais detalhes.
- ``Del`` - Deletar: Remove a entidade selecionada da visão. Mais detalhes.
- *Segurar* ``Ctrl``+*Drag-n-drop* - Mover: Remove a entidade selecionada da visão. Mais detalhes.
- ``Ctrl``+``+`` ou ``Ctrl``+*Roda do mouse para cima* - Aumentar o *zoom*: Aumenta o zoom na visão. Mais detalhes.
- ``Ctrl``+``-`` ou ``Ctrl``+*Roda do mouse para baixo* - Diminuir o *zoom*: Diminue o zoom na visão. Mais detalhes.
- ``1`` - Habilitar Ferramenta de Ponteiro: Altera o modo de edição da visão para “ponteiro”. Mais detalhes.
- ``2`` ou *Segurar* ``Shift`` - Habilitar Ferramenta de Link: Altera o modo de edição da visão para “link”. Mais detalhes.
- ``3`` - Adicionar Mídia: Adiciona uma entidade do tipo mídia como filha da entidade selecionada. Mais detalhes.
- ``4`` - Adicionar Contexto: Adiciona uma entidade do tipo context como filha da entidade selecionada. Mais detalhes.
- ``5`` - Adicionar *Switch*: Adiciona uma entidade do tipo switch como filha da entidade selecionada. Mais detalhes.
- ``6`` - Adicionar *Body*: Adiciona um body na visão. Mais detalhes.
- ``7`` - Adicionar Área: Adiciona uma entidade do tipo área como filha da entidade selecionada. Mais detalhes.
- ``8`` - Adicionar Propriedade: Adiciona uma entidade do tipo propriedade como filha da entidade selecionada. Mais detalhes.
- ``9`` - Adicionar Porta: Adiciona uma entidade do tipo porta como filha da entidade selecionada. Mais detalhes.
- ``0`` - Adicionar Porta de *Switch*: Adiciona uma entidade do tipo porta de switch como filha da entidade selecionada. Mais detalhes.
- ``Ctrl``+``m`` - Habilitar/Desabilitar Minimapa: Habilita/Desabilita o minimapa. Mais detalhes.
Outros detalhes¶
Todo plugins do NCL Composer permite sincronizar (ou resincronizar) o estado atual da visão com o modelo do núcleo da ferramenta. Esta tarefa é realiza através de um botão na aba de cada visão. No caso da Visão Estrutural, sempre que a visão é resincronizada com o modelo do núcleo da ferramenta, todo o histório de ações é perdido, de modo que não é possível desfazer ou refazer uma ação.
Visão de Leiaute¶
A Visão de Leiaute permite que os autores de aplicações NCL interajam visualmente com as regiões onde os objetos de mídia serão inicialmente apresentados. Nesta visão, os autores podem criar e manipular as regiões e a hierarquia de regiões do documento.
Ação | Descrição | |
---|---|---|
Criar uma região | Cria uma nova região, filha região que está selecionada. | Esta ação pode ser executada através da: |
Remover uma região | Remove a região que está atualmente selecionada e seus filhos. | Esta ação pode ser executada através da: barra de ferramentas |
Copiar região | Copia a região selecionada para a área de trânsferencia. Esta ação é ela da visão. Esta ação é ignorada caso nenhuma entidade esteja selecionada. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Colar região | Cola a região que está na área de transferência como filha da região selecionada. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Esconder região | Esconde a região atualmente selecionada da visão de leiaute. A região continua existindo no modelo (e pode ser mostrada depois) apenas não é visualizada. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Mostrar/esconde r grade | Copia a entidade selecionada para a área de trânsferencia. Esta ação é ignorada caso nenhuma entidade tenha sido selecionada e se a entidade selecionada é do tipo body. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Tirar um instantâneo | Permite salvar uma imagem com a disposição atual das regiões da visão de leiaute. | Esta ação pode ser executada através da: barra de ferramentas (#barra-de-ferramentas), menu contextual e atalho. |
Visão de Outline¶
A Visão de Outline apresenta a estrutura do documento NCL como uma árvore, permitindo aos autores navegarem no documento.
Visão de Propriedades¶
A Visão de Propriedades apresenta o conjunto de propriedades da entidade selecionada. Essa entidade selecionada por ser, por exemplo, uma região na Visão de Leiaute, um objeto de mídia na Visão Estrutural etc.
Visão Textual¶
A Visão Textual permite aos usuários interagirem diretamente com o código-fonte da aplicação NCL. Ela é um editor de texto avançado focado na linguagem NCL e traz funcionalidades como: coloração sintática, sugestão de código contextual e formatação de código.
A Visão Textual é recomendada especialmente para usuários avançados e que se sentem à vontade com a sintaxe XML.
Visão de Regras¶
Permite a definição de uma base de regras, as quais podem ser utilizada em switchs para adaptação do conteúdo a ser apresentado.
Visão de Validação¶
A Visão de Validação é responsável por notificar erros e alertas no documento NCL. A figura a seguir apresenta um exemplo.
Visão de Execução¶
Possibilita ver o resultado da execução do seu projeto.
Todo
Executar embedded or not embedded