Какую систему координат использовать для обработки 2D-интерфейса?

Исходя из вопроса о соотношении сторон , мне интересно услышать, что другие люди используют при работе над 2D-системами пользовательского интерфейса (скорее всего, их собственными доморощенными решениями). В частности, как вы справляетесь с системами координат. На мой взгляд, есть три варианта:

1. Жестко запрограммированные координаты (например: 0 -> 720, 0 -> 576)
2. Нормализованные координаты (0.0 -> 1.0, 0.0 -> 1.0), отображенные в реальные координаты перед рендерингом
3. Виртуальные координаты (например: 0 -> 1600, 0 -> 1000), отображенные в реальные координаты перед рендерингом

Жесткое кодирование, очевидно, полезно только в том случае, если вы работаете на стационарной платформе и заранее знаете, каковы ваши координаты пространства экрана, или если вы готовы создавать макеты экрана для каждого возможного набора размеров экрана.

Нормализованные координаты хороши, но страдают от неоднозначности, когда соотношение сторон экрана не фиксировано (например, 0,75 соответствует другой физической координате при работе в широкоэкранном режиме, чем в 4: 3). Кроме того, для авторов действительно нелогично объявлять элемент пользовательского интерфейса равным (0,2 x 0,2) только для того, чтобы обнаружить, что он фактически не квадратный при рендеринге.

Виртуальные координаты недвусмысленны, но страдают от тех же проблем, что и нормализованные координаты на этапе переназначения: крошечное десятичное расхождение может приводить к ошибкам «один на один», что означает, что элементы пользовательского интерфейса, которые должны располагаться на плитке, теперь имеют шов между ними.

Точно так же, когда у вас есть экран с фиксированным разрешением, как нормализованные, так и виртуальные координаты означают, что очень трудно гарантировать отображение 1: 1 между тщательно созданными пикселями вашего художника в изображении пользовательского интерфейса и пикселями на экране, что означает, что вы рискуете неприятные артефакты масштабирования (при условии, что вы визуализируете как текстурированные квадраты на экране).

Мы выбрали виртуальный координатный подход, особенно во избежание двусмысленности в отношении соотношений сторон. Поэтому при рендеринге на экран 16:10 пространство пользовательского интерфейса составляет (0,0) -> (1600,1000), но при рендеринге в формате 4: 3 используемое пространство пользовательского интерфейса на самом деле (133,0) -> (1467). , 0).

Есть ли лучшие решения, о которых я просто не знаю? Есть ли хорошие стратегии для минимизации проблем, которые есть у этих трех подходов?

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

То, что я обычно делаю для 2D-макетов, это в основном ваше «виртуальное» пространство координат, но я выбираю пространство, которое отображает 1: 1 с моим предпочтительным разрешением цели (например, 1280x720). Это не исправлено, но интуитивно понятно, и я знаю, что в 90% случаев это будет выглядеть правильно. Очевидно, что важно не быть самодовольным, а часто проверять разные разрешения.

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

Возможно также подумайте о том, чтобы сделать вещи более относительными. Таким образом, вместо того, чтобы все быть «позиционировать объект 1 в абсолютном X, Y», вы можете указать «положение внизу слева от объекта 2 с некоторым смещением от правого нижнего края объекта 1». Тогда легче изменить масштаб и / или изменить положение вещей, не теряя важных отношений.

Система координат CEGUI кажется действительно продуманной. Это единая система координат смесей абсолютного позиционирования с относительным позиционированием. Вы можете указать места как:

• в середине экрана
  UDim(0.5,0)
• пять пикселей слева от правого края
  UDim(1.0,-5)
• два виджета посередине, но разделены на 10 пикселей
  HA_RIGHT,UDim(0.5,-5) HA_LEFT,UDim(0.5,5)

Если вы сомневаетесь, почему бы не использовать блочную модель CSS или ее упрощение?

Вы можете указать позиции в процентах или пикселях. Вы можете расположить контейнеры с процентами, но, например, расположить элементы в них по пикселям.

Мне нравится использовать виртуальные координаты, но основанные на общем разрешении цели (желательно на одном из самых высоких разрешений, на которых вы ожидаете, что игра будет запущена).

В наши дни хорошим выбором может стать 1920x1080.

Все изображения и макеты экрана могут быть созданы с таким разрешением, и это позволяет легко измерять позиции / расстояния в пикселях.

Если вы работаете с другим соотношением сторон к виртуальным координатам, вы можете выбрать, как разместить его на экране (почтовый ящик, обрезка сторон или немного и того, и другого)

При кодировании я считаю, что «думать в пикселях» гораздо проще, чем думать в нормализованных координатах! - Я хочу, чтобы текст был «50 (виртуальных) пикселей в высоту», а не «0,0463 единиц в высоту»

Это полностью зависит от того, какой у вас тип графического интерфейса, но часто в играх есть привязки по краям экрана и в углах, и тогда в центре экрана может быть поле для модального диалога или чего-то еще.

Если это так, то могу ли я предложить схему, в которой вы указываете привязку и смещение (x, y)? Это будет похоже на BorderLayout в Java (но, возможно, с четырьмя углами, четырьмя серединами краев и одним центром экрана). Так, например, вы можете указать смещение (0,0) от верхнего левого угла; тогда элемент будет закреплен точно в углу экрана. И тогда независимо от того, какое разрешение, соотношение сторон и т. Д., У вас будет индикатор состояния в углу экрана. Но затем, если вы прикрепите элемент к верхнему правому углу, элемент будет естественным образом привязан относительно его верхней правой точки (вместо верхнего левого угла), поэтому он снова будет автоматически привязан к углу экрана независимо от разрешения.

Я определенно рекомендую против нормализованных 0,0-1,0 координат; они могут варьироваться в зависимости от точности с плавающей точкой. GUI должны быть отображены в пикселях, если у вас нет 3D GUI.

Многое зависит от типа игры и ситуации. Для быстрых и грязных прототипов я предпочитаю планировать пользовательский интерфейс на миллиметровой бумаге, записывать список числовых координат для фиксированного размера окна и жестко кодировать все - для меня это проще и быстрее. Но для «реального» проекта, в котором вы хотели бы иметь изменяемые размеры окон или альтернативные разрешения экрана, это, очевидно, не было бы идеальным, и было бы лучше какое-то решение, позволяющее масштабировать в обоих направлениях.