Como: Renderizar em um Intervalo Por Quadro Usando CompositionTarget

Artigo
08/25/2010

O mecanismo de animação WPF fornece vários recursos para criar animações baseadas em quadros. No entanto, há situações onde você precisará, em cada quadro, fazer um ajuste fino sobre a renderização. O objeto CompositionTarget lhe dá a capacidade criar animações personalizadas com base em uma callback por quadro.

CompositionTarget é um classe estática que representa a superfície de exibição em que seu aplicativo está sendo desenhado. O evento Rendering é gerado cada vez que cena do aplicativo é desenhada. A taxa de quadros renderizados é o número de vezes que a cena é desenhada por segundo.

Observação:
Para um exemplo de código completo usar CompositionTarget, consulte Usando o exemplo de CompositionTarget.

Exemplo

O evento Rendering é acionado durante o processo de renderização do WPF. O exemplo a seguir mostra como você registra um representante EventHandler para o método estático Rendering no CompositionTarget.

// Add an event handler to update canvas background color just before it is rendered.
CompositionTarget.Rendering += UpdateColor;

Você pode usar seu método tratador de eventos de renderização para criar conteúdo personalizado de desenho. O método manipulador de evento é chamado uma vez por quadro. Cada vez que WPF serializa os dados persistentes de renderização na árvore visual para o grafo cena de composição, seu método tratador de eventos é chamado. Além disso, se as alterações na árvore visual forçarem atualizações para o grafo cena de composição, seu método tratador de eventos também é chamado. Observe que seu método tratador de eventos é chamado depois que layout foi calculado. No entanto, você pode modificar o layout no seu método tratador de eventos, o que significa que o layout será ser calculado mais uma vez antes da renderização.

O exemplo a seguir mostra como você pode fornecer desenhos personalizados em um método tratador de eventos de CompositionTarget. Nesse caso, a cor do plano de fundo do Canvas é desenhada com um valor de cor calculado a partir da posição de coordenadas do mouse. Se você mover o mouse dentro do Canvas, a cor do seu plano de fundo será alterada. Além disso, a taxa média de quadros é calculada, com base no tempo decorrido atual e o número total de quadros renderizados.

// Called just before frame is rendered to allow custom drawing.
protected void UpdateColor(object sender, EventArgs e)
{
    if (_frameCounter++ == 0)
    {
        // Starting timing.
        _stopwatch.Start();
    }

    // Determine frame rate in fps (frames per second).
    long frameRate = (long)(_frameCounter / this._stopwatch.Elapsed.TotalSeconds);
    if (frameRate > 0)
    {
        // Update elapsed time, number of frames, and frame rate.
        myStopwatchLabel.Content = _stopwatch.Elapsed.ToString();
        myFrameCounterLabel.Content = _frameCounter.ToString();
        myFrameRateLabel.Content = frameRate.ToString();
    }

    // Update the background of the canvas by converting MouseMove info to RGB info.
    byte redColor = (byte)(_pt.X / 3.0);
    byte blueColor = (byte)(_pt.Y / 2.0);
    myCanvas.Background = new SolidColorBrush(Color.FromRgb(redColor, 0x0, blueColor));
}

Você pode descobrir que seu desenho personalizado é executado a diferentes velocidades em diferentes computadores. Isso ocorre porque seu desenho personalizado não é independente da taxa de quadros. Dependendo do sistema que você está executando e a carga de trabalho do sistema, o evento Rendering pode ser chamado um diferente número de vezes por segundo. Para obter informações sobre como determinar a capacidade e desempenho do hardware gráfico para um dispositivo que executa um aplicativo WPF, consulte Níveis de Renderização Gráfica.

A adição ou removeção de um representante de renderização EventHandler enquanto o evento está disparando será atrasada até que o evento tenha terminado de disparar. Isso é consistente com o comportamento dos eventos baseados em MulticastDelegate na Common Language Runtime (CLR). Também observe que não há garantias sobre a ordem em que os eventos de renderização serão chamados. Se você tiver vários representantes de EventHandler que contam com uma ordem específica, você deve registrar um único evento Rendering e multiplexar os representantes na ordem correta por conta própria.

Usando Perforator para analisar o comportamento da renderização

Perforator é um ferramenta para análise de perfis de desempenho de WPF para estudar o comportamento da renderização. Perforator exibe um conjunto de valores que permitem que você analise comportamento muito específico da renderização em partes do seu aplicativo. Nesse caso, Perforator mostra uma taxa de quadros de 60 quadros por segundo para o aplicativo de exemplo PhotoDemo.

Janela principal do Perforator

Janela principal do Perforator com dados de renderização