000112. Делаем графическое меню
Делаем графическое меню|Всем привет! Этот урок я делаю по заказу многих пользователей нашего сайта. Сегодня будем учиться рисовать меню.|wmysterio|wmysterio||||Как вариант, можно было сделать с помощью панелей, но наша задача сегодня состоит в следующем: написать скрипт драки, где игроку нужно выбрать себе бойца. Иконки участников я возьму со стандартного TXD-архива - обычные карты, что были при игре в покер.
Прежде всего определим размер текстур. Они составили 128 пикселей.
Как уже звучало в уроке по рисованию ранее, размер экрана в GTA SA - 640х448. Сделаем арифметические расчёты, что бы определить к-во картинок, которые поместятся на экран: 640/128 = 5. Такое количество бойцов меня не устроило, так как желательным результатом для меня - 7 персонажей. Следовательно нам нужно рисовать текстуры с меньшем размером. Я подсчитал, что размер должен быть - 64, мы получим 10 бойцов в экране. Так как этого многовато, то с 640 - ( 7*64 ) = 192 пикселей можно равномерно отдалить картинки друг от друга. С размерами определились.
Следующим шагом будет выбор места и условий запуска меню. Я выбрал автошколу в Сан Фиерро. Вот блок условий в нашем скрипте:
1
{$CLEO}
2
0000:
3
4
var
5
$PLAYER_ACTOR: actor
6
$PLAYER_CHAR: player
7
end
8
9
:BOXEN
10
thread 'BOXEN'
11
wait 0
12
13
while true
14
03A1: show_sphere_at -2039.1498 -106.7122 34.191 radius 1.5
15
if AND
16
0AB0: key_pressed 71 // G
17
00EC: actor $PLAYER_ACTOR 0 near_point -2039.1498 -106.7122 radius 2.0 2.0
18
then
19
if AND
20
8A0C: not player $PLAYER_CHAR on_jetpack
21
$ONMISSION == 0
22
then
23
gosub @BOXEN_INIT
24
wait 1000
25
end
26
end
27
wait 0
28
end
29
30
:BOXEN_INIT
31
wait 0
Copied!
Следующий шаг - загрузка текстур, объявление переменных:
1
0390: load_txd_dictionary 'LD_POKE'
2
038F: load_texture "cd13s" as 1
3
038F: load_texture "cd13h" as 2
4
038F: load_texture "cd13d" as 3
5
038F: load_texture "cd13c" as 4
6
038F: load_texture "cd11s" as 5
7
038F: load_texture "cd11h" as 6
8
038F: load_texture "cd11d" as 7 // 128 > 64
9
10
0826: enable_hud 0
11
0581: enable_radar 0
12
$PLAYER_CHAR.CanMove = false
13
$PLAYER_ACTOR.SetImmunities(1, 1, 1, 1, 1)
14
wait 1000
15
[email protected] = 0 // switch
16
[email protected] = 64 // texture 1
17
[email protected] = 64 // texture 2
18
[email protected] = 64 // texture 3
19
[email protected] = 64 // texture 4
20
[email protected] = 64 // texture 5
21
[email protected] = 64 // texture 6
22
[email protected] = 64 // texture 7
23
[email protected] = #WMYDRUG // model enemy
24
[email protected] = 0.0
25
[email protected] = 'BJ_PUSH'
Copied!
Объясню, какая переменная для чего нужна:
[email protected] = 0 - переменная, которая будет условием цикла. Я использую переменную а не true, так как при срабатывании разных условий, мы можем сделать ещё некоторые проверки после цикла и изменить ветвь алгоритма.
[email protected] = 0 // switch - Эта переменная будет использовать в таблице переходов. Собственно она будет делать наше меню, так как в зависимости от неё будет изменятся прозрачность нашей текстуры. Так как наше меню будет состоять из 7 участников, то к-во пунктов меню тоже будет равна цифре 7, а значения, которые будет принимать - 0, 1, 2, 3, 4, 5 и 6.
[email protected] ... [email protected] - указываем значение прозрачности для загруженных нами текстур на значение 64. Таким образом прозрачность пункта меню, который не выбран будет равен этому значению.
[email protected] = #WMYDRUG // model enemy - переменная будет менять модель актёра, который будет нашим противником
[email protected] = 'BJ_PUSH' - строковая переменная носит имя нашего противника и так же меняется в зависимости от выбранного пункта меню.
[email protected] = 0.0 - переменная отвечает за переключатель меню. Что бы пользователь без проблем мог двигаться по меню, нужно удержать отклик на величину 0.25. Когда переменная будет иметь значения 0.0 1.0 2.0 3.0 4.0 5.0 6.0, то переменная [email protected] будет иметь такое же значение, что и [email protected], только в целой форме.
Создадим цикл, где укажем условия выхода и условия изменения [email protected]:
1
while [email protected] == 0
2
if OR // EXIT
3
0AB0: key_pressed 71 // G
4
$PLAYER_ACTOR.Dead
5
0741: actor $PLAYER_ACTOR busted
6
09FA: is_menu_closed
7
then
8
[email protected] = -1
9
end
10
11
if
12
[email protected] == 0.0
13
then
14
15
end
16
if
17
[email protected] == 1.0
18
then
19
20
end
21
if
22
[email protected] == 2.0
23
then
24
25
end
26
if
27
[email protected] == 3.0
28
then
29
30
end
31
if
32
[email protected] == 4.0
33
then
34
35
end
36
if
37
[email protected] == 5.0
38
then
39
40
end
41
if
42
[email protected] == 6.0
43
then
44
45
end
46
47
48
// // // Цикл продолжается // // //
49
50
wait 0
51
end
Copied!
Нужно так же учесть, что если игрок выведет переменные "[email protected]" и "[email protected]" за нужный диапазон, то текстуры пропадут с экран, так как их нужно рисовать в цикле при точных условиях. Нужно написать условия, которые не дают выйти значениям за нужные рамки. В моём случае это такой код:
1
if
2
[email protected] > 6.75
3
then
4
[email protected] = 0.0
5
end
6
7
if
8
[email protected] < -0.75
9
then
10
[email protected] = 6.0
11
end
Copied!
Осталось нам написать управление переменной "[email protected]". Я сделал, что при нажатии левой или правой стрелки значение уменьшалось или увеличивалось соответственно:
1
{ NAVIGATE }
2
if
3
0AB0: key_pressed 37 // LEFT
4
then
5
[email protected] -= 0.25
6
end
7
if
8
0AB0: key_pressed 39 // RIGNT
9
then
10
[email protected] += 0.25
11
end
Copied!
Основная работа закончилась. Теперь нам нужно само рисование. Для этого используем таблицу переходов, что бы назначить модель персонажа и прозрачность всех пунктов меню:
1
{ SWITCH BOXER }
2
0871: init_jump_table [email protected] total_jumps 7 default_jump 0 @BOXING_SELECT jumps 0 @BOXING_S_0 1 @BOXING_S_1 2 @BOXING_S_2 3 @BOXING_S_3 4 @BOXING_S_4 5 @BOXING_S_5 6 @BOXING_S_6
3
4
:BOXING_S_0
5
[email protected] = #WMYDRUG // model enemy
6
[email protected] = 255 // texture 1
7
[email protected] = 64 // texture 2
8
[email protected] = 64 // texture 3
9
[email protected] = 64 // texture 4
10
[email protected] = 64 // texture 5
11
[email protected] = 64 // texture 6
12
[email protected] = 64 // texture 7
13
[email protected] = 'BOX_001'
14
jump @BOXING_SELECT
15
16
:BOXING_S_1
17
[email protected] = #BMYDRUG // model enemy
18
[email protected] = 64 // texture 1
19
[email protected] = 255 // texture 2
20
[email protected] = 64 // texture 3
21
[email protected] = 64 // texture 4
22
[email protected] = 64 // texture 5
23
[email protected] = 64 // texture 6
24
[email protected] = 64 // texture 7
25
[email protected] = 'BOX_002'
26
jump @BOXING_SELECT
27
28
:BOXING_S_2
29
[email protected] = #HMYDRUG // model enemy
30
[email protected] = 64 // texture 1
31
[email protected] = 64 // texture 2
32
[email protected] = 255 // texture 3
33
[email protected] = 64 // texture 4
34
[email protected] = 64 // texture 5
35
[email protected] = 64 // texture 6
36
[email protected] = 64 // texture 7
37
[email protected] = 'BOX_003'
38
jump @BOXING_SELECT
39
40
:BOXING_S_3
41
[email protected] = #WMYCLOT // model enemy
42
[email protected] = 64 // texture 1
43
[email protected] = 64 // texture 2
44
[email protected] = 64 // texture 3
45
[email protected] = 255 // texture 4
46
[email protected] = 64 // texture 5
47
[email protected] = 64 // texture 6
48
[email protected] = 64 // texture 7
49
[email protected] = 'BOX_004'
50
jump @BOXING_SELECT
51
52
:BOXING_S_4
53
[email protected] = #WMYST // model enemy
54
[email protected] = 64 // texture 1
55
[email protected] = 64 // texture 2
56
[email protected] = 64 // texture 3
57
[email protected] = 64 // texture 4
58
[email protected] = 255 // texture 5
59
[email protected] = 64 // texture 6
60
[email protected] = 64 // texture 7
61
[email protected] = 'BOX_005'
62
jump @BOXING_SELECT
63
64
:BOXING_S_5
65
[email protected] = #HFORI // model enemy
66
[email protected] = 64 // texture 1
67
[email protected] = 64 // texture 2
68
[email protected] = 64 // texture 3
69
[email protected] = 64 // texture 4
70
[email protected] = 64 // texture 5
71
[email protected] = 255 // texture 6
72
[email protected] = 64 // texture 7
73
[email protected] = 'BOX_006'
74
jump @BOXING_SELECT
75
76
:BOXING_S_6
77
[email protected] = #HMOST // model enemy
78
[email protected] = 64 // texture 1
79
[email protected] = 64 // texture 2
80
[email protected] = 64 // texture 3
81
[email protected] = 64 // texture 4
82
[email protected] = 64 // texture 5
83
[email protected] = 64 // texture 6
84
[email protected] = 255 // texture 7
85
[email protected] = 'BOX_007'
86
jump @BOXING_SELECT
Copied!
Модели персонажей я подбирал от фонаря: что помнил то и писал. Вы же можете подставить свои. Рисуем наше меню:
1
:BOXING_SELECT
2
03F0: enable_text_draw 1
3
038E: draw_box_position 311.8006 188.2005 size 542.60 102.60 RGBA 0 0 0 128
4
038E: draw_box_position 312.0 223.2 size 529.196 22.8 RGBA 0 0 0 128
5
0340: set_text_draw_RGBA 180 180 180 255
6
081C: draw_text_outline 1 RGBA 255 0 0 255 // Red Outkine
7
0349: set_text_draw_font 2
8
0343: set_text_draw_linewidth 640.0
9
033E: set_draw_text_position 79.0 218.0 GXT [email protected] // Push
10
03E3: set_texture_to_be_drawn_antialiased 1
11
038D: draw_texture 1 position 79.1995 174.8 size 64.0 64.0 RGBA 255 255 255 [email protected]
12
03E3: set_texture_to_be_drawn_antialiased 1
13
038D: draw_texture 2 position 158.2 174.8 size 64.0 64.0 RGBA 255 255 255 [email protected]
14
03E3: set_texture_to_be_drawn_antialiased 1
15
038D: draw_texture 3 position 235.8 174.8 size 64.0 64.0001 RGBA 255 255 255 [email protected]
16
03E3: set_texture_to_be_drawn_antialiased 1
17
038D: draw_texture 4 position 312.799 174.6 size 64.0 64.0 RGBA 255 255 255 [email protected]
18
03E3: set_texture_to_be_drawn_antialiased 1
19
038D: draw_texture 5 position 389.398 174.6 size 64.0 64.0 RGBA 255 255 255 [email protected]
20
03E3: set_texture_to_be_drawn_antialiased 1
21
038D: draw_texture 6 position 466.997 174.6 size 64.0 64.0 RGBA 255 255 255 [email protected]
22
03E3: set_texture_to_be_drawn_antialiased 1
23
038D: draw_texture 7 position 544.596 174.4 size 64.0 64.0 RGBA 255 255 255 [email protected]
Copied!
Таким образом я получил следующее меню:
При нажатии ВЛЕВО/ВПРАВО нужная карта будет подсвечиваться а ниже будет отображаться его имя. На этом рисование окончено. Теперь уже техническая часть. Напишем условие, которые выходит из меню:
Copied!
Как видите, ничего сложного нет, но следует помнить, что вариантов таких графических штучек может быть много и для каждого свой алгоритм. Я привёл самый распространённый вариант - горизонтальное меню. Допишем уже концовку для скрипта:
1
0391: release_txd_dictionary
2
3
if
4
[email protected] == 1
5
then
6
fade 0 1000
7
wait 1000
8
jump @BOXEN_RUN
9
end
10
11
0826: enable_hud 1
12
0581: enable_radar 1
13
$PLAYER_CHAR.CanMove = true
14
$PLAYER_ACTOR.SetImmunities(0, 0, 0, 0, 0)
15
return
16
17
:BOXEN_RUN
18
wait 0
19
0826: enable_hud 1
20
0581: enable_radar 1
21
$PLAYER_ACTOR.PutAt(-2066.6797, -107.5093, 35.3276)
22
$PLAYER_ACTOR.Angle = 90.0
23
camera.Restore_WithJumpCut
24
camera.SetBehindPlayer
25
model.Load([email protected])
26
038B: load_requested_models
27
28
repeat
29
wait 0
30
until model.Available([email protected])
31
32
[email protected] = actor.Create(23, [email protected], -2078.1331, -107.5472, 34.3203)
33
actor.Angle([email protected]) = 270.0
34
actor.Health([email protected]) = 1000
35
model.Destroy([email protected])
36
wait 1000
37
fade 1 1000
38
wait 1000
39
$PLAYER_CHAR.CanMove = true
40
$PLAYER_ACTOR.SetImmunities(0, 0, 0, 0, 0)
41
05E2: AS_actor [email protected] kill_actor $PLAYER_ACTOR
42
43
44
while [email protected] == 0
45
if
46
$PLAYER_ACTOR.Dead
47
then
48
[email protected] = -1
49
end
50
if
51
actor.Dead([email protected])
52
then
53
54
end
55
wait 0
56
end
57
58
if
59
[email protected] == 1
60
then
61
01E3: show_text_1number_styled GXT 'WIN_BOX' number 20000 time 5000 style 1 // You Win
62
$PLAYER_CHAR.Money += 20000
63
end
64
65
return
Copied!
Содержимое FXT-архива:
BOX_001 ѓ›o Њyx®ac¦њk
BOX_002 …Ї KЄ¦ћњ®
BOX_003 CЄЇ Poќc
BOX_004 Poќ Њe®cњћ
BOX_005 Pњ¤apљ Kyc¦
BOX_006 ѓЇњ¦pњќ –eљўeћeў
BOX_007 ЃpЄ®k ѓpe—њ®
WIN_BOX ЏЁ Јo—eљњћ!
Полный вариант вы можете скачать здесь. Там вы найдете и исходный код даного скрипта. Ничего сложного нет. Нужно только знать, что должна быть переменная-регулятор ( [email protected] ) и переменная-switch ( [email protected] ). Позиции уже могут быть абсолютно разные. Хочу добавить, что на разработку скрипта ушло 2.5 часа ( было даже видео, где я кодю ), так что быстро такие скрипты не разрабатываются. На этом урок окончен! С вами, как всегда, был wmysterio. Удачи в рисовании!
|1597|1|0|47268844`png`600`360`400`240``\|24905478`png`640`384`400`240``\|46110281`png`399`226
1
`\||delaem_graficheskoe_menju|1504464042
Copied!
Copy link
Edit on GitHub