Вы не вошли.

Уважаемый гость, добро пожаловать на форум: CRYMOD.NET - Портал сообщества CryENGINE. Если вы здесь впервые, то, пожалуйста, прочитайте раздел Помощь. В этом разделе можно подробно ознакомится с функционалом данной системы. Что бы использовать все возможности системы, необходимо зарегистрироваться. Для этого пройдите по ссылке и узнайте подробнее о процессе регистрации. В случае если вы уже зарегистрировались – войдите под своей учётной записью.

AndreyFilantrop

Супер Моддер

  • "AndreyFilantrop" мужчина
  • "AndreyFilantrop" создал эту тему

Сообщений: 1,886

Место жительства: Россия, Москва

Профессия: медицина

1

Суббота, 16 Декабрь 2017, 18:00

Расположение объекта HUD в центре экрана

Просто небольшой урок, если понадобится расположить объект HUD в центре. Нам понадобится сцена Flash любого размера, написанный в этом Flash-файле экшнскрипт и небольшая последовательность во флоуграфе.
1. Берем этот код и вставляем во Flash:

Нажмите сюда, чтобы узнать больше

Код

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
Stage.scaleMode = "noScale";
Stage.align = "TL";

// создадим объект для реагирования на изменение габаритов окна
var resize_obj = {};

// запомнили нормальную ширину
resize_obj.normal_width = 400;

// запомнили нормальную высоту
resize_obj.normal_height = 300;

// самое главное: список объектов, которые будем перемещать
resize_obj.position = [square,   // квадрат
                       circle,   // круг
                       triangle, // треугольник
                       TF0, TF1, 
                       TF2, TF3  // текст. поля
                       ];

// собственно, реакция на изменения габаритов окна
resize_obj.onResize = function()
{
	  _root.TF1.text = "текущие габариты ролика: ";
		_root.TF1.text += Stage.width+"x";
		_root.TF1.text += Stage.height;
	  
    var clip;
    for (var i in this.position) {
        // перебираем все клипы в списке
        clip = this.position[i];
        
        // восстанавливаем пропорции для каждого клипа
        clip._x = Stage.width*clip._xRatio;
        clip._y = Stage.height*clip._yRatio;
				
				// если для клипа определена пропорция по ширине
				if (clip._widthRatio != undefined) {
					clip._width = Stage.width*clip._widthRatio;
				}
				// если для клипа определена пропорция по высоте
				if (clip._heightRatio != undefined) {
					clip._height = Stage.height*clip._heightRatio;
				}
    }
};

// связь между классом Stage и объектом resize_obj
Stage.addListener(resize_obj);

/* запоминаем пропорции координат 
(отношение координат к нормальной ширине/высоте) */
var clip;
for (var i in resize_obj.position) {
    // перебираем все клипы в списке
    clip = resize_obj.position[i];

    // пропорция по горизонтали
    clip._xRatio = clip._x/resize_obj.normal_width;

    // пропорция по вертикали
    clip._yRatio = clip._y/resize_obj.normal_height;
}

/* запоминаем пропорции высоты и ширины 
(отношение габарита к нормальной ширине/высоте) */
circle._widthRatio = circle._width/resize_obj.normal_width;
circle._heightRatio = circle._height/resize_obj.normal_height;
square._widthRatio = square._width/resize_obj.normal_width;
triangle._heightRatio = triangle._width/resize_obj.normal_height;
TF2._widthRatio = TF2._width/resize_obj.normal_width;

resize_obj.onResize();


Взял этот пример отсюда: http://noregret.org/tutor/elastic/
Файл сцены прикладываю

2. Во флоуграфе делаем последовательность (см.картинку во вложении):
AndreyFilantrop приложил следующее изображение:
  • keep HUD centered.jpg
AndreyFilantrop приложил следующий файл:
  • noregret.org.elastic.zip (6.57 kB - Скачано 7 раз - Последняя загрузка: 29 Май 2018, 01:56)
Продаю 3D модели из проекта Аураяма и выполняю 3D модели под заказ. Контакт: andrey-incc@yandex.ru.
АУРАЯМА, AURAYAMA (Crydev.net)–мистический эзотерический шутер от первого лица
AndreyFilantrop портфолио на deviantART

2

Воскресенье, 17 Декабрь 2017, 03:33

А настройки UI элемента?

Кажется, в настройках нужно указать fullscreen:

Код

1
2
3
4
5
<GFx file="LotY_HUD.gfx" layer="0">
     	<Constraints>
        	<Align mode="fullscreen" scale="1" />
     	</Constraints>
 </GFx>
Legacy of the Yods
Indie of the Year Awards


AndreyFilantrop

Супер Моддер

  • "AndreyFilantrop" мужчина
  • "AndreyFilantrop" создал эту тему

Сообщений: 1,886

Место жительства: Россия, Москва

Профессия: медицина

3

Воскресенье, 17 Декабрь 2017, 10:55

А, ну я вообще если честно про UI элемент забыл рассказать))) В моем случае код сам указывает куда алигн - TL (top left) и убирает скейл, а затем растягивает и распределяет каждый конкретный элемент по экрану уже в целевой программе - в СЕ
Продаю 3D модели из проекта Аураяма и выполняю 3D модели под заказ. Контакт: andrey-incc@yandex.ru.
АУРАЯМА, AURAYAMA (Crydev.net)–мистический эзотерический шутер от первого лица
AndreyFilantrop портфолио на deviantART

4

Воскресенье, 17 Декабрь 2017, 19:56

Лучше делать fullscreen, тогда точно можно знать, где будет находиться нужный элемент для данных пропорций экрана. Т.к. чаще всего это широкоформатные экраны, то ставим разрешение ролика 1920x1080. В настройках fullscreen будет растягивать этот ролик на весь экран, при этом все элементы тоже будут растягиваться по высоте или ширине. Остаётся только задать им изначальные пропорции, которые у них были. CryEngine вызывает встроенные функции Scaleform при загрузке, изменении размеров экрана и выгрузке ролика: cry_onSetup, cry_onShow, cry_onResize. Последний имеет 2 параметра - новая ширина и новая высота. Зная исходное разрешение - 1920х1080, и имея новое - мы можем высчитать оригинальные пропорции, и задать их через параметр _yscale новому интерфейсу. Менять расположение не придётся.
Legacy of the Yods
Indie of the Year Awards


AndreyFilantrop

Супер Моддер

  • "AndreyFilantrop" мужчина
  • "AndreyFilantrop" создал эту тему

Сообщений: 1,886

Место жительства: Россия, Москва

Профессия: медицина

5

Воскресенье, 17 Декабрь 2017, 21:52

О, полезная инфа!
Продаю 3D модели из проекта Аураяма и выполняю 3D модели под заказ. Контакт: andrey-incc@yandex.ru.
АУРАЯМА, AURAYAMA (Crydev.net)–мистический эзотерический шутер от первого лица
AndreyFilantrop портфолио на deviantART

6

Воскресенье, 17 Декабрь 2017, 22:30

Ну, и конечно, все элементы по возможности должны находиться в одном родительском контейнере, чтобы его было проще перемещать по центру и менять его вертикальные пропорции. Сам когда-то провёл несколько недель ночами напролёт, разрабатывая идеальные параметры для загрузочных экранов и различных игровых меню, чтобы работало под любые разрешения.
Legacy of the Yods
Indie of the Year Awards


MugGod

Новичок

  • "MugGod" мужчина

Сообщений: 71

Место жительства: Отстойник для быдла, ой, всмысле Россия

Профессия: Наладчик КИПиА

7

Вторник, 9 Январь 2018, 23:32

Очень полезная штука, давно хотел себе такую, спасибо вам :good:
YEAP!