общая потеря качества - Phaser

Я разрабатываю интерактив с Phaser.js (v2), но столкнулся с общей потерей качества (изображения, спрайты, тексты и т. д.). Особенно рендеринг текста:

const strtxt = this.game.add.text(0, 0, str, {
  font: 'Open Sans',
  fontSize: 17,
  weight: 400,
}, text);
strtxt.align = 'center';
strtxt.lineSpacing = -4;
strtxt.anchor.set(0.5, 0);
strtxt.wordWrap = true;
strtxt.wordWrapWidth = 300;
const y = text.getAt(1).height + ((index + 1) * 60);
strtxt.position.set(250, y);

введите здесь описание изображения

Очень хотелось бы улучшить качество, хотя бы текста. Что я могу сделать?


javascript html phaser-framework software-quality
person Mauro Aguilar    schedule 28.06.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Phaser обычно выполняет рендеринг на фиксированный холст, а затем растягивает этот холст, чтобы заполнить экран. Например, если вы установите размер холста 480 x 640 пикселей, но воспроизведете его на HD-мониторе, то он, так сказать, «взорвется». Это изображение с более низким разрешением, отображаемое на дисплее с более высоким разрешением, поэтому оно выглядит слегка размытым.

Преимущество в том, что игра всегда будет отображать один и тот же размер. Вам, как программисту, не нужно беспокоиться о множестве различных разрешений и размеров дисплея, особенно с планшетами или мобильными телефонами. Но недостатком является потеря разрешения и размытость.

Итак, я думаю, вам нужно соотношение пикселей к пикселям, не уверен, поддерживает ли Phaser это, но я думаю, что вы можете установить scaleMode на SHOW_ALL или, возможно, USER_SCALE, а затем добавить пользовательские функции для обработки событий изменения размера. Также см. этот вопрос или эта тема форума

person BdR    schedule 28.06.2018