Responsividade e resoluções
Como o Easelt mantém a sua GUI perfeitamente alinhada aos pixels do MTA:SA em qualquer ecrã.
No Easelt Builder, o layout nunca fica preso a pixels — cada posição e tamanho é armazenado como uma fração do ecrã entre 0 e 1, exatamente como um código dxDraw bem escrito. É essa ideia única que lhe permite desenhar uma GUI uma só vez, em qualquer resolução, e tê-la corretamente posicionada no ecrã de cada jogador no MTA:SA.
Frações, não pixels
Em vez de se lembrar que um painel está a 768px, descreve-o como estando a *40% ao longo* do ecrã. Um x de 0.40 significa 40% a partir da margem esquerda, um y de 0.30 significa 30% para baixo a partir do topo, e uma largura de 0.20 significa que o elemento ocupa um quinto da largura do ecrã. Como estas frações são relativas, descrevem o mesmo layout independentemente do tamanho real do ecrã — que é precisamente a forma como um scripter cuidadoso de MTA:SA escreve código dxDraw à mão.
As frações vão de 0 (a margem esquerda ou superior) até 1 (a margem direita ou inferior). Um valor de 0.5 fica exatamente no centro desse eixo.
Como a pré-visualização transforma frações em pixels
O canvas de pré-visualização renderiza em espaço de pixels do jogo na resolução que escolher. Para posicionar um elemento, o Easelt Builder multiplica cada fração pelas dimensões do jogo — isto é idêntico à matemática que o MTA executa internamente, portanto o que vê é o que o jogo desenha.
- Posição em pixels =
fraction * gameWidth(ougameHeightpara o eixo vertical). - Escala global
S = gameHeight / 1080escala as espessuras de traço e os tamanhos de texto para que linhas e rótulos permaneçam proporcionalmente corretos em qualquer resolução. - Como ambas usam as mesmas fórmulas do MTA:SA, a posição no ecrã dentro do editor é igual à posição dentro do jogo.
A escala S está ancorada a uma referência de 1080 pixels de altura. A 1080p, S = 1; a 4K (2160 de altura), S = 2, portanto traços e texto duplicam de tamanho para acompanhar o ecrã mais denso.
O seletor de Resolução
O seletor de Resolução encontra-se na barra superior e controla o tamanho do canvas de pré-visualização. Mudar de resolução altera as dimensões do canvas enquanto as suas frações permanecem constantes — por isso cada elemento mantém a mesma posição relativa, e a sua posição no ecrã continua a ser igual à sua posição dentro do jogo.
Mudar a resolução nunca move os seus elementos em termos relativos — apenas o canvas é redimensionado. As frações são a fonte de verdade.
Um exemplo prático
Aqui está o mesmo elemento — ancorado em x = 0.40, y = 0.30 — resolvido em pixels em duas resoluções diferentes. Repare como as frações nunca mudam, apenas os valores em pixels que delas resultam.
| Fração | A 1920×1080 | A 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 |
| escala S = gameHeight / 1080 | 1080 / 1080 = 1.0 | 2160 / 1080 = 2.0 |
O elemento fica a 40% ao longo e a 30% para baixo em ambos os ecrãs — visualmente idêntico — enquanto os pixels subjacentes e a escala de texto/traço crescem com a resolução.
O que é exportado
Quando exporta, as coordenadas saem na mesma forma fracionária com que desenhou, multiplicadas pelo tamanho real do ecrã. Assim, um elemento em x = 0.40, y = 0.30 é emitido como:
local sx, sy = guiGetScreenSize()
dxDrawRectangle(0.40 * sx, 0.30 * sy, --[[ width, height, ... ]] )O script exportado lê o tamanho real do ecrã com guiGetScreenSize() e mantém as suas frações intactas, de modo que o código gerado se lê como o dxDraw escrito à mão que você próprio escreveria.
Adaptação em tempo de execução
Os jogadores podem alterar a sua resolução dentro do jogo enquanto o seu recurso está a correr. Para lidar com isso, o script exportado também escuta o evento `onClientRestore` e recalcula sx, sy e a escala global sempre que o ecrã é restaurado — para que a GUI se reorganize e permaneça correta mesmo que a resolução mude em tempo real.
Como as frações são fixas e sx, sy e S são recalculados em onClientRestore, nunca tem de fornecer layouts separados para resoluções separadas.
A conclusão
Desenhe uma vez em qualquer resolução, correto em todas. Armazene o layout como frações, deixe a pré-visualização resolvê-las em pixels do jogo com a própria matemática do MTA, escolha a resolução que quiser para desenhar, e exporte código que se recalcula em tempo de execução. A sua GUI fica igual para todos os jogadores, independentemente do seu ecrã.