LoTROInterface

LoTROInterface (https://www.lotrointerface.com/forums/index.php)
-   Tutorials & Other Helpful Information (L) (https://www.lotrointerface.com/forums/forumdisplay.php?f=21)
-   -   Vitals Frame 101 (https://www.lotrointerface.com/forums/showthread.php?t=558)

Sloppy Joe 02-26-2008 03:41 PM

Vitals Frame 101
 
Greets,

Since I've been playing around with the vitals frames, I've learned a few tricks and figured I would share them with you. I've noticed not alot of people do vitals frames, and those that do, only do cosmetic changes...They all have the same layout, just different colors and eye candy. So this guide will give you the basics to allow you dramaticly change the layout of your vitals frames. Here's one quick example of changing the layout (opponent vitals frame shown):



Cool huh? I squared and moved the portrait over the morale+power bars, moved the name text, removed the level background and text, removed buffs+debuffs, etc. To do this, there are 2 main blocks of code we need to look at. The first, is the panel file used to build your player vitals frame ingame:
Code:

<PanelFile ID="ID_UISkin_AvatarPanel">
  <Element ID="Toolbar_Quickslot_Extended_Scaler" X="283" Y="526" Width="460" Height="175">
    <Element ID="Toolbar_Quickslot_Extended" X="40" Y="0" Width="420" Height="175"></Element>
  </Element>
  <Element ID="AvatarPanel" X="2" Y="2" Width="274" Height="176">
    <Element ID="VitalsParent" X="0" Y="20" Width="274" Height="156">
      <Element ID="VitalsBg" X="88" Y="42" Width="175" Height="27"></Element>
      <Element ID="VitalsField" X="96" Y="34" Width="168" Height="42"></Element>
      <Element ID="AvatarPanel_BG" X="-1" Y="1" Width="273" Height="105"></Element>
      <Element ID="PlayerPortrait" X="21" Y="21" Width="64" Height="64"></Element>
      <Element ID="PlayerVitals_Animations" X="2" Y="0" Width="277" Height="104"></Element>
      <Element ID="AvatarPanel_COVER_LOWRES" X="22" Y="21" Width="64" Height="62"></Element>
      <Element ID="PlayerLevel_BG" X="21" Y="78" Width="65" Height="32"></Element>
      <Element ID="PlayerLeaderIcon" X="74" Y="68" Width="16" Height="16"></Element>
      <Element ID="PlayerAssistantIcon" X="74" Y="68" Width="16" Height="16"></Element>
      <Element ID="PlayerVoiceChat" X="71" Y="11" Width="20" Height="20"></Element>
      <Element ID="PlayerVoiceChatSquelched" X="71" Y="11" Width="20" Height="20"></Element>
      <Element ID="PlayerSendingData" X="71" Y="11" Width="20" Height="20"></Element>
      <Element ID="PlayerName" X="87" Y="3" Width="176" Height="36"></Element>
      <Element ID="PlayerEffectDisplay" X="92" Y="74" Width="169" Height="64"></Element>
      <Element ID="PlayerLevel" X="35" Y="84" Width="32" Height="17"></Element>
      <Element ID="PlayerPVP_Info" X="-4" Y="-3" Width="34" Height="98">
        <Element ID="PlayerPVP_RankDisplay" X="2" Y="0" Width="32" Height="32"></Element>
        <Element ID="PlayerPVP_PrestigeDisplay" X="0" Y="20" Width="34" Height="78"></Element>
      </Element>
    </Element>
  </Element>
</PanelFile>

Next up is the panel file used to build your opponent vitals frame ingame:
Code:

<PanelFile ID="ID_UISkin_OpponentPanel">
  <Element ID="OpponentPanel" X="268" Y="2" Width="284" Height="130">
    <Element ID="VitalsParent" X="0" Y="20" Width="284" Height="110">
      <Element ID="Opponent_SelectionField" X="7" Y="0" Width="272" Height="120">
        <Element ID="OpponentsVitals_BG" X="10" Y="40" Width="176" Height="32"></Element>
        <Element ID="OpponentVitalsField" X="10" Y="34" Width="168" Height="42"></Element>
        <Element ID="OpponentPanel_BG" X="-1" Y="1" Width="277" Height="104"></Element>
        <Element ID="OpponentClass" X="179" Y="72" Width="20" Height="20"></Element>
        <Element ID="OpponentPortrait" X="186" Y="21" Width="64" Height="64">
          <Element ID="Target_Image" X="0" Y="0" Width="64" Height="64"></Element>
        </Element>
        <Element ID="OpponentName" X="5" Y="3" Width="176" Height="36"></Element>
        <Element ID="OpponentEffectDisplay" X="9" Y="74" Width="170" Height="44"></Element>
        <Element ID="OpponentVitals_Animations" X="-4" Y="-1" Width="277" Height="104"></Element>
        <Element ID="OpponentPanel_COVER_LOWRES" X="186" Y="22" Width="64" Height="62"></Element>
        <Element ID="OpponentLevel_BG" X="185" Y="78" Width="65" Height="32"></Element>
        <Element ID="OpponentLevel" X="200" Y="84" Width="32" Height="17"></Element>
        <Element ID="OpponentPVP_RankDisplay" X="242" Y="-3" Width="32" Height="32"></Element>
        <Element ID="OpponentPVP_PrestigeDisplay" X="242" Y="17" Width="34" Height="78"></Element>
      </Element>
      <Element ID="InanimateObject_SelectionField" X="28" Y="1" Width="228" Height="84">
        <Element ID="InanimateObjectPanel_BG" X="7" Y="26" Width="215" Height="51"></Element>
        <Element ID="InanimateObjectForeground" X="-2" Y="19" Width="231" Height="66"></Element>
        <Element ID="InanimateObjectName" X="11" Y="29" Width="205" Height="47"></Element>
      </Element>
    </Element>
  </Element>
</PanelFile>

Almost every element listed can be moved, resized, or outright removed. To move elements, edit the "X" and "Y" values as needed. To resize elements, edit the "Width" and "Height" values as needed. To hide elements, set both the "Width" and "Height" values to "1". Keep inmind, that once you move the elements around, you WILL have to edit your graphics to match (player_vitals_backdrop, opponent_vitals_backdrop, etc). Don't forget about your alpha channel when editing your graphics!


The alpha channel and you


The first thing I learned about when I started all of this, is the alpha channel. What is it? Basicly, it's like a stencil or cutout of your graphic. If you were to lay the alpha channel over your graphic, you would only see the parts of your graphic that would be under the white parts of the alpha channel.


It is very important if you plan to change the shape of an element, or move elements within a panel file, that you edit your alpha channel to match. For example, when I first tried to make the portraits square, I ignored the alpha channel:


Which gave me this ingame:


But once I made the alpha channel match the shape I wanted:


I got this ingame:



That darn level background


Now this is fine and dandy, but someone will say "You can't remove the level background!" or "You will see 2 level backgrounds if you move it!". This is because not only does LOTRO use the code above along with the "level_background" and "level_background_red" files to rendor it, but it's also in the graphics for "player_vitals_backdrop", "opponent_vitals_backdrop", etc for some reason. If you compare them to the backdrop files for elites and signatures for example, you will see it's not there!


See what I mean? The elite backdrop doesn't have the level background in it, but the other one does! Once you remove it from the exsisting backdrops, or make your own, you can then use the following lines of code from above to move/remove the level background and text on your player/opponent vitals frame:

Level background and text for your players vitals frame:
Code:

<Element ID="PlayerLevel_BG" X="21" Y="78" Width="65" Height="32"></Element>
<Element ID="PlayerLevel" X="35" Y="84" Width="32" Height="17"></Element>

Level background and text for your opponents vitals frame:
Code:

<Element ID="OpponentLevel_BG" X="185" Y="78" Width="65" Height="32"></Element>
<Element ID="OpponentLevel" X="200" Y="84" Width="32" Height="17"></Element>



About the only limitation I have found so far is that while you can move the morale+power bars as one element, you cannot resize them or move them individually...As far as I know at this time. I hope this helps, and I look forward to seeing what people do with this information :)

daimon 02-26-2008 08:21 PM

Yeah many of these options weren't available before book12 went active so thats basically the reason why they are not implemented on the current skins, yet.

Nice guide though :)

Cleitanious 02-26-2008 09:29 PM

The only reason no one has ever done anything like this before is because it wasnt possible until the most recent patch :p

Kuvasie 02-27-2008 11:26 AM

Very nice write-up. Thanks for sharing.

Kuv

Deewe 02-27-2008 11:28 AM

The guide will be of much help to new authors.

As stated by other autors, before book 12 the farther we could go was to change the vitals skins, at most we could even completely hide all skins around the vitals.

Don't be fooled, before long you'll see nice new vital layout.

I know autors are fine tuning their work before publishing them, stay tuned ;)

Brygard2007 03-06-2008 10:15 AM

Hi and thanks for the guide Sloppy Joe.
I have a problem with the effects boxed,im trying to make
the effect field stretch but doesnt work at all.
What I'm trying to do is extend the effect icons over 6 effects before
the 7 effect box moves to the next row at bottom of the first row field.

Has anyone have idea or comment about it?
Thanks...

I want to make like 8 effect box in one row.

Pic of six effect in one row.


Sloppy Joe 03-09-2008 06:00 PM

Quote:

Originally Posted by Brygard2007 (Post 2510)
...I want to make like 8 effect box in one row...

My first thought, is that if you widen the area for the effects, you will have to also widen the panel file itself. Or move the effects in the opposite direction so that they will physically fit, etc. I'm betting that the server won't allow for them to be drawn outside of its parent.

The Scyphozoa 03-09-2008 07:33 PM

Longestnamepossible is one letter short of the longest name possible. ;)

Brygard2007 03-09-2008 10:37 PM

Think I already done this Sloppy Joe and it didnt work,I have to recheck again.
Thanks..

Sloppy Joe 03-09-2008 10:50 PM

Quote:

Originally Posted by Brygard2007 (Post 2555)
Think I already done this Sloppy Joe and it didnt work,I have to recheck again.
Thanks..

You probably did...I just did some quick testing and am having the same problem. I can move them, but I cannot resize or alter how they are displayed. I'm thinking it's gonna be like the morale+power bars where we can't do much with them...Atleast for now...Hopefully ;)


All times are GMT -5. The time now is 07:35 AM.

vBulletin® - Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
© MMOUI