Extender el juego de ejemploExtend the sample game

Nota

Este tema forma parte de la serie de tutoriales de creación de una plataforma universal de Windows sencilla (UWP) con DirectX .This topic is part of the Create a simple Universal Windows Platform (UWP) game with DirectX tutorial series. El tema de ese vínculo establece el contexto de la serie.The topic at that link sets the context for the series.

En este momento, hemos tratado los componentes clave de un juego de DirectX 3D básico de Plataforma universal de Windows (UWP).At this point we've covered the key components of a basic Universal Windows Platform (UWP) DirectX 3D game. Puede configurar el marco de trabajo para un juego, incluidos el proveedor de vistas y la canalización de representación, e implementar un bucle de juego básico.You can set up the framework for a game, including the view-provider and rendering pipeline, and implement a basic game loop. También puede crear una superposición de la interfaz de usuario básica, incorporar sonidos e implementar controles.You can also create a basic user interface overlay, incorporate sounds, and implement controls. Está a su modo de crear un juego propio, pero si necesita más ayuda e información, consulte estos recursos.You're on your way to creating a game of your own, but if you need more help and info, check out these resources.

Usar XAML para la superposiciónUsing XAML for the overlay

Una alternativa que no analizamos en profundidad es el uso de XAML en lugar de Direct2D para la superposición.One alternative that we didn't discuss in depth is the use of XAML instead of Direct2D for the overlay. XAML tiene muchas ventajas con respecto a Direct2D para dibujar elementos de la interfaz de usuario.XAML has many benefits over Direct2D for drawing user interface elements. La ventaja más importante es que facilita la incorporación de la apariencia de Windows 10 en su juego de DirectX.The most important benefit is that it makes incorporating the Windows 10 look and feel into your DirectX game more convenient. Muchos de los elementos, estilos y comportamientos comunes que definen a una aplicación para UWP están estrechamente integrados en el modelo XAML, por lo que implementarlos supone mucho menos trabajo para el desarrollador del juego.Many of the common elements, styles, and behaviors that define a UWP app are tightly integrated into the XAML model, making it far less work for a game developer to implement. Si tu diseño de juego tiene una interfaz de usuario complicada, piensa en la posibilidad de usar XAML en lugar de Direct2D.If your own game design has a complicated user interface, consider using XAML instead of Direct2D.

Con XAML, podemos crear una interfaz de juego que tenga un aspecto similar al de Direct2D que se realizó anteriormente.With XAML, we can make a game interface that looks similar to the Direct2D one made earlier.

XAMLXAML

Superposición XAML

Direct2DDirect2D

Superposición D2D

Aunque tienen resultados finales similares, hay una serie de diferencias entre la implementación de las interfaces de Direct2D y XAML.While they have similar end results, there are a number of differences between implementing Direct2D and XAML interfaces.

CaracterísticaFeature XAMLXAML Direct2DDirect2D
Definir superposiciónDefining overlay Definido en un archivo XAML, \*.xaml .Defined in a XAML file, \*.xaml. Una vez que entienda el código XAML, la creación y configuración de superposiciones más complicadas se convierten en simpiler en comparación con Direct2D.Once understanding XAML, creating and configuring more complicated overlays are made simpiler when compared to Direct2D. Se define como una colección de primitivos de Direct2D y cadenas de DirectWrite colocadas y escritas manualmente en un búfer de destino de direct2d.Defined as a collection of Direct2D primitives and DirectWrite strings manually placed and written to a Direct2D target buffer.
Elementos de la interfaz de usuarioUser interface elements Los elementos de la interfaz de usuario XAML proceden de elementos estandarizados que forman parte de la Windows Runtime las API XAML, incluidas Windows:: UI:: XAML y Windows:: UI:: XAML:: Controls.XAML user interface elements come from standardized elements that are part of the Windows Runtime XAML APIs, including Windows::UI::Xaml and Windows::UI::Xaml::Controls. El código que controla el comportamiento de los elementos de interfaz de usuario XAML se define en un archivo de código subyacente: Main.xaml.cpp.The code that handles the behavior of the XAML user interface elements is defined in a codebehind file, Main.xaml.cpp. Las formas simples se pueden dibujar como rectángulos y elipses.Simple shapes can be drawn like rectangles and ellipses.
Cambio de tamaño de ventanaWindow resizing Controla naturalmente el cambio de tamaño y la visualización de los eventos de cambio de estado, transformando la superposición en consecuenciaNaturally handles resize and view state change events, transforming the overlay accordingly Es necesario especificar manualmente cómo volver a dibujar los componentes de la superposición.Need to manually specify how to redraw the overlay's components.

Otra gran diferencia implica la cadena de intercambio.Another big difference involves the swap chain. No tiene que adjuntar la cadena de intercambio a un objeto Windows:: UI:: Core:: CoreWindow .You don't have to attach the swap chain to a Windows::UI::Core::CoreWindow object. En su lugar, una aplicación de DirectX que incorpora XAML asocia una cadena de intercambio cuando se construye un nuevo objeto SwapChainPanel .Instead, a DirectX app that incorporates XAML associates a swap chain when a new SwapChainPanel object is constructed.

En el fragmento de código siguiente se muestra cómo declarar XAML para SwapChainPanel en el archivo DirectXPage. Xaml .The following snippet show how to declare XAML for the SwapChainPanel in the DirectXPage.xaml file.

<Page
    x:Class="Simple3DGameXaml.DirectXPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Simple3DGameXaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <SwapChainPanel x:Name="DXSwapChainPanel">

    <!-- ... XAML user controls and elements -->

    </SwapChainPanel>
</Page>

El objeto SwapChainPanel se establece como la propiedad Content del objeto Window actual creado en el inicio por el singleton de la aplicación.The SwapChainPanel object is set as the Content property of the current window object created at launch by the app singleton.

void App::OnLaunched(_In_ LaunchActivatedEventArgs^ /* args */)
{
    m_mainPage = ref new DirectXPage();

    Window::Current->Content = m_mainPage;
    // Bring the application to the foreground so that it's visible
    Window::Current->Activate();
}

Para asociar la cadena de intercambio configurada a la instancia de SwapChainPanel definida por el código XAML, debe obtener un puntero a la implementación de la interfaz ISwapChainPanelNative nativa subyacente y llamar a ISwapChainPanelNative:: SetSwapChain en ella, pasándole la cadena de intercambio configurada.To attach the configured swap chain to the SwapChainPanel instance defined by your XAML, you must obtain a pointer to the underlying native ISwapChainPanelNative interface implementation and call ISwapChainPanelNative::SetSwapChain on it, passing it your configured swap chain.

El siguiente fragmento de código de DX::D eviceresources:: CreateWindowSizeDependentResources detalla esto para la interoperabilidad de DirectX/XAML:The following snippet from DX::DeviceResources::CreateWindowSizeDependentResources details this for DirectX/XAML interop:

        ComPtr<IDXGIDevice3> dxgiDevice;
        DX::ThrowIfFailed(
            m_d3dDevice.As(&dxgiDevice)
            );

        ComPtr<IDXGIAdapter> dxgiAdapter;
        DX::ThrowIfFailed(
            dxgiDevice->GetAdapter(&dxgiAdapter)
            );

        ComPtr<IDXGIFactory2> dxgiFactory;
        DX::ThrowIfFailed(
            dxgiAdapter->GetParent(IID_PPV_ARGS(&dxgiFactory))
            );

        // When using XAML interop, the swap chain must be created for composition.
        DX::ThrowIfFailed(
            dxgiFactory->CreateSwapChainForComposition(
                m_d3dDevice.Get(),
                &swapChainDesc,
                nullptr,
                &m_swapChain
                )
            );

        // Associate swap chain with SwapChainPanel
        // UI changes will need to be dispatched back to the UI thread
        m_swapChainPanel->Dispatcher->RunAsync(CoreDispatcherPriority::High, ref new DispatchedHandler([=]()
        {
            // Get backing native interface for SwapChainPanel
            ComPtr<ISwapChainPanelNative> panelNative;
            DX::ThrowIfFailed(
                reinterpret_cast<IUnknown*>(m_swapChainPanel)->QueryInterface(IID_PPV_ARGS(&panelNative))
                );
            DX::ThrowIfFailed(
                panelNative->SetSwapChain(m_swapChain.Get())
                );
        }, CallbackContext::Any));

        // Ensure that DXGI does not queue more than one frame at a time. This both reduces latency and
        // ensures that the application will only render after each VSync, minimizing power consumption.
        DX::ThrowIfFailed(
            dxgiDevice->SetMaximumFrameLatency(1)
            );
    }

Para obtener más información sobre este proceso, consulta el tema sobre interoperación entre DirectX y XAML.For more info about this process, see DirectX and XAML interop.

EjemploSample

Para descargar la versión de este juego que usa XAML para la superposición, vaya al juego de ejemplo de filmación de Direct3D (XAML).To download the version of this game that uses XAML for the overlay, go to the Direct3D shooting sample game (XAML).

A diferencia de la versión del juego de ejemplo que se describe en el resto de estos temas, la versión de XAML define su marco en los archivos app. Xaml. cpp y DirectXPage. Xaml. cpp , en lugar de app. cpp y GameInfoOverlay. cpp, respectivamente.Unlike the version of the sample game discussed in the rest of these topics, the XAML version defines its framework in the App.xaml.cpp and DirectXPage.xaml.cpp files, instead of App.cpp and GameInfoOverlay.cpp, respectively.