PDA

View Full Version : Reskinning the chatbox



Lizard Lips
January 13th, 2005, 13:06
HopeI can get some help from the devs on this one. I'm reskinning FG:

http://www.jsears.com/screenshot.jpg

I want the chatbox to look like this:

http://www.jsears.com/screenshot_intended.jpg

But it ends up like this in FG:

http://www.jsears.com/screenshot_actual.jpg

What's going on in the bottom of the chatbox? I can see it's repeating the top part of the image, but why? Is there a way to not repeat the top part of the imag?

Ged
January 13th, 2005, 17:28
The following code in the data\graphics.xml defines the graphical content of the chatbox.


<framedef name="chatbox">
<bitmap file="data\frames\chatbox.png" />
<topleft rect="0,0,12,12" />
<top rect="12,0,501,12" />
<topright rect="513,0,16,12" />
<left rect="0,12,12,460" />
<middle rect="12,12,501,460" />
<right rect="513,12,16,460" />
<bottomleft rect="0,480,12,50" />
<bottom rect="12,480,501,50" />
<bottomright rect="513,480,16,50" />
</framedef>

Here nine areas are extracted from chatbox.png. Especially it is noteworthy that the left, middle, and right areas are 460 pixels high; and together the graphics extracted are 512 pixels high

data\gameelements.xml, on the other hand, defines the functional blocks of the chatbox:


<chatwindow>
<frame name="chatbox" hilight="chatboxhilight" />
<position rect="15,90,390,560" />
<chatarea rect="33,105,358,485" />
<entryarea rect="31,616,310,20" />
<waiticon position="328,103" name="indicator_chatwait" />
<state position="345,610" speak="chat_speak" emote="chat_emote" action="chat_action" ooc="chat_ooc" />
</chatwindow>

The chatarea alone is 485 pixels high and it does not include the graphical margins.

What you need to do is either make larger graphics and change the definitions in graphics.xml (for instance, make a copy of the d20 ruleset folder, copy graphics.xml and/or gameelements.xml there, and change the references in base.xml to point to the correct folder containing the said xml-files), or make graphics that are tiled properly. Because you wish to use gradient effects the former case is better, naturally.

Some remarks why the chatbox is created this way: in essence most windows are resizeable and in order to stretch them correctly, without distorting the corners or stretching ornaments, they must be assembled from pieces. Whilst the resizability of the chatbox is turned off for other technical reasons, decomposition of one image makes it easy to resize the chatbox if, eg, the GM knows that all players have much better screen resolutions than the minimum requirement.

Lizard Lips
January 13th, 2005, 23:54
Awesome. I had found the chatbox.xml, but not the chatboxhighlight bit. That's very helpful. Your customer service is fantastic btw.

Ged
January 14th, 2005, 05:57
Thanks! :D