Éditeur de code et lecteur

Pyxen réunit un éditeur de code et votre jeu en cours dans la même fenêtre. Vous écrivez du Pyxen Script dans le volet de code et jouez à votre jeu dans l’Aperçu, à côté.

Éditeur de code

L’éditeur colore le Pyxen Script et vérifie votre code pendant que vous tapez : un problème s’affiche à sa ligne, avec sa raison.

Sur Mac, et sur iPad avec un clavier physique, les raccourcis standards fonctionnent : sélection, copier, coller, annuler, rétablir. Une souris ou un trackpad place le curseur avec précision.

Les paramètres pendant la saisie

Tapez la ( d’un appel, world.get( ou hero.tween(, et une carte au-dessus de la ligne montre ce que l’appel attend : ses paramètres, celui où vous êtes mis en avant, sa ligne dans la référence, et Référence › pour ouvrir sa page. Elle vous suit d’une virgule à l’autre et dans les appels imbriqués, et s’en va quand vous tapez la ) qui ferme l’appel. Vos propres fonctions ont aussi leur carte, avec la première ligne de leur docstring.

La liste sous la ligne propose d’abord ce qui convient : les noms d’entités écrits dans votre projet pour world.get(, les noms d’easing après ease=, les mots-clés que l’appel n’a pas encore reçus, puis les noms habituels. Elle ne connaît que les noms écrits en toutes lettres : une entité nommée pendant le jeu n’y sera pas.

Appuyez sur Échap une fois pour fermer la liste, deux fois pour masquer la carte de cet appel. Cmd+Maj+Espace (Édition › Afficher les paramètres) la fait revenir, et Ctrl+Espace (Édition › Afficher les suggestions) ouvre la liste. Sur l’iPad, touchez la carte pour ouvrir la référence ; avec le clavier à l’écran, la touche . de la rangée de saisie tape , dans un appel.

Les assets pendant la saisie

Entre les guillemets d’un nom qu’attend un appel, Sprite(", Sound(", Music(", Text(…, font=" ou GridMap(tilemap=", la liste propose les assets de ce type de votre projet, puis ceux de chaque pack d’assets, chacun avec son image : la première tuile d’une image (ou l’image entière) avec sa taille et ses animations, une police qui écrit le texte de l’appel, une carte en petit. Après animation=", elle propose les animations de l’image nommée dans le même appel, chacune en train de jouer. Celui où vous êtes s’affiche en plus grand à côté de la liste, avec Ouvrir dans Sprite › (ou le panneau de son type) pour l’ouvrir.

Les sons et les musiques ont un ▶ : cliquez dessus, ou appuyez sur Option+Retour (Édition › Afficher le sélecteur) sur celui qui est sélectionné, pour l’écouter. Rien ne joue quand vous parcourez la liste, et Échap l’arrête. Un son d’une banque de sons s’écrit "banque/son".

La liste ne connaît que les noms écrits en toutes lettres : un nom gardé dans une variable ou construit par morceaux n’a pas de liste, et la carte dit qu’il est calculé pendant le jeu. Avec l’option Réduire les animations du système, les animations restent immobiles.

Dans un argument de tuile, Sprite("tiles", tile=( ou level.set(…, tile=( pour une carte, le sélecteur de tuiles s’ouvre sous la ligne sur l’image que l’appel nomme, avec sa grille. Cliquez sur une tuile, ou faites glisser sur plusieurs : les nombres s’écrivent dans votre code à mesure, en pixels pour un sprite, (x, y, w, h), et en cases pour une carte, (column, row). Taper les nombres vous-même déplace la sélection. Retour la garde (sur iPad, Terminé), Échap remet ce qui était là, et un seul Annuler reprend toute la sélection. Le sélecteur s’ouvre de lui-même sur un tile=( vide ; pour une tuile déjà écrite, cliquez sur sa petite image juste avant les nombres, ou appuyez sur Option+Retour (Édition › Afficher le sélecteur) puis utilisez les flèches (avec Maj pour plus de tuiles). Un nombre calculé à partir d’une constante, comme HERO * 16, s’affiche en pointillés, et le sélecteur le dit avant d’écrire des nombres à sa place. Une image sans grille se choisit à la taille que donnent déjà les nombres, sinon par 16 pixels.

Maintenez Cmd et passez le pointeur sur le nom d’un asset dans votre code, comme "ninja" dans Sprite("ninja", animation="run") : le nom est souligné et une carte montre l’asset, avec son image, sa taille et ses animations. Un Cmd+clic l’ouvre dans son éditeur, sur ce que l’appel nomme : l’éditeur de sprites sur l’animation run, le rectangle d’un tile=(16, 0, 16, 16) sélectionné, ou le son d’une banque, Sound("sfx/coin"), choisi dans sa banque de sons. Un nom que votre projet n’a pas n’ouvre rien.

Et dans l’autre sens : le panneau d’un asset affiche Utilisé dans le code avec le nombre de lignes de vos scripts qui le nomment. Choisissez-en une dans son menu pour aller à cette ligne. Quand la barre du panneau est trop étroite, il est en tête du menu ⋯ du panneau.

Un nom que votre projet n’a pas, comme "ninjaa" dans Sprite("ninjaa"), est souligné en ambre avant même de lancer le jeu. Placez le curseur dessus : une carte indique Rien dans le projet ne s’appelle « ninjaa »., avec Utiliser « ninja » pour écrire le nom le plus proche à sa place, et Nouvelle image… pour le créer (Nouvelle carte de tuiles…, Nouvelle police… ou Nouvelle banque de sons… pour ces types). Une animation que l’image n’a pas est soulignée de la même façon, tout comme tile= et animation= dans le même Sprite, qui ne peuvent pas être utilisés ensemble. Ce sont des avertissements, pas des erreurs : le jeu se lance quand même, car un nom peut venir d’un pack d’assets ajouté plus tard. Seuls les noms écrits en texte sont vérifiés.

Aller au symbole

Appuyez sur Cmd+Maj+O (Édition › Aller au symbole…) pour lister les fonctions et les noms de votre projet, ainsi que les entrées de la référence. Tapez pour filtrer, puis choisissez-en un pour y aller.

Aller à la définition

Cmd+clic sur un nom de fonction ou de variable, ou Cmd+J (Édition › Aller à la définition) avec le curseur dessus, mène à l’endroit où il est défini. Cela fonctionne entre les fichiers de votre projet : si une fonction est définie dans utils.py et appelée dans main.py, Cmd+clic vous y emmène directement. Quand un nom a plusieurs définitions, ou aucune dans votre projet, Aller au symbole s’ouvre sur lui.

Utilisez Option+flèche pour déplacer le curseur d’un mot à la fois au lieu d’un caractère. Avec Maj, cela sélectionne mot par mot : pratique pour sélectionner vite un nom de variable ou un appel de fonction.

Taille du texte et thèmes

Appuyez sur Cmd+= pour agrandir le code et sur Cmd+- pour le réduire, ou choisissez Présentation › Agrandir le texte et Réduire le texte. Dans Réglages › Éditeur, réglez la taille de 10 à 32 points et choisissez l’un des dix thèmes du code : Automatique suit l’apparence avec Pyxen Dark ou Pyxen Light ; les autres sont Pyxen Deep Dark, Pyxen Deep Light, Dracula, GitHub Light, One Dark, One Light, Solarized Dark et Solarized Light.

Dans une fenêtre d’iPad étroite

Quand la fenêtre fait moins de 900 points de large (un iPad 11 pouces en portrait, Split View, Slide Over), Pyxen montre une sous-fenêtre à la fois, les autres en onglets au-dessus, et ses outils sont dans le plateau, au pied de la fenêtre. Touchez sa poignée pour l’agrandir ou le réduire, ou faites-le glisser vers le bas pour le replier. Le plateau de la sous-fenêtre de code contient :

Avec le clavier à l’écran, les touches du code sont dans la rangée au-dessus du clavier ; avec un clavier physique, la sous-fenêtre de code n’a pas de plateau.

Lancer votre jeu

Choisissez Lancer (Cmd+R) pour vérifier, compiler et exécuter votre code. Le jeu démarre dans l’Aperçu. Arrêter (Cmd+.) le termine, et Pause, dans la barre de l’Aperçu, le fige sur une frame.

Si votre code contient une erreur, Pyxen affiche le message à sa ligne. Corrigez-la et lancez à nouveau.

Inspecteur de frames

Lorsque vous mettez en pause un jeu en cours d’exécution, l’inspecteur de frames s’active. C’est le débogueur intégré de Pyxen.

L’inspecteur vous permet de :

Curseur temporel

Pyxen enregistre jusqu’à 300 frames d’historique pendant l’exécution de votre jeu, dix secondes à 30 images par seconde. En pause, vous pouvez naviguer en avant et en arrière dans le temps.

Chaque frame garde ses entités et ce qu’elle a dessiné, dans un budget de mémoire : un jeu chargé, avec beaucoup d’entités ou beaucoup de draw, garde moins de frames, les plus anciennes partant d’abord, et la barre de temps montre jusqu’où elle remonte. Réglez ce budget dans Réglages › Aperçu du jeu › Débogueur › Mémoire de l’historique. Il commence à la valeur recommandée pour votre appareil, écrite dessous, qui garde 300 frames de la plupart des jeux.

Cela vous permet de :

Le curseur temporel transforme le débogage : au lieu de deviner, d’ajouter des instructions print et de relancer, vous mettez en pause, rembobinez et observez.

Flux de travail

Un flux de travail typique dans Pyxen :

  1. Écrire ou modifier du code dans l’éditeur
  2. Le lancer pour tester
  3. Si quelque chose ne va pas, mettre le jeu en pause
  4. Remonter dans le temps pour trouver la frame où le problème est apparu
  5. Inspecter les entités pour voir quel état était inattendu
  6. Arrêter, corriger le code, recommencer