Урок [Гайд] Кастомизация Загрузочного экрана(Лоадскрина)

Реклама:
28 Июн 2017
94
12
8
Проект
HOOK WARS REBORN
Реакции
16 0 1
#1
Здесь я опишу несколько вариантов различной кастомизации загрузочного экрана. Это вроде мой второй гуид, так что могу где-то допустить ошибку, уж сорри, но тапком кинуть можно.

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

У кого ещё нет обычного лоадскрина - вам сюда: Тык

Собсна, всякие штуки писать я буду в таком виде:

Что эта штука делает
Это в custom_loading_screen.xml:
Код:
Код, который надо кинуть в custom_loading_screen.xml будет тута
А это в custom_loading_screen.css:
Код:
Код, который надо кинуть в custom_loading_screen.css будет здеся

Ну и конечно в таких штуках всегда будут параметры, которые нужно выбирать и менять вам, в основном это местоположение этих самых штук в custom_loading_screen.css

Ну вроде всё, что надо было объяснил, теперь можно и начинать.

Кнопка с ссылкой (Например на группу в ВК вашей кастомки)
Это в custom_loading_screen.xml:
Код:
	<Panel id="VKmain">
	  <Label text="ВАШЕ ОПИСАНИЕ ССЫЛКИ"/>
  	  <Button id="VK" onactivate="DOTADisplayURL('ВАША ССЫЛКА');">
	     <Image class="avatar" src="file://{images}/custom_game/loading_screen/ВАША КАРТИНКА ДЛЯ КНОПКИ.png" />
      </Button>		
	</Panel>
А это в custom_loading_screen.css:
Код:
#VKmain /*Тут выбираете позицию, просто меняйте значения и сами поймёте, как тут и что работает(Ну я так делал). */
{
	flow-children: down;
	horizontal-align: left;
	vertical-align: top;
	position: 438px 0px 0px; 
}

#VKmain Label /*Тут параметры текста "ВАШЕ ОПИСАНИЕ ССЫЛКИ"*/
{
	color: white;
	font-size: 20px;
	horizontal-align: center;
}

#VK /*Тут параметры самой кнопки*/
{
	width: 60px;
	height: 60px;
	background-color: black;
	vertical-align: middle;
	horizontal-align: center;	
}

.avatar /*Тут параметры картинки, можете не менять,*/
{
	width: 60px;
	height: 60px;
	background-color: black;
	vertical-align: middle;
	horizontal-align: center;
}

Если разобрались с кнопкой и сделали всё, как вам и надо было, то дальше без проблем должны справиться. Если же не получается что-то, то отпишите в этой же теме, постараюсь помочь.

Дота профиль автора
Это в custom_loading_screen.xml:
Код:
	<Panel id="Developers">
	  <Label text="ВАШ НИК"/>
		<Panel id="Creator" class="column">
			<DOTAAvatarImage class="avatar" steamid="ВАШ STEAM ID" />
		</Panel>
	</Panel>
А это в custom_loading_screen.css:
Код:
#Developers
{
	flow-children: down;
	horizontal-align: left;
	vertical-align: top;
	position: 351px 0px 0px;
	padding-bottom: 41px;
	padding-right: 3px;
}
#Developers Label
{
	color: white;
	font-size: 20px;
	horizontal-align: center;
}

.column
{
	width: 100%;
	flow-children: down;
}

.avatar
{
	width: 60px;
	height: 60px;
	background-color: black;
	vertical-align: middle;
	horizontal-align: center;
}

Способность и её описание при нажатии
Это в custom_loading_screen.xml:
Код:
	<Panel id="AbilityInfomain1">
	    <Button id="AbilityButton" onactivate="DOTAShowAbilityTooltip(ИМЯ_АБИЛКИ)">
	      <Image src="file://{images}/custom_game/loading_screen/ИКОНКА АБИЛКИ(ДА МОЖНО ПРОЩЕ УКАЗАТЬ, НО ДРУГОЙ СПОСОБ НЕ ВСЕГДА РАБОТАЕТ С КАСТОМНЫМИ ИКОНКАМИ).png" />
      </Button> 	 
  </Panel>
А это в custom_loading_screen.css:
Код:
#AbilityInfomain1
{ 
  horizontal-align: left;
  vertical-align: top;
  margin-top: 180px;
  margin-left: 180px;
  flow-children: right;
}

#AbilityInfomain1 Label
{
	color: white;
	font-size: 20px;
	horizontal-align: center;
}

#AbilityButton
{
	width: 60px;
	height: 60px;
	background-color: black;
	vertical-align: middle;
	horizontal-align: center;	
}

Портрет героя(без анимации)
Это в custom_loading_screen.xml:
Код:
  <Panel id="HookerImage"> 
   <DOTAHeroImage heroname="ИМЯ ГЕРОЯ, НАПРИМЕР: npc_dota_hero_rattletrap" heroimagestyle="portrait" />
  </Panel>
А это в custom_loading_screen.css:
Код:
#HookerImage
{
  margin-top: 155px;
  margin-left: 438px;
}

Дота профиль и ник игрока(Каждый видит свой профиль и свой ник(ХЗ, ЗАЧЕМ ВАМ ЭТО).)
Это в custom_loading_screen.xml:
Код:
	<Panel id="Statsmain">
    <Label text="ТЕКСТ КАКОЙ-НИБУДЬ ЗДЕСЯ"/>	
      <DOTAAvatarImage class="avatar" steamid="local" />
	  <DOTAUserName class="username" steamid="local" />
  </Panel>
А это в custom_loading_screen.css:
Код:
#Statsmain
{ 
  horizontal-align: left;
  vertical-align: center;
  margin-top: 225px;
  margin-left: 0px;
  flow-children: right;
  background-color: #000000cc;
  padding-bottom: 75px;
  padding-right: 105px;
}

#Statsmain Label
{
	color: white;
	font-size: 20px;
	horizontal-align: center;
}

.avatar
{
	width: 60px;
	height: 60px;
	background-color: black;
	vertical-align: middle;
	horizontal-align: center;
}

.username
{
	color: yellow;
	font-size: 40px;
}

Типа опрос, нравится ли игроку кастомка(Хотя на самом деле результаты никуда не отправляются и ничего не решают, но зато игрок может подумать, что нам интересно его мнение)
Это в custom_loading_screen.xml:
Код:
<Panel id="Opinionmain">
  <Label text="А ЧТО ВЫ ДУМАЕТЕ О НАШЕЙ КАСТОМКЕ???"/>	
	<RadioButton checked="checked" group="opinion" id="opinion1" text="УЖАСНАЯ" onactivate="DOTAShowTitleTextTooltip(БОЛЬШОЕ СПАСИБО!, ВАШЕ МНЕНИЕ НАМ ОЧЕНЬ ВАЖНО!!!)"/>
    <RadioButton group="opinion" id="opinion2" text="УЖАСНОЕ ГОВНЕЦО" onactivate="DOTAShowTitleTextTooltip(БОЛЬШОЕ СПАСИБО!, ВАШЕ МНЕНИЕ НАМ ОЧЕНЬ ВАЖНО!!!)"/>
</Panel>
А это в custom_loading_screen.css:
Код:
#Opinionmain
{ 
  horizontal-align: left;
  vertical-align: top;
  margin-top: 300px;
  margin-left: 0px;
  flow-children: right;
  background-color: #000000cc;
}

#Opinionmain Label
{
	color: white;
	font-size: 20px;
	horizontal-align: center;
}

#Opinion
{
	width: 60px;
	height: 60px;
	background-color: black;
	vertical-align: middle;
	horizontal-align: center;	
}

Название кастомки с анимацией
Это в custom_loading_screen.xml:
Код:
   <Panel id="TitlePanel"> 
     <Label id="AddonTitle" text="#addon_game_name" style="" />
  </Panel>
А это в custom_loading_screen.css:
Код:
#TitlePanel
{
 horizontal-align: left;
 vertical-align: bottom;
 margin-bottom: 150px;
 margin-left: 100px;
 flow-children: right;
 animation-name: gamemode_anim;
 animation-delay: AnimationDelay;
 animation-duration: TotalLength;
 animation-timing-function: TimingFunc;
 animation-iteration-count: IterationCount;
}

#AddonTitle
{
 margin-bottom: -15px; 
 vertical-align: center;
 text-transform: uppercase;
 font-size: 80px;
 color: #cccccc;
 text-shadow: 2px 2px 2px #000000;
}

@keyframes 'gamemode_anim'
{
 0%
 {
  transform: translateX( 0px ) translateY( 0px );
  pre-transform-scale2d: .8;
 }

 100%
 {
  transform: translateX( 0px ) translateY( -200px );
 }
}

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

proxy.php?image=https%3A%2F%2Fpp.userapi.com%2Fc841231%2Fv841231170%2F1abec%2F034uLsYfPmA.jpg&hash=e25314614bb48d9f974fe7a4b877e35b
 
Последнее редактирование модератором:

I_GRIN_I

Друзья CG
15 Мар 2016
986
42
28
19
Реакции
38 0 1
#2
Дикий Пёс, зачем танцы с бубном при добавлении иконки спелла? Есть класс панельки, называется DOTAAbilityImage
 
28 Июн 2017
94
12
8
Проект
HOOK WARS REBORN
Реакции
16 0 1
#3
I_GRIN_I, Я же писал, что этот способ не всегда работает с кастомными иконками
 

I_GRIN_I

Друзья CG
15 Мар 2016
986
42
28
19
Реакции
38 0 1
#4
Дикий Пёс, у меня всегда работал
 

destructioN

Пользователь
16 Сен 2018
14
0
1
20
Проект
Меч Предназначения
Реакции
0 0 0
#5
Дайте инфу, где находится custom_loading_screen.xml ?
 
28 Июн 2017
94
12
8
Проект
HOOK WARS REBORN
Реакции
16 0 1
#6
Реклама: