Responsive et résolutions
Comment Easelt maintient votre GUI aligné au pixel près sur MTA:SA, quel que soit l'écran.
Dans Easelt Builder, la mise en page n'est jamais figée en pixels — chaque position et chaque taille est stockée comme une fraction de l'écran comprise entre 0 et 1, exactement comme du code dxDraw bien écrit. C'est cette seule idée qui vous permet de concevoir un GUI une seule fois, à n'importe quelle résolution, et de le voir s'afficher correctement sur l'écran de chaque joueur dans MTA:SA.
Des fractions, pas des pixels
Au lieu de retenir qu'un panneau se trouve à 768px, vous le décrivez comme situé à *40 % de la largeur* de l'écran. Un x de 0.40 signifie 40 % à partir du bord gauche, un y de 0.30 signifie 30 % vers le bas depuis le haut, et une largeur de 0.20 signifie que l'élément occupe un cinquième de la largeur de l'écran. Comme ces fractions sont relatives, elles décrivent la même mise en page quelle que soit la taille réelle de l'écran — et c'est précisément ainsi qu'un scripteur MTA:SA soigneux écrit du code dxDraw à la main.
Les fractions vont de 0 (le bord gauche ou supérieur) à 1 (le bord droit ou inférieur). Une valeur de 0.5 correspond au centre exact sur cet axe.
Comment l'aperçu transforme les fractions en pixels
Le canevas d'aperçu s'affiche dans l'espace des pixels du jeu à la résolution que vous choisissez. Pour placer un élément, Easelt Builder multiplie chaque fraction par les dimensions du jeu — ce calcul est identique à celui que MTA exécute en interne, de sorte que ce que vous voyez correspond à ce que le jeu dessine.
- Position en pixels =
fraction * gameWidth(ougameHeightpour l'axe vertical). - Échelle globale
S = gameHeight / 1080met à l'échelle les épaisseurs de trait et les tailles de texte afin que les lignes et les libellés restent proportionnellement corrects à n'importe quelle résolution. - Comme les deux utilisent les mêmes formules que MTA:SA, la position à l'écran dans l'éditeur est égale à la position en jeu.
L'échelle S est ancrée à une référence de 1080 pixels de hauteur. En 1080p, S = 1 ; en 4K (2160 de hauteur), S = 2, de sorte que les traits et le texte doublent de taille pour correspondre à l'écran plus dense.
Le sélecteur de résolution
Le sélecteur de Résolution se trouve dans la barre supérieure et contrôle la taille du canevas d'aperçu. Changer de résolution modifie les dimensions du canevas tandis que vos fractions restent constantes — ainsi chaque élément conserve la même position relative, et sa position à l'écran continue d'être égale à sa position en jeu.
Changer la résolution ne déplace jamais vos éléments en termes relatifs — seul le canevas est redimensionné. Les fractions sont la source de vérité.
Un exemple concret
Voici le même élément — ancré à x = 0.40, y = 0.30 — résolu en pixels à deux résolutions différentes. Remarquez que les fractions ne changent jamais, seules les valeurs en pixels qui en découlent changent.
| Fraction | En 1920×1080 | En 3840×2160 (4K) |
|---|---|---|
| x = 0.40 | 0.40 × 1920 = 768 px | 0.40 × 3840 = 1536 px |
| y = 0.30 | 0.30 × 1080 = 324 px | 0.30 × 2160 = 648 px |
| échelle S = gameHeight / 1080 | 1080 / 1080 = 1.0 | 2160 / 1080 = 2.0 |
L'élément se situe à 40 % de la largeur et 30 % de la hauteur sur les deux écrans — visuellement identique — tandis que les pixels sous-jacents et l'échelle du texte/des traits augmentent avec la résolution.
Ce qui est exporté
Lorsque vous exportez, les coordonnées ressortent sous la même forme fractionnaire avec laquelle vous avez conçu, multipliée par la taille réelle de l'écran. Ainsi un élément à x = 0.40, y = 0.30 est émis sous la forme :
local sx, sy = guiGetScreenSize()
dxDrawRectangle(0.40 * sx, 0.30 * sy, --[[ width, height, ... ]] )Le script exporté lit la taille réelle de l'écran avec guiGetScreenSize() et conserve vos fractions intactes, de sorte que le code généré se lit comme le dxDraw écrit à la main que vous auriez vous-même rédigé.
S'adapter à l'exécution
Les joueurs peuvent changer leur résolution en jeu pendant que votre ressource est en cours d'exécution. Pour gérer cela, le script exporté écoute également `onClientRestore` et recalcule sx, sy et l'échelle globale chaque fois que l'écran est restauré — ainsi le GUI se remet en page tout seul et reste correct même si la résolution change à la volée.
Comme les fractions sont fixes et que sx, sy et S sont recalculés lors de onClientRestore, vous n'avez jamais à livrer des mises en page distinctes pour des résolutions distinctes.
Ce qu'il faut retenir
Concevez une seule fois à n'importe quelle résolution, correct sur toutes. Stockez la mise en page sous forme de fractions, laissez l'aperçu les résoudre en pixels du jeu avec le calcul propre à MTA, choisissez la résolution que vous voulez pour concevoir, et exportez du code qui se recalcule à l'exécution. Votre GUI a la même apparence pour chaque joueur, quel que soit son écran.