Add tab to character sheet

[Hamish]

People,

I'm extremely new to FG, and although I'm a seasoned veteran in VBScript, Lua is also very new. So I feel like a complete newbie when the first project I undertake grinds to a halt within 2 days.
The goal was very simple, but apparently not easy to achieve. I want to add a tab to the character sheet. I already noticed you have to change a lot of files to do this, but I can't get it to work. Here's what I did:


Created a new icon for the tab
Added the icon to graphics.xml
Added a subwindow key under sheetdata in charsheet_toplevel.xml
Added a tab key under sheetdata/tabcontrol in character_toplevel.xml
Resized charsheet.png
Added a tab to tabs.png
Modified the height in all charsheet_<tab> windowclass/placement/size character_<tab>.xml


The icon with the tab name appears in the right place, and when I click it my extra tab opens, but I'm left with two graphical problems:

The character sheet does not seem to have changed in size at all.
The label of the new tab doesn't look like it should, it looks like it's on the same tab as the one above it, but when I click it, I do see the corners change.


I hope someone can help!

Hamish

[Dachannien]

If you could post the relevant sections of code, there are several people here who would be happy to take a look. :)

[Foen]

I'd be happy to look at your code when you post it, but one thing leaps immediately to mind: you don't need to add a tab to tabs.png, and shouldn't really do so (it causes the distortion you are seeing). The tabs are extended by FGII repeating the middle section multiple times and 'topping' and 'tailing' the image using the tabs at the top and bottom.

The definition of this is in graphics_frames.xml:


<framedef name="tabs">
<bitmap file="frames/tabs.png" />
<topleft rect="0,0,18,13" />
<topright rect="0,0,0,0" />
<left rect="0,13,18,455" />
<bottomleft rect="0,468,18,24" />
</framedef>

To change the number of tabs, edit the bounds parameter of the tabcontrol in charsheet_toplevel.xml. The fourth parameter (height) can be reduced or extended in increments of 67 (I think) to give fewer or greater numbers of tabs.

Cheers

Stuart
(Foen)

[Hamish]

I'll post my code here, but it's in about 10 different files so I'll zip all modified files, and attach them.

[Valarian]

I had a problem where I was increasing the size of one of the boxes. The problem was that the campaign takes a copy of all the sizes in it's own XML file. The problem was resolved by deleting the test campaign and then recreating it from the ruleset. Your problem with the character sheet resizing may be the same thing.

[joshuha]

Instead of deleting the campaign you can just replace everything in the CampaignRegistry.lua file with {}

This will reset all the stored window sizes. (I actually turned this off for my ruleset as I dynamically resize windows a lot via LUA). The code that does this is in scripts/windowmanager.lua and if you want to disable this feature remove the reference in base.xml

[Hamish]

Useful tip, but not the solution to my problem. I also edited graphics_frames.xml (changes only):



<framedef name="charsheet">
<bottomleft rect="0,656,22,22" />
<bottom rect="22,656,481,22" />
<bottomright rect="503,656,22,22" />
</framedef>

<framedef name="tabs">
<left rect="0,13,18,522" />
<bottomleft rect="0,535,18,24" />
</framedef>


Still no luck though.....
Should I do something to the framedef of "sheetgroup" maybe?

[Hamish]

The framedef of tabs also surprises me:



<framedef name="tabs">
<bitmap file="frames/tabs.png" />
<topleft rect="0,0,18,13" />
<topright rect="0,0,0,0" />
<left rect="0,13,18,455" />
<bottomleft rect="0,468,18,24" />
</framedef>


I don't understand topright.... It's located at 0,0 and has no height, and no width. What's the point? And also the explanation of frames does not appear to apply to this frame, I changed it to:



<framedef name="tabs">
<bitmap file="frames/tabs.png" />
<topleft rect="0,0,18,13" />
<topright rect="0,0,0,0" />
<left rect="0,13,18,522" />
<bottomleft rect="0,535,18,24" />
</framedef>


But I still get only 7 tabs. The middle part does not seem to be repeated as it should be.

[Foen]

It is not the framedef that needs changing, but the tabcontrol bounds in charsheet_toplevel. The framedef describes _how_ the bitmap is extended, the tabcontrol bounds describe _how much_.

Hope that helps

Stuart
(Foen)

[Hamish]

Okay, I changed that back to the original settings and my sheet has actually gotten bigger.
Still doesn't look good though. Now I'm thinking maybe I changed too much......

[joshuha]

I changed that too, and it did not work.



<tabcontrol name="tabs">
<bounds>-22,50,18,559</bounds>
<tab>
<icon>tab_main</icon>
etc...


Instead of



<tabcontrol name="tabs">
<bounds>-22,50,18,492</bounds>
<tab>
<icon>tab_main</icon>
etc...


I just double checked and mine changes as soon as I reloaded. Your ruleset is not named d20 is it?

[Dachannien]

Okay, I changed that back to the original settings and my sheet has actually gotten bigger.
Still doesn't look good though. Now I'm thinking maybe I changed too much......

Actually, that's pretty much what it's supposed to look like. 13 pixels down from the top is where the tiling occurs, so if the image has to repeat, you'll get one tab that looks extra tall, and then subsequent tabs will be the normal size.

If you really want to do this right, you'll have to edit the tabs.png image to insert an additional tab, then change the framedef and the bounds in the tabcontrol.

[Hamish]

Hmmm, good point..... I'll have a closer look at tabs.png to see if I can work with that.

[Hamish]

Thanks Dachannien! That actually did the trick.
Foen, I think you're right that most of the time you don't have to edit the graphic files themselves, but in this case I had to in the end.

Thanks everyone for your help! I'm feeling less newbie already. :)

[Dachannien]

The big difference this time is that the individual tabs are drawn to overlap. If they didn't overlap at all, you could just have a graphic with one tab and let it tile the graphic. There might be another way you could get overlapping tabs to tile, but apparently SmiteWorks didn't think of one, because they ended up just making one big graphic with all the tabs :)

[Toadwart]

Whilst converting over an FG1 ruleset I abandoned the idea of using the base d20 ruleset tabcontrol. It only works vertically and most of my existing tabs were horizontal.
Anyways, what I ended up doing was just whacking a bunch of button controls onto the frame with a script attached to activate/deactivate the appropriate subwindows.
The buttons use a frame that is 100% transparent because my images already had the tab buttons pre-drawn on them but I guess you could easily use an image for the buttons that allows you to have them overlapping (and the script could bring the active one to the front).
If anyone wants to use this approach just give me a yell and I'll post the code up here.

[mcgarnagle]

Whilst converting over an FG1 ruleset I abandoned the idea of using the base d20 ruleset tabcontrol. It only works vertically and most of my existing tabs were horizontal.
Anyways, what I ended up doing was just whacking a bunch of button controls onto the frame with a script attached to activate/deactivate the appropriate subwindows.
The buttons use a frame that is 100% transparent because my images already had the tab buttons pre-drawn on them but I guess you could easily use an image for the buttons that allows you to have them overlapping (and the script could bring the active one to the front).
If anyone wants to use this approach just give me a yell and I'll post the code up here.

Hey Toadwart, I'd love to see the code, even though I'm sure I have looked at it a million times already. I'm using your generic charactersheet and need to add two more tabs to the left of the ones already on the sheet. I added the tab graphics to the sheets, but for the life of me, I can't see how you designate the positions of the clickable tabs... Maybe see just the code seperate from the rest will help me out.

Edit: Toadwart, I kept at it, and I think I figured it all out. I have my tabs working without any known problems. Thanks for making that Generic sheet! I don't think I could have done any of this without it!

[Toadwart]

Hmm, think I was a bit confused by the tab scripts when I set that up. Looking at it now it is a bit of a mess because I just hacked the default d20 rulesets tab script.


A simpler approach is just to create a genericcontrol for each 'tab' and a script that makes one subwindow visible and the others invisible when the control is clicked.


<genericcontrol name="tab_main">
<bounds>300,1,40,20</bounds> <!-- or use anchoring to position it -->
<frame>
<name>TabMain</name>
</frame>
<script>
function onClickDown(button, x, y )
return true;
end

function onClickRelease(button, x, y )
mainwindow.subwindow.setVisible(true);
infowindow.subwindow.setVisible(false);
end
</script>
</genericcontrol>
<genericcontrol name="tab_info">
<bounds>340,1,40,20</bounds> <!-- or use anchoring to position it -->
<frame>
<name>TabInfo</name>
</frame>
<script>
function onClickDown(button, x, y )
return true;
end

function onClickRelease(button, x, y )
mainwindow.subwindow.setVisible(false);
infowindow.subwindow.setVisible(true);
end
</script>
</genericcontrol>


This assumes you have 2 subwindows defined called mainwindow and infowindow and frame definitions, TabMain and TabInfo, for the tab image.
Obviously you can have as many subwindows as you want but it gets a bit unweildy if you have more than 4 or 5 as you have to hard-code them into the script for each 'tab'.

Also note: the onClickDown function has been implemented even though all it does is return true. It just lets FG know that we have handled the onClickDown event ourselves and this allows us to handle the onClickReleased event.
If we dont implement onClickDown then FG just ignores our onClickReleased function!

Why not just change the visible tab in onClickDown? Well, you can. But I prefer to do it when the mouse is released as it gives the an escape route. If they acidentally click down on a tab they can 'cancel it by dragging the window a few pixels before releasing the button (that doesn't trigger the onMouseReleased event - and so doesn't change the active tab)

[jdurchen]

Ok. I was trying to do this and getting the exact same result. This is what I ended up doing to make this work.

1) In charsheet_toplevel.xml, added your menu item to the list. This lets your tabcontrol know you have another tab and to watch for it.

2) Creat your new tab graphic with it's name and save it as tab_newtab.png where newtab is your name.

3) Make sure you define this new graphic file in graphics.xml I did mine right next to the one for tab_notes since mine followed this one. The name you define for this graphic is what is used for the <icon> atribute you set in step 1 above.

4) Using your favorite image editor, you need to add another tab to the image. In photoshop I increased the canvas size by 67 high and copied a 67 pixel section in the middle and moved the whole top section up 67 and then pasted my copy in the middle. This is easier than messing with the ends of the image. At first I figured this would be sufficient to get this to work. You do need to in fact do one more thing.

3) Change graphics_frames.xml file for the tabs.png to look at your new area of the graphic. You essentially increased the size of the image you want this to look at. This file lets you specify exactly where within an image to take a "section" of it and use it. In most cases, this will be the entire image. So for the tabs image my entry now looks like this.

<framedef name="tabs">
<bitmap file="frames/tabs.png" />
<topleft rect="0,0,18,13" />
<topright rect="0,0,0,0" />
<left rect="0,13,18,522" /> THIS LINE CHANGED TO 522
<bottomleft rect="0,535,18,24" /> THIS LINE CHANGED 535
</framedef>

I saved my changes and reloaded, and it worked like a charm. Now to figure out which font they used for the tabs...

[Foen]

Now to figure out which font they used for the tabs...

It is not an exact match, but comic sans is pretty close.