Partilhar via

Otimizando o desempenho: layout e design

  • Artigo

O design do seu aplicativo WPF pode afetar seu desempenho, criando sobrecarga desnecessária no cálculo do layout e na validação de referências de objeto. A construção de objetos, particularmente em tempo de execução, pode afetar as características de desempenho do seu aplicativo.

Este tópico fornece recomendações de desempenho nessas áreas.

Diagramação

O termo "passagem de layout" descreve o processo de medir e organizar os membros de uma coleção de filhos de um objeto derivado da Panele, em seguida, desenhá-los na tela. A passagem de layout é um processo matematicamente intensivo — quanto maior o número de crianças na coleção, maior o número de cálculos necessários. Por exemplo, cada vez que um objeto filho UIElement na coleção muda de posição, ele tem a possibilidade de acionar uma nova passagem pelo sistema de layout. Devido à estreita relação entre as características do objeto e o comportamento do layout, é importante entender o tipo de eventos que podem invocar o sistema de layout. Seu aplicativo terá um melhor desempenho, reduzindo ao máximo quaisquer invocações desnecessárias do passo de layout.

O sistema de layout completa duas passagens para cada membro filho em uma coleção: uma passagem de medida e uma passagem de arranjo. Cada objeto filho fornece sua própria implementação substituída dos métodos Measure e Arrange para fornecer seu próprio comportamento de layout específico. Em sua forma mais simples, layout é um sistema recursivo que leva a que um elemento seja dimensionado, posicionado e desenhado na tela.

  • Um objeto filho UIElement inicia o processo de layout ao ter as suas propriedades principais medidas.

  • As propriedades FrameworkElement do objeto relacionadas ao tamanho, como Width, Heighte Margin, são avaliadas.

  • A lógica específica Panelé aplicada, como a propriedade Dock do DockPanelou a propriedade Orientation do StackPanel.

  • O conteúdo é organizado ou posicionado depois que todos os objetos filho foram medidos.

  • A coleção de objetos filho é desenhada no ecrã.

O processo de passagem de layout é invocado novamente se ocorrer uma das seguintes ações:

  • Um objeto filho é adicionado à coleção.

  • Um LayoutTransform é aplicado ao objeto filho.

  • O método UpdateLayout é chamado para o objeto filho.

  • Quando ocorre uma alteração no valor de uma propriedade de dependência marcada com metadados que afetam as passagens de medida ou de organização.

Use o painel mais eficiente sempre que possível

A complexidade do processo de layout é diretamente baseada no comportamento do layout dos elementos derivados do Panelque você usa. Por exemplo, um controle Grid ou StackPanel fornece muito mais funcionalidade do que um controle Canvas. O preço para este maior aumento na funcionalidade é um maior aumento nos custos de desempenho. No entanto, se você não precisar da funcionalidade que um controle de Grid fornece, você deve usar as alternativas menos dispendiosas, como um Canvas ou um painel personalizado.

Para obter mais informações, consulte Visão geral dos painéis .

Atualizar em vez de substituir um RenderTransform

Talvez seja possível atualizar um Transform em vez de substituí-lo como o valor de uma propriedade RenderTransform. Isto é particularmente verdadeiro em cenários que envolvem animação. Ao atualizar um Transformexistente, você evita iniciar um cálculo de layout desnecessário.

Construa sua árvore Top-Down

Quando um nó é adicionado ou removido da árvore lógica, as invalidações de propriedade são geradas no pai do nó e em todos os seus filhos. Como resultado, uma abordagem de construção de cima para baixo deve sempre ser seguida para evitar o custo de invalidações desnecessárias em nós que já foram validados. A tabela a seguir mostra a diferença na velocidade de execução entre a construção de uma árvore de cima para baixo versus de baixo para cima, onde a árvore tem 150 níveis de profundidade com um único TextBlock e DockPanel em cada nível.

Ação Construção de árvores (em ms) Render — inclui a construção de árvores (em ms)
Da base para o topo 366 454
De cima para baixo 11 96

O exemplo de código a seguir demonstra como criar uma árvore de cima para baixo.

private void OnBuildTreeTopDown(object sender, RoutedEventArgs e)
{
    TextBlock textBlock = new TextBlock();
    textBlock.Text = "Default";

    DockPanel parentPanel = new DockPanel();
    DockPanel childPanel;

    myCanvas.Children.Add(parentPanel);
    myCanvas.Children.Add(textBlock);

    for (int i = 0; i < 150; i++)
    {
        textBlock = new TextBlock();
        textBlock.Text = "Default";
        parentPanel.Children.Add(textBlock);

        childPanel = new DockPanel();
        parentPanel.Children.Add(childPanel);
        parentPanel = childPanel;
    }
}

Private Sub OnBuildTreeTopDown(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Dim textBlock As New TextBlock()
    textBlock.Text = "Default"

    Dim parentPanel As New DockPanel()
    Dim childPanel As DockPanel

    myCanvas.Children.Add(parentPanel)
    myCanvas.Children.Add(textBlock)

    For i As Integer = 0 To 149
        textBlock = New TextBlock()
        textBlock.Text = "Default"
        parentPanel.Children.Add(textBlock)

        childPanel = New DockPanel()
        parentPanel.Children.Add(childPanel)
        parentPanel = childPanel
    Next i
End Sub

Para obter mais informações sobre a árvore lógica, consulte árvores no WPF.

Ver também