Home > notes > Paperdoll

Paperdoll mods

This describes changes I made to the paperdoll page for my latest Lara mod. It will include the other file changes that were needed to make it work.


I had two changes I wanted to make.

  • The shield slot would be used for her backpack
  • The body slot would be split into two, so she could take off her shirt and pants separately. I decided to lose the amulet slot and adjust the sizes to fit. That would let me replace amulets with pants, and not have to rewrite all the equipping logic.

The definition of the paperdoll window is in ui\backend\interface\character_main_tab.gas. This contains a definition of the entire tab, and all the individual panes it contains.

There are four sets of stacked panes that occupy the same area, layered on top of each other. These are the background for the equipment slots, a "flash" layer used to indicate where an item may be dropped, a "ghost" layer that shows what type of equipment each slot can hold, and a final layer that holds the actual equipped item image. We have to alter the coordinates of each layer for the slots we are changing. In my case the armor slot is made a bit smaller, and the amulet slot a bit larger, and their positions are swapped, so the shirt (armor) comes above the shorts (amulet). The positions of each layer must be the same, so copy carefully!


[t:window,n:bg_itemslot_armor]
{ // changed values in red
  i draw_order = 101;
	group = equipment;
	layer = listener;
  b pass_through = true;
	rect = 258,184,310,234;
  f rotate_angle = 4.712389;
  f rotate_point_x = 0.500000;
  f rotate_point_y = 0.500000;
	texture = b_gui_ig_m_pdoll-up;
	uvcoords = 0.000000,0.023438,0.398438,0.601563;
}
[t:window,n:bg_itemslot_amulet]
{
  i draw_order = 101;
	group = equipment;
	layer = listener;
  b pass_through = true;
	rect = 258,235,309,285;
  f rotate_angle = 4.712389;
  f rotate_point_x = 0.500000;
  f rotate_point_y = 0.500000;
	texture = b_gui_ig_m_pdoll-up;
	uvcoords = 0.000000,0.023438,0.398438,0.601563;
}

Each pane has a position within the tab (rect = a, b,c,d in pixels), and a set of coordinates for the area from the bitmap that will display there (uvcoords = j,k,l,m expressed as values between 0.0 and 1.0). The texture to be used is also declared here. I used the standard ones, but I could have pointed to a replacement.

bitmap layout You will notice that the paperdoll window is 6x6 cells but the bitmaps for the background etc. are 5x5 cells. The orientation of the slots is not the same, either, so there is a rotation applied when using the textures. The rotation point is always the middle of the slot, and you can copy the amount of rotation from an existing entry, rather than figure out what the units are! For this application I used the body armor background and ghost images for both shirt and pants slots.

Lara has her shield grip moved to her spine and wears a backback instead of carrying a shield, so the shield slot becomes the backpack slot, and stays the same size.

The ghost windows for each slot also define the rollover help that says "DRAG xxxx here to equip". We don't need to change the names, but we want to change the text, so note the names used and find them in ui/user_education_tooltips.gas so they can be changed to match the new slot content. It's worth noting here that the shield slot can be used for a second weapon by dual-wielding melee characters, so there is a mechanism for calling code to select the message.


Now the fun part. We just added an extra equipment slot - but how do we change the figure or texture when an item is equipped or removed? For body armor, boots, gloves and helmets, the engine will replace sub-meshes for that part of the figure, but the shirt and shorts are parts of the same submesh, so how can they be separately controlled?

In principle, the figure could have been further divided and submesh replacement used again, but her shorts are tight enough to be pure texture map, so I could add skrit code to swap textures when the shorts slot is changed. This is added to the templates for the shorts (implemented as a replacement for amulets, which the slot replaced) and the shirt (body armor). When either is equipped or removed, the skrit can determine which texture to use for the new combination of shirt/short on or off.

This technique would need more refinement if it were for a more general situation, but "Lara only has the one outfit in this game". Well, I shouldn't have written that because when I made her swim, she wanted a bikini. So now I have to make a change to the code. More about that here

Lara 3