Vantagens do Nodify

Arquitetura MVVM Nativa

O framework separa completamente a lógica de negócio da camada visual. Através de associação de dados (data binding), alterações no ViewModel são refletidas automaticamente na interface gráfica, eliminando a necessidade de manipulação manual de controlos.

Desempenho Otimizado

A renderização inteligente do Nodify atualiza apenas os elementos visuais modificados. Mesmo com centenas de nós e conexões simultâneas, a interface mantém a fluidez, utilizando técnicas de renderização em camadas para reduzir a sobrecarga.

Personalização Flexível

Desenvolvedores podem escolher entre estilos de conexão retos, em degraus ou curvos. Os nós podem ser estilizados livremente, e temas claros ou escuros podem ser aplicados para adequar a aplicação ao contexto do utilizador.

Cenários de Utilização

• Máquinas de Estado: Modelagem de transições em jogos ou fluxos de trabalho, onde cada nó representa um estado e as conexões definem as regras de mudança.
• Procsesamento de Dados: Criação de motores de cálculo em tempo real, permitindo observar o fluxo de dados entre operações de forma dinâmica.
• Diagramação: Construção de fluxogramas complexos com suporte a agrupamentos e anotações.

Implementação Rápida

Para integrar o Nodify ao seu projeto, instale o pacote via console do gestor de pacotes:

Install-Package Nodify

Em seguida, declare o espaço de nomes no seu ficheiro XAML:

xmlns:ne="https://miroiu.github.io/nodify"

Adicione o controlo do editor à sua vista:

<ne:NodifyEditor x:Name="GraphSurface"
                     ItemsSource="{Binding CellCollection}"
                     Connections="{Binding LinkCollection}" />

No seu ViewModel, defina as coleções que armazenarão os elementos:

public class GraphEditorVM : ObservableObject
{
    public ObservableCollection<GraphCellVM> CellCollection { get; }
    public ObservableCollection<GraphLinkVM> LinkCollection { get; }
}

Personalização Avançada

Modelos de Nós Personalizados

A aparência dos nós pode ser totalmente alterada sobrescrevendo o ItemTemplate:

<ne:NodifyEditor.ItemTemplate>
    <DataTemplate DataType="{x:Type vm:SpecializedCellVM}">
        <Border Background="{DynamicResource CellBgColor}"
                CornerRadius="6"
                Padding="15"
                Margin="2">
            <TextBlock Text="{Binding Header}"
                       Foreground="WhiteSmoke"
                       FontWeight="SemiBold" />
        </Border>
    </DataTemplate>
</ne:NodifyEditor.ItemTemplate>

Estilos de Conexão

O framework disponibiliza três modos nativos de renderização de linhas:

• LineConnection: Conexão direta em linha reta.
• StepConnection: Conexão angular com pontos de controlo.
• CircuitConnection: Curvas suaves semelhantes a circuitos elétricos.

Gestão de Histórico

O Nodify inclui um sistema nativo de desfazer/refazer (undo/redo). Ações como criação de nós, movimentação e estabelecimento de conexões são registadas automaticamente e podem ser revertidas via atalhos de teclado.

Otimização de Desempenho

Virtualização de Interface

Para grafos extensos, a ativação da virtualização garante que apenas os nós visíveis na área de visualziação sejam processados, reduzindo drasticamente o consumo de memória.

Otimização de Associações

Mantenha as notificações de propriedade no ViewModel leves. Evite cálculos pesados nos setters e utilize atualizações em lote nas coleções observáveis para minimizar atualizações desnecessárias da interface.

Carregamento Assíncrono

Em projetos massivos, carregue inicialmente apenas a estrutura principal. Sub-nós podem ser carregados sob demanda à medida que o utilizador expande os grupos, aproveitando o sistema de evantos do framework.

Questões Comuns e Melhores Práticas

Transferência de Dados entre Nós

O tráfego de informações é gerido pelo sistema de conectores (Connector). Defina conectores de entrada e saída nos ViewModels dos nós e implemente a lógica de transformação de dados quando a conexão for estabelecida.

Validação de Conexões

Para impedir conexões inválidas, sobrescreva o método CanConnect. Isto permite aplicar regras de negócio, como restringir conexões apenas entre conectores do mesmo tipo de dados.

Persistência do Grafo

O Nodify não impõe um formato de serialização. Serialize o estado dos seus ViewModels para JSON ou XML conforme a conveniência do seu projeto, permitindo salvar e carregar diagramas completos.

Design de Nós e Experiência do Utilizador

Mantenha a responsabilidade de cada nó simples. Divida lógicas complexas em múltiplos nós conectados para facilitar a leitura. Utilize feedback visual dinâmico, como destacar nós ativos ou colorir conexões com erro, e tire partido dos gestos nativos para arrastar, selecionar múltiplos elementos e aplicar zoom.