Ajout et affichage d'un arrière-plan
En utilisant le projet vide créé dans la partie précédente, nous allons maintenant voir comment ajouter un fond et quelques nuages de fantaisie.
Votre premier arrière-plan statique. Nous utiliserons l'image suivante:

(Clic droit pour enregistrer l'image)
Importer l'image dans le dossier « sprites ». Copiez simplement le fichier, ou faites-le glisser-déposer depuis l'explorateur.
Ne vous inquiétez pas sur les paramètres d'importation pour l'instant.
Dans l'unité, créer un nouvel objet de jeu de Sprite dans la scène.

Qu'est-ce qu'un sprite?
Dans « sprite » générale, nous appelons une image 2D affichée dans un jeu vidéo. Ici, il est un objet spécifique pour l'unité fait des jeux 2D.
Ajouter la texture à l'image-objet
Nous allons maintenant sélectionner l'image-objet réel à afficher. Assurez-vous que « New Sprite » est sélectionné et regardez l'inspecteur. Définissez la propriété Sprite à l'image « de fond »:

(Vous devez cliquer sur la petite icône ronde à droite de la zone de saisie pour afficher l'inspecteur « Select Sprite »)
Vous pouvez voir que d'autres sprites sont là. Ce sont les images par défaut utilisées par uGUI (le système UI Unity).
« Mon sprite ne se présente pas dans la boîte de dialogue? ». Tout d'abord, assurez-vous que vous êtes dans l'onglet « actifs » de la boîte de dialogue « Sélectionner Sprite ».
Certains lecteurs ont rapporté que, dans leur projet, cette boîte de dialogue était vide. La raison en est que pour certaines installations de Unity, même avec un nouveau projet nouveau 2D, les images sont importées sous forme de « Texture » et non « Sprite ».
Pour résoudre ce problème, vous devez sélectionner l'image dans le volet « Projet », et dans le « inspecteur », modifiez la propriété « Type de texture » à « Sprite »:

Nous ne savons pas pourquoi tout le monde ne semble pas avoir le même comportement.
Eh bien, nous avons mis un sprite simple, l'affichage d'un fond de ciel nuageux. Vous pouvez penser qu'il était un peu compliqué juste pour ça. En fait, on aurait pu glisser le sprite de l'onglet « Projet » directement à droite dans la « scène ».
Nous allons réorganiser la scène.
Dans le volet « Hiérarchie », sélectionnez le nouveau Sprite. Renommer dans Background1 ou quelque chose que vous retiendrez facilement.
Déplacez ensuite l'objet à l'endroit où il appartient: Niveau -> Arrière-plan. Changer la position (0, 0, 0).

Un exercice rapide: dupliquer l'arrière-plan et placez-le au (20, 0, 0). Il doit correspondre parfaitement à la première partie.
Pointe. vous pouvez dupliquer un objet avec cmd + D (OS X) ou Ctrl + D (Windows) raccourcis.

La déclaration suivante semblera assez évident, mais il a des conséquences: nous affichons un monde 2D.
Cela signifie que toutes les images sont à la même profondeur, à savoir. 0. Et vous (ainsi que le moteur graphique) ne sait pas vraiment qui va être affiché en premier.
couches sprite nous permettent de dire l'unité ce qui est à l'avant et ce qui est à l'arrière.
Dans l'unité, nous pouvons changer le « Z » de nos éléments, et cela nous permettra d'avoir des couches. Ceci est en fait ce que nous faisions dans ce tutoriel avant l'unité 5 mise à jour.
Mais nous avons pensé qu'il était une bonne idée d'utiliser des couches de sprites.
Sur votre composant « Sprite Renderer », vous avez un champ nommé ... « Layer Sprite », qui est actuellement à défaut.
Si vous cliquez dessus, une courte liste affichera:

Ajoutons quelques couches pour répondre à nos besoins (utilisez le bouton « + »):

Appliquer la couche de fond à notre sprite de fond:

Pointe. les paramètres « ordre dans la couche » est une façon de limiter les sous-couches. Sprites avec des chiffres inférieurs sont rendus avant sprites plus grand nombre.
Remarque. la couche « par défaut » ne peut pas être supprimé, car il est la couche utilisée par des éléments 3D. Vous pouvez avoir des objets 3D dans votre jeu 2D. Les particules sont considérés comme des objets 3D par l'unité, de sorte qu'ils seront rendus sur cette couche.
Aussi connu comme accessoires. Ces éléments ne sont pas utilisés pour améliorer le gameplay, mais pour améliorer visuellement la scène.
Voici quelques sprites simples de la plate-forme de vol:

(Clic droit pour enregistrer l'image)
Comme vous pouvez le voir, nous avons eu deux plates-formes dans un seul fichier. Ceci est une bonne façon d'apprendre comment recadrer sprites avec les outils de l'unité.
Obtenir deux sprites d'une image
- Importer l'image dans votre dossier « sprites »
- Sélectionnez l'image-objet « plates-formes » et aller à l'inspecteur
- Changer « Mode Sprite » à « multiples »
- Cliquez sur « Sprite Editor »

Dans la nouvelle fenêtre ( « Sprite Editor »), vous pouvez dessiner des rectangles autour de chaque plate-forme pour couper la texture en plus petites parties:

Appelez les plates-formes « Plate-forme 1 » et « platform2 ».
Pointe. le bouton supérieur gauche « tranche » vous permet d'effectuer rapidement et automatiquement cette tâche fastidieuse.
L'unité trouvera les objets à l'intérieur de l'image et les couper en tranches automatiquement. Vous pouvez spécifier le point de pivot par défaut ou définir une taille minimale pour une tranche. Pour une image simple, sans artefacts, il est vraiment efficace. Toutefois, si vous utilisez cet outil, soyez prudent et vérifier le résultat pour être sûr d'obtenir ce que vous voulez.
Maintenant, sous le fichier image, vous devriez voir les deux sprites séparément:

les ajouter à la scène
Nous procéderons comme pour le sprite de fond: créer un nouveau Sprite et sélectionnez l'image-objet « de Plate-forme 1 » (onglet ou faites-les glisser un par un à partir du « Projet » à la « scène »). Répétez l'opération pour « platform2 ».
Réglez leur « couche Sprite » à « plates-formes ».
Placez-les dans l'objet middleground.

Et ... ça marche! Je suis toujours étonné de voir à quel point il est maintenant (pour être honnête, il était un peu difficile sans les outils 2D, impliquant quad et carrelage d'image).
Enregistrer ces plates-formes comme prefabs. Il suffit de les dans le dossier simple glisser-déposer « Préfabriqués » du volet « Projet » de la « hiérarchie »:

Ce faisant, vous allez créer un Prefab basé exactement sur l'objet du jeu d'origine. Vous pouvez remarquer que l'objet de jeu que vous avez converti en un Prefab présente une nouvelle ligne de boutons située juste sous son nom:
Note sur les boutons « Prefab ». si vous modifiez l'objet de jeu plus tard, vous pouvez « Appliquer » ses modifications au Prefab ou « Revert » pour les propriétés Prefab (annuler tout changement que vous avez fait sur l'objet du jeu). Le bouton « Sélectionner » déplacer votre sélection directement à l'actif Prefab dans la vue « Projet » (il sera mis en évidence).
Création prefabs avec les objets de la plate-forme qui les rendra plus facile à réutiliser plus tard. Il suffit de glisser le Prefab dans la scène pour ajouter une copie. Essayez d'ajouter une autre plate-forme de cette façon.
Vous êtes maintenant en mesure d'ajouter d'autres plates-formes, changer leurs positions, des échelles et des avions.
Vous pouvez mettre un peu trop en arrière-plan ou au premier plan. Rappelez-vous que les objets « Arrière-plan », « middleground » et « premier plan » ne sont que des dossiers. Donc, vous devez définir le droit « Layer Sprite » (plateformes) et changer le « ordre dans la couche ».
Utilisez -10 pour les plates-formes loin et augmenter ce nombre que vous atteignez l'avant-plan. Un exemple:

Ce n'est pas très chic mais en deux chapitres, nous allons ajouter un défilement parallaxe et il apportera tout à coup la scène à la vie.
Bien. Dans la version précédente de ce tutoriel (pour l'unité 4.2), nous avons eu une explication longue et détaillée sur la façon de régler l'appareil photo et les lumières pour un jeu 2D.
Les bonnes nouvelles sont qu'il est maintenant complètement inutile. Tu n'as rien à faire. Il fonctionne ™.
De côté. si vous cliquez sur l'objet du jeu de la caméra principale, vous pouvez voir qu'il a un drapeau « Projection » sur « orthographiques ». Ceci est le paramètre qui permet à la caméra de rendre un jeu 2D sans prendre la 3D en compte. Gardez à l'esprit que même si vous travaillez avec des objets 2D, l'unité utilise toujours son moteur 3D pour rendre la scène. Le gif ci-dessus montre ce puits.
Dans le chapitre suivant, nous allons apprendre comment ajouter un joueur et ses ennemis.