GUI chat changing
by Charles Andrew · in Game Design and Creative Issues · 06/12/2006 (8:59 am) · 12 replies
Whenever i touch the "chatHudBorderArray.png" image and just add one little pixel, torque crashes, how can i solve this problem, and how do i make the bitmap so it doesn't crash torque?
About the author
#2
so i can't give you a truly useful link,
but i can maybe help a little.
Torque uses "bitmap arrays" as a convenient way of including several small bitmaps which need to fit together all in one image file. For example, a basic window could consists of 9 pieces, like a tic-tac-toe board: four images for each of the corners, four for each of the edges, and one for the center. The edge and center pieces could then be stretched to match up nicely with the corner pieces.
Torque's windows are a bit more complicated i think, but that's the idea.
The method of putting all these pieces into a single image file is basically by including the "lines" of the tic-tac-toe grid in the image, usually in some solid primary color like blue or red. These grid lines are critical, and my guess is that you're somehow messing them up.
here's the image in question:

looking at it, i would guiess the software is probably looking for two rows of image-cells,
with three cells in the first row and five in the second row.
also on reconsidering,
i suspect that the "solid" color should actually be saved as Transparent, via the amazing wonderful transparent abilities of PNG. - this could also be your problem, if you're using a paint app which isn't saving out the transparency info. How to tell ? Easy - drag-n-drop your version of the image into firefox. If it has your default firefox background color in the background (probably white), you're good. If it has blue or whatever, you've lost the transparency info.
okay.
that's all i've got for now.
i'm pretty darned sure this is covered properly somewhere in TDN tho.
06/14/2006 (9:07 am)
Hey Charles - i did a search earlier to find something to point you in the right direction and failed, so i didn't say anything hoping someone else would.so i can't give you a truly useful link,
but i can maybe help a little.
Torque uses "bitmap arrays" as a convenient way of including several small bitmaps which need to fit together all in one image file. For example, a basic window could consists of 9 pieces, like a tic-tac-toe board: four images for each of the corners, four for each of the edges, and one for the center. The edge and center pieces could then be stretched to match up nicely with the corner pieces.
Torque's windows are a bit more complicated i think, but that's the idea.
The method of putting all these pieces into a single image file is basically by including the "lines" of the tic-tac-toe grid in the image, usually in some solid primary color like blue or red. These grid lines are critical, and my guess is that you're somehow messing them up.
here's the image in question:

looking at it, i would guiess the software is probably looking for two rows of image-cells,
with three cells in the first row and five in the second row.
also on reconsidering,
i suspect that the "solid" color should actually be saved as Transparent, via the amazing wonderful transparent abilities of PNG. - this could also be your problem, if you're using a paint app which isn't saving out the transparency info. How to tell ? Easy - drag-n-drop your version of the image into firefox. If it has your default firefox background color in the background (probably white), you're good. If it has blue or whatever, you've lost the transparency info.
okay.
that's all i've got for now.
i'm pretty darned sure this is covered properly somewhere in TDN tho.
#3
And that file posted is VERY frustrating to skin, as to many things for that window seem to be hard coded.
Other windows are easer. I suggest you skin those and place the Chat GUI on the new window and forget that one completely.
06/14/2006 (10:15 am)
The first pixel in the file Determine what the Transparency color is.And that file posted is VERY frustrating to skin, as to many things for that window seem to be hard coded.
Other windows are easer. I suggest you skin those and place the Chat GUI on the new window and forget that one completely.
#4
And that file posted is VERY frustrating to skin, as to many things for that window seem to be hard coded.
Other windows are easer. I suggest you skin those and place the Chat GUI on the new window and forget that one completely.
06/14/2006 (10:19 am)
The first pixel in the file Determine what the Transparency color is.And that file posted is VERY frustrating to skin, as to many things for that window seem to be hard coded.
Other windows are easer. I suggest you skin those and place the Chat GUI on the new window and forget that one completely.
#5
thanks for the help guys i really appreciate it a lot, Orion, are you saying that if i keep inside those blue lines with my image and make the blue transparent, torque wont crash? annd Allyn, is the first pixel in the file the top left pixel or where is it? thanks again for your help! its a shame, no-one has put up a mod for the chat HUD, i might do sometime...
06/14/2006 (1:08 pm)
Double post lol,thanks for the help guys i really appreciate it a lot, Orion, are you saying that if i keep inside those blue lines with my image and make the blue transparent, torque wont crash? annd Allyn, is the first pixel in the file the top left pixel or where is it? thanks again for your help! its a shame, no-one has put up a mod for the chat HUD, i might do sometime...
#6
i dont know why its soo hard lol!!! and i am sure that the blue was transparent, i tested it on a grey background and it was definitely transparent
06/14/2006 (1:16 pm)
I edited the image, making sure all the blue was transparent, added it to my project and torque still crashed...i dont know why its soo hard lol!!! and i am sure that the blue was transparent, i tested it on a grey background and it was definitely transparent
#7
i'm sure he's right.
try a really simple test -
1. go back to the totally original image
2. confirm that the engine does not crash
3. load the image, do *not* modify it, save it out again
4. confirm that the engine does not crash
5. load the image, make some very trivial change, save it out again
etc
06/14/2006 (1:35 pm)
I think allyn was saying that the upper-left pixel needs to match exactly your delimiter color.i'm sure he's right.
try a really simple test -
1. go back to the totally original image
2. confirm that the engine does not crash
3. load the image, do *not* modify it, save it out again
4. confirm that the engine does not crash
5. load the image, make some very trivial change, save it out again
etc
#8
and i will try your test thing later, thanks again for all your help!
06/15/2006 (8:56 am)
What is the delimeter colour?and i will try your test thing later, thanks again for all your help!
#9
in the example above, the blue bands would be the delimiters and so blue would be the delimiter color.
as said elsewhere in this thread, it doesn't have to be blue, tho. the delimiter color is set by the upper-left pixel in the image. in this case, the artist chose blue.
06/15/2006 (9:14 am)
Wikipedia: "Delimiters are marks which are used to separate subfields of data."in the example above, the blue bands would be the delimiters and so blue would be the delimiter color.
as said elsewhere in this thread, it doesn't have to be blue, tho. the delimiter color is set by the upper-left pixel in the image. in this case, the artist chose blue.
#10
But i was also saying, that even if you follow all the rules, That file will crash every time.
That one.
I would sugest, once again, that you ingore that image file and any refrance to it. Make your own, and just use the Chat GUI thingy with your new window.
That window has to many things attached to it and hard coded, none of witch is exposed, it seems to be in the C++. If you change one single thing, it will crash.
Also, the color can be anything, what it does have to be is a pure color (255). Make sure with any GUI parts that you avoid using that pure color in the image itself, thoes areas will mess up the array, becouse its looking in a stright line (for lack of a better explnation) if it encounters somthing that is that color, it moves to the next thing its looking for, and will error out becouse it now has to many.
Use normail Transparency rules for your transparent areas, and the pure color to define the parts.
EDIT: you should edit the demoWindow.png and use that. As long as you respect the lines, they can be any size you want.
If i can find where i put it, ill put up my PSD file for that window.
06/15/2006 (10:04 am)
Yes, that is what i was saying.But i was also saying, that even if you follow all the rules, That file will crash every time.
That one.
I would sugest, once again, that you ingore that image file and any refrance to it. Make your own, and just use the Chat GUI thingy with your new window.
That window has to many things attached to it and hard coded, none of witch is exposed, it seems to be in the C++. If you change one single thing, it will crash.
Also, the color can be anything, what it does have to be is a pure color (255). Make sure with any GUI parts that you avoid using that pure color in the image itself, thoes areas will mess up the array, becouse its looking in a stright line (for lack of a better explnation) if it encounters somthing that is that color, it moves to the next thing its looking for, and will error out becouse it now has to many.
Use normail Transparency rules for your transparent areas, and the pure color to define the parts.
EDIT: you should edit the demoWindow.png and use that. As long as you respect the lines, they can be any size you want.
If i can find where i put it, ill put up my PSD file for that window.
#11
06/15/2006 (11:09 pm)
Thanks for your help, much appreciated, i will do that, as soon as i can, thanks again, ill post my progress...
Torque Owner Charles Andrew