Share
Fabriquer un ensemble de mosaïques visuellement attrayant et varié prend du temps, mais les résultats en valent souvent la peine. Cependant, même après avoir créé l’art, il vous reste à le reconstituer dans votre niveau.!
Vous pouvez placer chaque tuile, une par une, à la main ou vous pouvez automatiser le processus en utilisant masquer, il suffit donc de dessiner la forme du terrain.
Le masquage en mosaïque est une méthode de sélection automatique de l'image-objet appropriée dans un ensemble de mosaïques défini. Cela vous permet de placer une vignette générique générique partout où vous souhaitez qu'un type de terrain particulier apparaisse au lieu de placer manuellement une énorme sélection de différentes vignettes..
Voir cette vidéo pour une démonstration:
(Vous pouvez télécharger les démos et les fichiers sources à partir du dépôt GitHub.)
Lorsqu'il y a plusieurs types de terrain, le nombre de variations différentes peut dépasser 300 tuiles ou plus. Dessiner autant de sprites différents est un processus fastidieux, mais le masquage de pavé garantit la rapidité et l'efficacité du placement de ces pavés..
Avec une implémentation statique du masquage, les cartes sont générées au moment de l'exécution. Avec quelques petites modifications, vous pouvez développer le masquage pour permettre aux tuiles dynamiques de changer pendant le jeu. Dans ce didacticiel, nous aborderons les bases du masquage de bits en mosaïque tout en nous dirigeant vers des implémentations plus complexes qui utilisent des mosaïques en angle et plusieurs types de terrain..
Le masquage de bits en mosaïque consiste à calculer une valeur numérique et à affecter un sprite spécifique en fonction de cette valeur. Chaque tuile regarde ses tuiles voisines pour déterminer quelle image-objet de l'ensemble se assigner.
Chaque image-objet d'un groupe de mosaïques est numérotée et le processus de masquage de bits renvoie un nombre correspondant à la position d'un image-objet dans le groupe de mosaïques. Au moment de l'exécution, la procédure de masquage de bit est exécutée et chaque vignette est mise à jour avec l'image-objet appropriée..
La feuille de sprite ci-dessus est constituée de tuiles de terrain avec toutes les configurations de bordure possibles. Les nombres sur chaque mosaïque représentent la valeur de masquage de bits, que nous apprendrons à calculer dans la section suivante. Pour le moment, il est important de comprendre le rapport entre la valeur de masquage et le jeu de dalles de terrain. Les images-objets sont ordonnées séquentiellement de sorte qu'une valeur de masquage de bits de 0 renvoie le premier sprite, jusqu'à une valeur de 15 qui retourne le 16th lutin.
Le calcul de cette valeur est relativement simple. Dans cet exemple, nous supposons un type de terrain unique sans coins..
Chaque tuile vérifie l'existence de tuiles au nord, à l'ouest, à l'est et au sud, et chaque contrôle renvoie un booléen, où 0 représente un espace vide et 1 signifie la présence d'une autre tuile de terrain.
Ce résultat booléen est ensuite multiplié par la valeur directionnelle binaire et ajouté au total cumulé de la valeur masquante. Il est plus facile à comprendre à l'aide de quelques exemples:
Le carré vert dans la figure ci-dessus représente la tuile de terrain que nous calculons. Nous commençons par rechercher une tuile au nord. Il n'y a pas de tuile au nord, donc la vérification booléenne renvoie une valeur de 0. On multiplie 0 par la valeur directionnelle pour le nord, 20 = 1, nous donnant 1 * 0 = 0.
Pour une tuile de terrain entourée entièrement par un espace vide, chaque vérification booléenne est renvoyée. 0, résultant dans le nombre binaire de 4 bits 0000 ou 1 * 0 + 2 * 0 + 4 * 0 + 8 * 0 = 0. Il y a 16 combinaisons possibles, de 0 à 15, donc le 1st L’image-objet dans l’ensemble de dalles sera utilisée pour représenter ce type de dalle de terrain d’une valeur de 0.
Une tuile de terrain délimitée par une seule tuile au nord renvoie une valeur binaire de 
Accentsconagua
0001, ou 1 * 1 + 2 * 0 + 4 * 0 + 8 * 0 = 1. Les deuxDakota du Nord sprite dans le tileset sera utilisé pour représenter ce type de terrain avec une valeur de 1.
Une tuile de terrain bordée d’une tuile au nord et d’une tuile à l’est renvoie une valeur binaire de 0101, ou 1 * 1 + 2 * 0 + 4 * 1 + 8 * 0 = 5. Le 6ème sprite de la mosaïque sera utilisé pour représenter ce type de terrain avec une valeur de 5.
Une tuile de terrain bordée d'une tuile à l'est et d'une tuile à l'ouest renvoie une valeur binaire de 0110, ou 1 * 0 + 2 * 1 + 4 * 1 + 8 * 0 = 6. Le 7ème sprite de la mosaïque sera utilisé pour représenter ce type de terrain avec une valeur de 6.
Après avoir calculé la valeur de masquage d'un pavé, nous affectons l'image-objet appropriée du jeu de pavés. Cette dernière étape peut être effectuée en temps réel au fur et à mesure du chargement de la carte, ou le résultat peut être sauvegardé et chargé dans l'éditeur de tuiles de votre choix pour une édition ultérieure.
La figure de gauche représente un ensemble de mosaïques mono-terrain 4 bits, tel qu'il apparaîtrait de manière séquentielle sur une feuille de mosaïque. La figure de droite illustre l'apparence des tuiles dans le jeu après leur placement à l'aide de la procédure de masquage. Chaque tuile est marquée avec sa valeur de masquage pour montrer la relation entre l'ordre d'une tuile sur la feuille de tuiles et sa position dans le jeu..
À titre d'exemple, examinons la mosaïque dans le coin supérieur droit de la figure de droite. Cette tuile est bordée de tuiles à l'ouest et à Souh. La vérification booléenne renvoie une valeur binaire de 1010, ou 1 * 0 + 2 * 1 + 4 * 0 + 8 * 1 = 10. Cette valeur correspond à la 11th sprite dans la feuille de tuile.
Le nombre de contrôles booléens directionnels requis dépend de la complexité souhaitée de votre ensemble de mosaïques. En ignorant les pièces de coin, vous pouvez utiliser cette solution 4 bits simplifiée qui ne nécessite que quatre contrôles binaires directionnels..
Mais qu'advient-il lorsque vous souhaitez créer un terrain plus attrayant visuellement? Vous devrez gérer l'existence de mosaïques d'angle, ce qui augmente le nombre d'images-objets de 16 à 48. L'exemple de masquage de bits sur 8 bits suivant nécessite huit vérifications directionnelles booléennes par mosaïque..
Pour cet exemple, nous créons un ensemble de mosaïques descendantes représentant des terrains herbeux près de l'océan. Dans ce cas, notre océan existe sur une couche sous les tuiles de terrain. Cela nous permet d'utiliser une solution mono-terrain tout en maintenant l'illusion d'une collision entre deux types de terrains..
Une fois le jeu lancé et la procédure de masquage terminée, les images-objets ne changeront jamais. Ceci est une implémentation statique et transparente du bitmasking où tout se passe avant que le joueur voie les tuiles..
Nous voulons que le terrain soit plus intéressant visuellement que la solution 4 bits précédente, donc des pièces de coin sont nécessaires. Cette complexité visuelle supplémentaire nécessite une quantité exponentielle de travail supplémentaire pour l'artiste, le programmeur et le jeu lui-même. En développant ce que nous avons appris de la solution 4 bits, nous pouvons rapidement comprendre comment aborder la solution 8 bits..
Voici la feuille de sprite complète pour nos tuiles de terrain côté océan. Avez-vous remarqué quelque chose de particulier concernant le nombre de carreaux? L’exemple 4 bits de plus tôt a abouti à 24 = 16 tuiles, donc cet exemple 8 bits devrait sûrement donner 28 = 256 tuiles, mais il y en a clairement moins que cela.
S'il est vrai que cette procédure de masquage de bits sur 8 bits donne 256 valeurs binaires possibles, toutes les combinaisons ne nécessitent pas une mosaïque entièrement unique. L'exemple suivant aidera à expliquer comment 256 combinaisons peuvent être représentées par seulement 48 tuiles.
Maintenant nous faisons huit Contrôles directionnels booléens. La tuile centrale ci-dessus est bordée de tuiles au nord, au nord-est et à l'est. Cette vérification booléenne renvoie donc une valeur binaire de 00010110 ou 1 * 0 + 2 * 1 + 4 * 1 + 8 * 0 + 16 * 1 + 32 * 0 + 64 * 0 + 128 * 0 = 22.
La tuile à gauche ci-dessus est similaire à la précédente, mais elle est maintenant bordée de tuiles au sud-ouest et au sud-est. Ce contrôle directionnel booléen devrait retourne une valeur binaire de 10110110, ou 1 * 0 + 2 * 1 + 4 * 1 + 8 * 0 + 16 * 1 + 32 * 1 + 64 * 0 + 128 * 1 = 182.
Cette valeur est différente de la mosaïque précédente, mais les deux mosaïques sont visuellement identiques et deviennent donc redondantes..
Pour éliminer les redondances, nous ajoutons une condition supplémentaire à notre contrôle directionnel booléen: lors de la vérification de la présence de limites coin tuiles, nous devons également vérifier les tuiles voisines dans les quatre directions cardinales (directement au nord, est, sud ou ouest).
Par exemple, la tuile au nord-est est voisine des tuiles existantes, alors que les tuiles au sud-ouest et au sud-est ne le sont pas. Cela signifie que les tuiles Sud-Ouest et Sud-Est ne sont pas incluses dans le calcul du masquage.
Avec cette nouvelle condition, cette vérification booléenne renvoie une valeur binaire de 00010110 ou 1 * 0 + 2 * 1 + 4 * 1 + 8 * 0 + 16 * 1 + 32 * 0 + 64 * 0 + 128 * 0 = 22 juste comme avant. Vous pouvez maintenant voir comment les 256 combinaisons peuvent être représentées par seulement 48 tuiles..
Vous remarquerez peut-être un autre problème: les valeurs calculées par la procédure de masquage de bits sur 8 bits ne sont plus en corrélation avec l'ordre séquentiel des mosaïques dans la feuille de l'image-objet. Il n'y a que 48 mosaïques, mais nos valeurs calculées possibles vont de 0 à 255, nous ne pouvons donc plus utiliser la valeur calculée comme référence directe lors de la capture de l'image-objet appropriée..
Nous avons donc besoin d’une structure de données contenant la liste des valeurs calculées et les valeurs correspondantes des carreaux. La façon dont vous voulez l'implémenter dépend de vous, mais rappelez-vous que l'ordre dans lequel vous vérifiez les tuiles environnantes dicte l'ordre dans lequel vos tuiles doivent être placées dans la feuille de sprite..
Pour cet exemple, nous vérifions la présence de mosaïques dans l'ordre suivant: Nord-Ouest, Nord, Nord-Est, Ouest, Est, Sud-Ouest, Sud, Sud-Est..
Vous trouverez ci-dessous l'ensemble complet des valeurs de masquage de bits liées aux positions des mosaïques dans notre feuille de sprite (n'hésitez pas à utiliser ces valeurs dans votre projet pour gagner du temps):
2 = 1, 8 = 2, 10 = 3, 11 = 4, 16 = 5, 18 = 6, 22 = 7, 24 = 8, 26 = 9, 27 = 10, 30 = 11, 31 = 12, 64 = 13, 66 = 14, 72 = 15, 74 = 16, 75 = 17, 80 = 18, 82 = 19, 86 = 20, 88 = 21, 90 = 22, 91 = 23, 94 = 24, 95 = 25 , 104 = 26, 106 = 27, 107 = 28, 120 = 29, 122 = 30, 123 = 31, 126 = 32, 127 = 33, 208 = 34, 210 = 35, 214 = 36, 216 = 37, 218 = 38, 219 = 39, 222 = 40, 223 = 41, 248 = 42, 250 = 43, 251 = 44, 254 = 45, 255 = 46, 0 = 47
Tous nos exemples précédents supposent un type de terrain unique, mais que se passe-t-il si nous introduisons un second terrain dans l'équation? Nous avons besoin d'un 5 bits bitmasking, et nous devons définir nos deux types de terrain. Nous devons également attribuer une valeur à la vignette centrale qui n’est comptée que dans des conditions spécifiques. Rappelez-vous que nous ne comptabilisons plus les "espaces vides" comme dans les exemples précédents; les tuiles doivent maintenant être entourées par une autre tuile de tous les côtés.
La figure ci-dessus montre un exemple avec deux types de terrain et pas de tuiles d'angle. Type 1 toujoursrenvoie une valeur de 0 chaque fois qu'il est détecté lors du contrôle directionnel; la valeur de la dalle centrale est calculée et utilisée seulement s'il s'agit d'un type de terrain 2.
Dans l'exemple ci-dessus, la tuile centrale est entourée du type de terrain 2 au nord, à l'ouest et à l'est, et du type de terrain 1 au sud. La tuile centrale est du type de terrain 1, elle n'est donc pas comptée. Cette vérification booléenne renvoie une valeur binaire de 00111, ou 1 * 1 + 2 * 1 + 4 * 1 + 8 * 0 + 16 * 0 = 7.
Dans cet exemple, notre mosaïque centrale correspond au type de terrain 2 et sera donc prise en compte dans le calcul. La tuile centrale est entourée du type de terrain 2 au nord et à l'ouest. Il est également entouré du type de terrain 1 à l'est et au sud. Cette vérification booléenne renvoie une valeur binaire de 10011, ou 1 * 1 + 2 * 1 + 4 * 0 + 8 * 0 + 16 * 1 = 19 .
Le calcul du masquage peut également être effectué pendant le jeu, ce qui permet de modifier en temps réel le placement et l'apparence des tuiles. Ceci est utile pour les terrains destructibles ainsi que pour les jeux qui permettent de fabriquer et de construire. La procédure de masquage initial est obligatoire pour toutes les mosaïques, mais tout calcul dynamique supplémentaire ne doit être effectué qu'en cas d'absolue nécessité. Par exemple, une tuile de terrain détruite déclencherait le calcul du masquage uniquement pour les tuiles environnantes..
Le bitmasking de tuiles est l'exemple parfait de la construction d'un système fonctionnel pour vous aider dans le développement de jeux. Ce n'est pas quelque chose qui affecte directement l'expérience du joueur; Au lieu de cela, cette méthode d'automatisation d'une partie de la conception de niveau qui prend du temps représente un avantage précieux pour le développeur. Pour le dire simplement: le masquage de tuiles est un moyen rapide de faire en sorte que le jeu fasse le sale boulot, vous permettant de vous concentrer sur des tâches plus importantes..
