GUI BitmapButton Container Help iTorque2D
by Jeremy Dull · in Torque Developer Network · 06/21/2012 (11:31 am) · 3 replies
I am having a problem making my level select screen that I could use some help and input into. I currently have a selection screen similarto what you find on Angry Birds or Cut the Rope where I have multiple buttons for each level where I want to be able to lock the buttons so that I can't access them until they are unlocked.
The problem that I have is that I currently have the GUIbitmapButton as a container for the level number graphics that I have. The idea is that when I have the button set as inactive it will display a locked image and make the number invisible. The problem is that with the numbers in the container I am not able to click on the button unless I am clicking on the edges outside of the numbers container.
So I am looking to find a way to be able to click on the inner containers but have it activate the parent button. I know I can just make different images with the numbers prerendered on them, but I am trying to reduce the overhead of having 60 different graphic files 1 for each of the level numbers. Here is what I have for my guiCode.
I look forward to hearing your guys suggestions.
The problem that I have is that I currently have the GUIbitmapButton as a container for the level number graphics that I have. The idea is that when I have the button set as inactive it will display a locked image and make the number invisible. The problem is that with the numbers in the container I am not able to click on the button unless I am clicking on the edges outside of the numbers container.
So I am looking to find a way to be able to click on the inner containers but have it activate the parent button. I know I can just make different images with the numbers prerendered on them, but I am trying to reduce the overhead of having 60 different graphic files 1 for each of the level numbers. Here is what I have for my guiCode.
%guiContent = new GuiControl(levelSelectGui) {
canSaveDynamicFields = "0";
PlatformTarget = "UNIVERSAL";
isContainer = "1";
Profile = "GuiDefaultProfile";
HorizSizing = "right";
VertSizing = "bottom";
Position = "0 0";
Extent = "1024 768";
MinExtent = "8 2";
canSave = "1";
Visible = "1";
hovertime = "1000";
new GuiChunkedBitmapCtrl(backgroundImage) {
canSaveDynamicFields = "0";
PlatformTarget = "UNIVERSAL";
isContainer = "0";
Profile = "GuiDefaultProfile";
HorizSizing = "relative";
VertSizing = "relative";
Position = "0 0";
Extent = "1024 768";
MinExtent = "8 2";
canSave = "1";
Visible = "1";
tooltipprofile = "GuiDefaultProfile";
hovertime = "1000";
bitmap = "gui/images/sceneSelectBackground.png";
useVariable = "0";
tile = "0";
};
new GuiBitmapButtonCtrl(level1SelectButton) {
canSaveDynamicFields = "1";
PlatformTarget = "UNIVERSAL";
isContainer = "1";
Profile = "GuiDefaultProfile";
HorizSizing = "right";
VertSizing = "bottom";
Position = "92 100";
Extent = "140 150";
MinExtent = "8 2";
canSave = "1";
Visible = "1";
Command = "startGame( expandFilename($Game::DefaultScene), level1SelectButton.levelNum );";
hovertime = "1000";
groupNum = "-1";
buttonType = "PushButton";
useMouseEvents = "1";
bitmap = "gui/images/levelButton";
levelNum = "1";
new GuiChunkedBitmapCtrl(level1NumBox) {
canSaveDynamicFields = "0";
PlatformTarget = "UNIVERSAL";
isContainer = "1";
Profile = "GuiDefaultProfile";
HorizSizing = "right";
VertSizing = "bottom";
Position = "20 22";
Extent = "96 96";
MinExtent = "8 2";
canSave = "1";
Visible = "1";
hovertime = "1000";
bitmap = "gui/images/guiBackground.png";
useVariable = "0";
tile = "0";
new GuiChunkedBitmapCtrl() {
canSaveDynamicFields = "0";
PlatformTarget = "UNIVERSAL";
isContainer = "0";
Profile = "GuiDefaultProfile";
HorizSizing = "right";
VertSizing = "bottom";
Position = "24 24";
Extent = "48 48";
MinExtent = "8 2";
canSave = "1";
Visible = "1";
hovertime = "1000";
bitmap = "gui/images/counters/toon1.png";
useVariable = "0";
tile = "0";
};
};
};Any help and insight on this matter would be greatly appreciated. I found an old post that talked about using the "canHit" feature in the source code for old T3D code, but when I went into the source code it doesn't recognize the "canHit" method since it doesn't seem to exsist in iTorque. I wasn't sure if that would work anyway once it was ported to the iPad anyway so I am getting stumped. I tried setting the NumBox container to inactive but it still blocks the buttonCtrl from recieving input. I also tried making the levelButton a first responder, but had the same effect. I look forward to hearing your guys suggestions.
About the author
Founder and CEO of Blackstaff Studios. Our focus is to make fun and simple games and software for the everyday person. Currently working on a project for the iOS platform using iTorque 2D
#2
This image shows the layout that I have. The dark grey is the level1SelectButton, the lite grey is the NumBox, and the 1 is the internal number image. I can't set these layers as invisible as the user would need to see the number on the button.
The idea is that the button will show the level number on it when the button is active and when it is inactive it will display a button like this.
The two options I have figured out is to either create a seperate graphic file for each button but that would require an extra file for each level just to have the only difference be the number printed on it.
The second option I have found is to set the command of the NumBox and the actual number bitmap ctrl to
Command = "level1SelectButton.performClick();";
I am currently going with the second option though I have two problems with it. Since iTorque has a round about way of using the mouse while programming on a PC I have to make both NumBox and the digit to be GuiBitmapButtonCtrls since the exsisting GuiChunkedBitmapCtrl doesn't have the option to useMouseEvents. The other problem I have is that doing it this way doesn't envoke the depressed button look to the level1SelectButton image like I would like.
So ideally I would like to have the NumBox and the Digit be able to ignore the mouse press and fall through to the next layer.
06/24/2012 (12:22 am)
Thanks for the feedback, though that doesn't seem like what I am looking for. Forgive the roughness of the images here, but this gives a visual of what I am looking to do and the problem that I am having.This image shows the layout that I have. The dark grey is the level1SelectButton, the lite grey is the NumBox, and the 1 is the internal number image. I can't set these layers as invisible as the user would need to see the number on the button.
The idea is that the button will show the level number on it when the button is active and when it is inactive it will display a button like this.
The two options I have figured out is to either create a seperate graphic file for each button but that would require an extra file for each level just to have the only difference be the number printed on it.
The second option I have found is to set the command of the NumBox and the actual number bitmap ctrl to
Command = "level1SelectButton.performClick();";
I am currently going with the second option though I have two problems with it. Since iTorque has a round about way of using the mouse while programming on a PC I have to make both NumBox and the digit to be GuiBitmapButtonCtrls since the exsisting GuiChunkedBitmapCtrl doesn't have the option to useMouseEvents. The other problem I have is that doing it this way doesn't envoke the depressed button look to the level1SelectButton image like I would like.
So ideally I would like to have the NumBox and the Digit be able to ignore the mouse press and fall through to the next layer.
#3
06/24/2012 (12:24 am)
Sorry double posted. :) 
Torque Owner Jean-louis Amadi
Game Alchemy Entertainment
A bit as this:
%guiContent = new GuiControl(levelSelectGui)//Global Container
{
.......
new GuiControl(level01SelectGui)//Level01 Container
new GuiChunkedBitmapCtrl(backgroundImage)//Layer 01 -->; End of the stack.
{
......
};
new GuiBitmapButtonCtrl(level1SelectButton)//Layer 02
{
........
};
new GuiChunkedBitmapCtrl(level1NumBox)//Layer 03
{
...........
};
new GuiChunkedBitmapCtrl()//Layer 03 --->; Start of the stack
{
.........
};
};
};
This is just an idea, check if it match with your logic of menu ;)