Editor de widgets da IU

O editor é aberto quando você clica duas vezes em uma miniatura de widget. Dentro do editor, você pode adicionar todas as partes da interface de usuário personalizada arrastando-a para a janela de visualização. Segue abaixo um detalhamento do editor de widgets.

Clique para ampliar a imagem.

Barra de menus e abas

Arquivo

• Ativos de Blueprint de widget recentes: exibe uma lista dos ativos de Blueprints de widget recentes que você abriu para o projeto.

• Salvar tudo: salva todos os ativos e níveis em disco.

• Salvar: salva o Blueprint de widget.

• Salvar como...: salva o Blueprint de widget com um novo nome.

• Compilar: compila o Blueprint de widget.

• Redefinir pai do Blueprint: altera o pai do Blueprint.

Editar

• Desfazer: reverte a alteração mais recente.

• Refazer: refaz a última ação.

• Histórico de ações: visualize todo o histórico de ações.

Ativo

• Localizar no Navegador de Conteúdo: acessa o ativo associado e o seleciona no Navegador de Conteúdo usado mais recentemente.

• Visualizador de Referências: inicializa o Visualizador de Referências que exibe as referências aos ativos selecionados.

Janela

• Carregar layout: apresenta opções adicionais para carregar o layout usando o layout Padrão ou o layout da UE4.

• Salvar layout: salva a visualização de layout selecionada.

• Remover layout: remove uma visualização de layout.

• Habilitar tela cheia: abre o editor em tela cheia.

• Detalhes: abre o painel Detalhes na parte direita da janela do editor.

• Designer: abre a aba Designer.

• Resultados do compilador: abre a aba "Resultados do compilador" e exibe quaisquer erros ou aviso gerados durante a compilação desse Blueprint.

• Animações: Abre a aba Animações.

• Hierarquia: abre a aba Hierarquia.

• Paleta: abre a aba Paleta.

• Ver vinculações: abre a guia "Ver vinculações".

• Modelos de visualização: abre a guia "Modelos de visualização".

• Cinematografia: apresenta opções adicionais para o Gravador de Tomadas ou o Navegador de Tomadas.

• Navegador de Conteúdo: abre a aba Navegador de Conteúdo.

• Log de Mensagens: abre a aba Log de Mensagens.

• Log de Saída: abre a aba Log de Saída.

Ajuda

• Documentação do editor de widgets: abre a documentação do editor de widgets no site da Comunidade de Desenvolvedores da Epic.

• Comunidade de Desenvolvedores: abre o site da Comunidade de Desenvolvedores da Epic.

• Biblioteca de Aprendizado: abre a Biblioteca de Aprendizado.

• Fóruns: abre os fóruns do Unreal Editor para Fortnite (UEFN).

• Snippets: abre o site de snippets da linguagem Verse.

• Sobre o Unreal Editor: apresenta informações sobre a versão do editor, sua plataforma e informações de direitos autorais.

• Créditos: uma lista com os funcionários antigos e atuais que trabalharam no UEFN.

• Visite UnrealEngine.com: abre o site da Unreal Engine.

Ferramentas rápidas

Botões de acesso rápido:

• Salvar: salva o Blueprint.

• Pasta: abre o Navegador de Conteúdo.

• Compilar: compila o Blueprint.

Painel Paleta

Contém os ativos para criar uma IU personalizada que pode ser arrastada para a janela de visualização. Pesquisa por ativos na barra de pesquisa.

Comum

As instâncias de material que você cria podem ser encontradas na seção IU comum do painel Paleta. Daí, adicione seus fundos de botão juntamente com um widget Botão que pode ser personalizado por meio de suas configurações.

• Imagem: defina uma imagem como fundo da sua IU ou para um botão.

• Espaço nomeada: permite que você exponha um espaço externo para seu widget de usuário. Quando outras pessoas reutilizam seu controle de usuário, elas podem colocar o que quiserem nesse espaço nomeado.

• Bloco de Texto do UEFN: crie uma mensagem de IU personalizada.

Painel

• Painel de tela: o painel de tela é um painel amigável para designers que permite que o widget seja colocado em posições arbitrárias, ancorado e classificado por z com outros filhos da tela. Use este widget para a personalização manual.

• Painel de grade: um painel em forma de tabela que mantém a largura de todas as colunas na tabela. Permite os ativos dos filhos.

• Sobreposição: permite que fluam empilhados uns sobre os outros, usam um layout de fluxo simples para conteúdo em cada camada.

• Caixa de escala: permite que você coloque conteúdo com o tamanho desejado e faça com que ele seja dimensionado para atender às restrições colocadas sobre a área indicada nessa caixa. Se você precisa que uma imagem de fundo seja dimensionada para preencher a área, mas não fique distorcida com diferentes taxas de proporção, ou se precisa encaixar automaticamente algum texto em uma área, esse é o controle que você procura.

• Caixa de rolagem: uma coleção de widgets roláveis arbitrários. Ótimo para apresentar 10-100 widgets em uma lista. Incompatível com virtualização.

• Caixa de tamanho: permite que você redimensione todo o design dentro de um limite de sobreposição dentro do qual repousa.

• Caixa de empilhamento: é um painel de layout que permite que painéis filhos sejam colocados vertical e horizontalmente. Com todos os ativos da IU contidos em uma caixa de empilhamento, uma caixa de tamanho é colocada como seu filho.

• Painel de grade uniforme: um painel que divide uniformemente o espaço disponível entre todos os seus filhos.

Criações do usuário

A parte superior da lista inclui o widget de Blueprint como o ativo pai.

• Botão imponente do UEFN: um botão grande que inclui uma impressão grande e uma cor de fundo amarelo.

• Botão discreto do UEFN: um botão pequeno que inclui uma impressão pequena e uma cor de fundo branca.

• Botão normal do UEFN: um botão de tamanho médio que inclui uma impressão grande um fundo branco.

• Controle deslizante do UEFN: uma caixa deslizante que pode assumir valores de posição e de tamanho.

Janela de visualização

A janela de visualização exibe os ativos que compõem o layout do Blueprint.

Painel Detalhes

O painel Detalhes contém informações para a seleção atual na janela de visualização. Este painel apresenta informações sobre a posição, o tamanho, as imagens, entre outras.

Aba Hierarquia

Como você organiza a lista de ativos na aba Hierarquia determina os limites e o posicionamento de cada elemento da IU. Conforme você adiciona a aba Hierarquia, lembre-se de usar o painel Detalhes para dimensionar e alinhar os limites de todos os ativos.

Enquanto aprende a distribuir os ativos, pode ser mais fácil traçar um esboço do seu design em papel, criando um contorno da caixa que representa uma tela que contém o seu design.

O vídeo acima é uma demonstração breve da adição e do alinhamento de grades.

A foto acima é uma referência para organizar os ativos na aba Hierarquia usando sobreposições, caixas de empilhamento e caixas de tamanho.

Sobreposições

As sobreposições são contêiners para ativos. A primeira sobreposição colocada no exemplo acima serve como uma tela. A segunda é colocada como um filho para servir como contêiner dos ativos organizados na caixa de empilhamento.

Outro widget de sobreposição foi definido como o filho da caixa de tamanho para servir como contêiner para todos os ativos afetados por ela, que existe dentro de uma grade.

Caixa de empilhamento

Uma caixa de empilhamento é um painel de layout que permite que os painéis filhos sejam colocados vertical e horizontalmente. Com todos os ativos da IU contidos em uma caixa de empilhamento, uma caixa de tamanho é colocada como seu filho.

Caixa de tamanho

A caixa de tamanho permite que você redimensione todo o design dentro do limite da sobreposição onde ela está.

A sobreposição da caixa de tamanho geral do design contém três caixas de tamanho filhos que contêm partes agrupadas que compõem o design de flor, as pétalas, flores do disco e os botões.

Então, embora todo o design possa ser redimensionado, as partes dentro do design podem ser redimensionadas individualmente.

Dentro do layout da hierarquia, as caixas de texto do UEFN são colocadas dentro do botão e dos contêiners da IU para exibirem o texto na IU e nos botões.

Animações

Para criar uma nova animação para os ativos da sua IU usando o botão +Animação no painel Sequencer do editor de widgets.

Barra de ferramentas inferior

A barra de ferramentas inferior tem vários botões rápidos para a pesquisa de ativos, vinculações de visualização, logs de verificação, além de e alterações de salvamento ou sincronização.

• Gaveta de Conteúdo: abre os ativos na Gaveta de Conteúdo.

• Animações: abre a aba Animação e permite que você crie uma nova animação para os ativos da sua IU.

• Vinculações de visualização: permite que você abra a aba "Modelo de visualização" para adicionar funções aos botões da IU.

• Log de Saída: abre o log de saída para exibir os erros e os avisos.

• Comando: abre o painel de comando onde você pode digitar comandos.

• Status do salvamento: informa a você sobre o status dos Blueprints salvos.

• Alterações de check-in: faça o check-in de suas alterações no Unreal Revision Control.

• Status do projeto: informa a você se o seu projeto é o mais recente.

• Controle de revisão: abre as opções do controle de revisão