Cómo: Representar un intervalo para cada fotograma mediante CompositionTarget

El motor de animación de WPF proporciona muchas características para crear animaciones basadas en fotogramas. Sin embargo, hay escenarios de aplicación en los que se necesita un control más preciso de la representación por fotogramas. El objeto CompositionTarget proporciona la posibilidad de crear animaciones personalizadas basándose en una devolución de llamada por fotograma.

CompositionTarget es una clase estática que representa la superficie de la pantalla en la que se dibuja la aplicación. El evento Rendering se provoca cada vez que se dibuja la escena de la aplicación. La velocidad de representación de los fotogramas es la cantidad de veces que se dibuja la escena por segundo.

Nota
Para obtener un ejemplo de código completo sobre cómo utilizar CompositionTarget, vea Using the CompositionTarget Sample.

Ejemplo

El evento Rendering se provoca durante el proceso de representación de WPF. En el ejemplo siguiente se muestra cómo se registra un delegado EventHandler en el método Rendering estático de CompositionTarget.

            ' Add an event handler to update canvas background color just before it is rendered.
            AddHandler CompositionTarget.Rendering, AddressOf UpdateColor

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

Puede usar el método de control de eventos de representación para crear contenido de dibujo personalizado. Se llama a este método de control de eventos una vez por cada fotograma. Cada vez que WPF calcula las referencias de los datos de representación conservados en el árbol visual hasta el gráfico de escena de composición, se llama a este método de control de eventos. Además, si algún cambio efectuado en el de árbol visual fuerza la actualización del gráfico de escena de composición, también se llama al método de control de eventos. Tenga en cuenta que se llama al método de control de eventos después de calcular el diseño. Sin embargo, puede modificar el diseño en el método de control de eventos; es decir, el diseño se calculará una vez más antes de la representación.

En el ejemplo siguiente se muestra cómo se proporciona un dibujo personalizado en un método de control de eventos de CompositionTarget. En este caso, el color de fondo de Canvas se dibuja con un valor de color basado en la posición de las coordenadas del mouse. Si mueve el mouse dentro de Canvas, su fondo cambia de color. Además, se calcula la velocidad de fotogramas media, según el tiempo transcurrido actual y el número total de fotogramas representados.

        ' Called just before frame is rendered to allow custom drawing.
        Protected Sub UpdateColor(ByVal sender As Object, ByVal e As EventArgs)

            If _frameCounter = 0 Then
                ' Starting timing.
                _stopwatch.Start()
            End If
            _frameCounter = _frameCounter + 1

            ' Determine frame rate in fps (frames per second).
            Dim frameRate As Long = CLng(Fix(_frameCounter / Me._stopwatch.Elapsed.TotalSeconds))
            If frameRate > 0 Then
                ' Update elapsed time, number of frames, and frame rate.
                myStopwatchLabel.Content = _stopwatch.Elapsed.ToString()
                myFrameCounterLabel.Content = _frameCounter.ToString()
                myFrameRateLabel.Content = frameRate.ToString()
            End If

            ' Update the background of the canvas by converting MouseMove info to RGB info.
            Dim redColor As Byte = CByte(_pt.X / 3.0)
            Dim blueColor As Byte = CByte(_pt.Y / 2.0)
            myCanvas.Background = New SolidColorBrush(Color.FromRgb(redColor, &H0, blueColor))
        End Sub

// 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));
}

Puede suceder que el dibujo personalizado se ejecute a distintas velocidades en equipos diferentes. Esto es porque el dibujo personalizado no es independiente de la velocidad de fotogramas. Según el sistema que se ejecute y de la carga de trabajo de este último, se puede llamar al evento Rendering una cantidad distinta de veces por segundo. Para obtener información sobre cómo determinar la capacidad y el rendimiento del hardware de gráficos para un dispositivo que ejecuta una aplicación de WPF, vea Niveles de representación de gráficos.

La adición o eliminación de un delegado de EventHandler de representación mientras se está activando el evento se retrasará hasta que el evento haya terminado de activarse. Esto es coherente con la manera de controlar los eventos basados en MulticastDelegate en Common Language Runtime (CLR). Tenga en cuenta asimismo que no se garantiza que se llame a los eventos de representación en ningún orden determinado. Si tiene varios delegados de EventHandler que requieren un orden concreto, debe registrar un solo evento Rendering y multiplexar manualmente los delegados en el orden correcto.

Vea también

Referencia

CompositionTarget

Conceptos

Información general sobre la representación de gráficos en WPF