Écriture d’un jeu basé sur des sprites

Applies to Windows and Windows Phone

La création d’un jeu d’action en 2D est un rite de passage pour le développement sur n’importe quelle plateforme.

Écriture de jeux en 2D

Il existe de nombreuses façons de commencer l’écriture de jeux en 2D : après tout, cela consiste juste à afficher une image à une position spécifique à l’écran et de réagir à l’entrée utilisateur.

En tant que développeur iOS, vous avez peut-être écrit des jeux à l’aide de contrôles UIImage uniquement, ou vous avez peut-être apporté vos propres routines de sprites dans OpenGL ES. Lors du portage d’une application dans Windows 8, il n’existe aucune corrélation directe entre les technologies Windows et iOS, et vous devez donc peser le pour et le contre de plusieurs approches différentes. Par exemple, alors que les jeux qui utilisent des solutions de zone de dessin XAML ou de zone de dessin HTML sont à la fois rapides et simples à développer, ils peuvent ne pas offrir les performances dont vous avez besoin pour une action complexe. D’un autre côté, DirectX et C++ peuvent sembler un peu trop élaborés pour des applications plus simples.

Voici un résumé rapide de la technologie Windows 8 la plus proche des modèles de développement iOS courants. Il n’existe pas de correspondance directe, mais vous aurez une idée des éléments impliqués.

Technologie iOSTechnologie Windows 8
UIKit (UIImage, UIButton, UILabel, etc.)Zone de dessin XAML ou HTML
Code OpenGL ES, avec des sprites rendus sous forme de quadruplés ou de sprites de points.DirectX, avec des sprites rendus sous forme de textures.
SpriteKitDirectX, avec des sprites rendus sous forme de textures.
Infrastructure tierce, par exemple Cocos2D.Infrastructure tierce, par exemple Cocos2D-X.
Outil de création de jeux tiers, par exemple Unity3D.Outil de création de jeux tiers, par exemple Unity3D.

 

Présentation de MonoGame

MonoGame constitue une bonne solution pour les utilisateurs qui ont fait du développement iOS et recherchent une bibliothèque de sprites de base. MonoGame est un wrapper C# Open Source pour DirectX, conçu pour faciliter l’écriture de jeux basés sur des sprites en 2D. Il représente un bon compromis entre les performances et la facilité d’utilisation.

Si vous avez déjà écrit des jeux simples pour Windows, Windows Phone ou Xbox, vous connaissez probablement l’infrastructure de jeux XNA. XNA n’est plus pris en charge sur Windows ni Windows Phone, mais MonoGame tente de combler cette lacune. MonoGame a été conçu à l’origine pour être une version interplateforme de XNA. Maintenant, MonoGame vous permet de terminer tous les projets XNA existants que vous pouvez avoir, mais également d’écrire un jeu en partant de zéro pour Windows, et de l’exécuter sur Windows Phone, iOS et Android.

Génération d’une application avec MonoGame

MonoGame prend en charge les éditions Visual Studio Express, donc vous êtes totalement libre de développer des jeux basés sur des sprites pour Windows 8. Une fois que vous avez installé MonoGame, Visual Studio offre plusieurs nouveaux modèles de projet. Pour des performances optimales, utilisez le modèle Projet Windows Store MonoGame. Toutefois, si vous voulez utiliser des contrôles XAML (peut-être pour fournir des superpositions de texte, des boutons ou d’autres contrôles), vous pouvez également employer un Projet Windows Store (XAML) MonoGame.

Modèle de projet MonoGame

Le projet C# créé par le modèle est simple à comprendre et crée plusieurs méthodes que vous devez implémenter, notamment LoadContent(), Update() et Draw().

MonoGame restitue les sprites à votre place, mais il existe un inconvénient. Pour pouvoir dessiner les images, MonoGame les attend sous un format nommé .xnb. Vous ne pouvez pas simplement inclure des fichiers PNG et attendre qu’ils soient restitués. Avec XNA, une approche de pipeline de contenu permettait à votre projet de contenir des fichiers PNG et les fichiers .xnb étaient créés automatiquement. MonoGame prend désormais en charge son propre pipeline de contenu (voir cette page sur GitHub pour plus d’informations), mais vous pouvez aussi utiliser la technique suivante :

Installez Visual Studio 2012 Express pour Phone, car il prend encore en charge la génération d’applications XNA pour Windows Phone 7. Oui, le processus semble au premier abord peu pratique, mais il fonctionne. Il vous suffit de créer un projet XNA Windows Phone 7, d’y placer vos images PNG, de générer le projet (vous n’avez pas besoin de l’exécuter, il vous suffit de le générer), puis de copier les fichiers .xnb dans votre nouveau projet Windows 8. La même approche est utilisée pour les effets sonores et nuanceurs.

Exemple de code C#

Voici le début d’un jeu dans lequel le sprite du joueur doit percuter des sprites cibles et les détruire pour gagner des points. Il va changer le monde des jeux. Tout d’abord, nous créons une liste pour stocker les emplacements des sprites cibles, puis une variable pour stocker l’emplacement de l’objet du joueur :


        private List<Vector2> ball_locations;
        private Vector2 player;

Nous les initialisons ensuite dans la méthode Initialize() :


        protected override void Initialize()
        {
            // TODO: Add your initialization logic here

            base.Initialize();

            ball_locations = new List<Vector2>();

            for (float y = 40; y < 700; y += 60)
                for (float x = 100; x < 500; x += 60)
                {
                    ball_locations.Add(new Vector2(x,y));
                }

            player = new Vector2(1000, 400);
        }

Si vous n’aviez pas deviné, Vector2 est un nouveau type de données qui contient des coordonnées X et Y. Avec Vector3, il s’avère extrêmement utile lors de l’écriture de jeux !

Dans la méthode LoadContent(), nous chargeons les fichiers .xnb qui contiennent les images dont nous avons besoin. Ces fichiers .xnb ont été intégrés à un projet XNA Windows Phone distinct, comme mentionné précédemment. Dans cet exemple, nous utilisons deux images : une image de champ d’étoiles pour l’arrière-plan et une image de balle blanche unique. Comme MonoGame permet de teinter les images en les dessinant, nous n’avons pas à créer une balle de chaque couleur possible.


        protected override void LoadContent()
        {
            // Create a new SpriteBatch, which can be used to draw textures.
            _spriteBatch = new SpriteBatch(GraphicsDevice);

            // TODO: use this.Content to load your game content here

            _backgroundTexture = Content.Load<Texture2D>("starfieldImage");
            _ball = Content.Load<Texture2D>("ballImage");

        }

Nous devons maintenant dessiner nos objets. MonoGame, comme XNA, utilise un objet appelé SpriteBatch pour le rendu des sprites. Vous devez créer un SpriteBatch, puis appeler ses méthodes Begin() et End(), en dessinant les sprites dans l’intervalle. Il est également important d’effacer chaque image de l’écran. Par exemple ici, l’image du champ d’étoiles est dessinée pour occuper l’intégralité de l’écran.


        protected override void Draw(GameTime gameTime)
        {
            _spriteBatch.Begin();

            // Draw backgound (also clears screen)
            _spriteBatch.Draw(_backgroundTexture, GraphicsDevice.Viewport.Bounds, Color.White);

            // Draw the target balls in alternating colors
            int i = 0;
            foreach (Vector2 v in ball_locations)
            {
                switch (i)
                {
                    case 0: _spriteBatch.Draw(_ball, new Rectangle((int)v.X, (int)v.Y, 50, 50), Color.Red); break;
                    case 1: _spriteBatch.Draw(_ball, new Rectangle((int)v.X, (int)v.Y, 50, 50), Color.Green); break;
                    case 2: _spriteBatch.Draw(_ball, new Rectangle((int)v.X, (int)v.Y, 50, 50), Color.Blue); break;
                    case 3: _spriteBatch.Draw(_ball, new Rectangle((int)v.X, (int)v.Y, 50, 50), Color.Yellow); break;
                }
                i++; if (i > 3) i = 0;
            }

            // Draw player's ball
            _spriteBatch.Draw(_ball, new Rectangle((int)player.X, (int)player.Y, 50, 50), Color.White);

            _spriteBatch.End();

            base.Draw(gameTime);
        }
    }
}

Quand elle est exécutée, cette application ressemble à ceci :

Modèle de projet MonoGame

Bien évidemment, il reste encore beaucoup de travail ! La mise à jour de l’emplacement des différents objets à l’écran est effectuée dans la méthode Update(), grâce à laquelle chaque image est appelée automatiquement. L’affichage de texte est également une opération qui demande un peu de travail : vous pouvez choisir d’utiliser un projet XAML et superposer ainsi un contrôle TextBlock et des objets Button, ou vous pouvez utiliser le rendu de texte SpriteBatch MonoGame. Le rendu du texte sera plus rapide si vous utilisez le rendu SpriteBatch, mais vous devez créer un objet de police dans un projet XNA, de la même manière que nous avons créé les images .xnb à partir de fichiers PNG.

Si vous êtes intéressé par la création de jeux dans MonoGame, le site Web MonoGame.net comprend de nombreux didacticiels et fichiers d’aide. Le manuel Windows 8 and Windows Phone 8 Game Development écrit par Adam Dawes est également un excellent guide.

Rubriques associées

Infrastructure de jeux XNA
MonoGame
De XNA à MonoGame (Gamasutra)
Bibliothèques de code, kits de ressources et autres sources d’aide
Reversi, un jeu du Windows Store en XAML, C# et C++
Développement de jeux DirectX et exemples de procédures pas à pas

 

 

Afficher:
© 2015 Microsoft