lotrointerface.com
Search Downloads


Go Back   LoTROInterface > LotRO > Developer Discussions > Tutorials & Other Helpful Information (L)

Reply
Thread Tools Display Modes
  #1  
Unread 02-26-2008, 03:41 PM
Sloppy Joe Sloppy Joe is offline
The Indomitable
 
Join Date: Feb 2008
Posts: 11
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
Reply With Quote
  #2  
Unread 02-26-2008, 08:21 PM
daimon's Avatar
daimon daimon is offline
The Undying
Interface Author - Click to view interfaces
 
Join Date: Aug 2007
Location: Finland
Posts: 466
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
__________________
~·~ DaimonUI ~·~
avatar by Humon
Reply With Quote
  #3  
Unread 02-26-2008, 09:29 PM
Cleitanious's Avatar
Cleitanious Cleitanious is offline
The Undying
Interface Author - Click to view interfaces
 
Join Date: Aug 2007
Posts: 92
The only reason no one has ever done anything like this before is because it wasnt possible until the most recent patch
__________________
I believe in science and that science can explain everything,
Because God has made it all work in such a beautiful way.
Reply With Quote
  #4  
Unread 02-27-2008, 11:26 AM
Kuvasie's Avatar
Kuvasie Kuvasie is offline
Super Moderator
Premium Member
LOTROInterface Super Mod
Interface Author - Click to view interfaces
 
Join Date: Feb 2007
Location: Texas
Posts: 67
Very nice write-up. Thanks for sharing.

Kuv
Reply With Quote
  #5  
Unread 02-27-2008, 11:28 AM
Deewe Deewe is offline
The Undying
Interface Author - Click to view interfaces
 
Join Date: Sep 2007
Posts: 104
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
Reply With Quote
  #6  
Unread 03-06-2008, 10:15 AM
Brygard2007's Avatar
Brygard2007 Brygard2007 is offline
The Undying
Interface Author - Click to view interfaces
 
Join Date: Sep 2007
Location: http://www.youtube.com/user/Brygard2009
Posts: 183
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.

Reply With Quote
  #7  
Unread 03-09-2008, 06:00 PM
Sloppy Joe Sloppy Joe is offline
The Indomitable
 
Join Date: Feb 2008
Posts: 11
Quote:
Originally Posted by Brygard2007
...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.
Reply With Quote
  #8  
Unread 03-09-2008, 07:33 PM
The Scyphozoa's Avatar
The Scyphozoa The Scyphozoa is offline
The Undying
 
Join Date: Jan 2008
Location: Sector 5
Posts: 80
Longestnamepossible is one letter short of the longest name possible.
__________________
W00t W00t Boogie Woogie W00t
Reply With Quote
  #9  
Unread 03-09-2008, 10:37 PM
Brygard2007's Avatar
Brygard2007 Brygard2007 is offline
The Undying
Interface Author - Click to view interfaces
 
Join Date: Sep 2007
Location: http://www.youtube.com/user/Brygard2009
Posts: 183
Think I already done this Sloppy Joe and it didnt work,I have to recheck again.
Thanks..
Reply With Quote
  #10  
Unread 03-09-2008, 10:50 PM
Sloppy Joe Sloppy Joe is offline
The Indomitable
 
Join Date: Feb 2008
Posts: 11
Quote:
Originally Posted by Brygard2007
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
Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Vitals bars background Deewe General Authoring Discussion (L) 3 06-15-2008 05:04 AM
Vitals Display Idea amariedan Interface Requests (L) 3 11-23-2007 09:53 AM
Raid vitals background problem Waaagh Interface Help (L) 1 10-23-2007 02:54 PM
Frame Aligments daimon General Authoring Discussion (L) 5 09-17-2007 10:01 AM
Vitals Dretchen General Authoring Discussion (L) 2 05-17-2007 04:41 PM


All times are GMT -5. The time now is 06:32 AM.


Our Network
EQInterface | EQ2Interface | Minion | WoWInterface | ESOUI | LoTROInterface | MMOUI | Swtorui