I'm building a game using Incisor with two buttons, "Stop" and "Go", that act as toggle buttons. The behavior is as follows: when the "Go" button is visible, the action is stopped. Pressing "Go" starts the action, hides the "Go" button, and shows the "Stop" button in its place. However, even when the "Go" button is visible, I am only receiving the "Stop" action in the callback.
Here's the code:
class ProjectMain
{
init() {
this.goButton = nc.addButton( nc.graphicAssets.go, nc.mainScene, "Go" );
this.stopButton = nc.addButton( nc.graphicAssets.stop, nc.mainScene, "Stop" );
// initially the stop button is not visible
this.stopButton.visible = false;
// add the press callback to the buttons
this.goButton.addPressCallback( this, "onPress", ["Go"] );
this.stopButton.addPressCallback( this, "onPress", ["Stop"] );
}
onPress( event, camera, action ) {
console.log(action); // this is always Stop??
//toggle visibility
if ( "Go" == action ) {
this.stopButton.visible = true;
this.goButton.visible = false;
} else {
this.stopButton.visible = false;
this.goButton.visible = true;
}
}
}
Even when the "Go" button is visible, the callback always says "Stop" instead of "Go". Why is this happening, and how can I ensure the correct action is triggered?
I'm building a game using Incisor with two buttons, "Stop" and "Go", that act as toggle buttons. The behavior is as follows: when the "Go" button is visible, the action is stopped. Pressing "Go" starts the action, hides the "Go" button, and shows the "Stop" button in its place. However, even when the "Go" button is visible, I am only receiving the "Stop" action in the callback.
Here's the code:
class ProjectMain
{
init() {
this.goButton = nc.addButton( nc.graphicAssets.go, nc.mainScene, "Go" );
this.stopButton = nc.addButton( nc.graphicAssets.stop, nc.mainScene, "Stop" );
// initially the stop button is not visible
this.stopButton.visible = false;
// add the press callback to the buttons
this.goButton.addPressCallback( this, "onPress", ["Go"] );
this.stopButton.addPressCallback( this, "onPress", ["Stop"] );
}
onPress( event, camera, action ) {
console.log(action); // this is always Stop??
//toggle visibility
if ( "Go" == action ) {
this.stopButton.visible = true;
this.goButton.visible = false;
} else {
this.stopButton.visible = false;
this.goButton.visible = true;
}
}
}
Even when the "Go" button is visible, the callback always says "Stop" instead of "Go". Why is this happening, and how can I ensure the correct action is triggered?
Share Improve this question asked Jan 18 at 0:17 JohnJohn 111 bronze badge1 Answer
Reset to default 0The issue is that visibility doesn’t affect whether a button is active. A button can be transparent and still respond to user interactions, or vice versa. To achieve the behavior you're looking for, use the enable()
and disable()
functions. These methods will make the button both invisible and inactive. Additionally, disabling a button (or any child of SceneObject
) improves performance, as it reduces the GPU workload. Even transparent objects still require GPU resources to render, so disabling them can help optimize performance.
class ProjectMain
{
init() {
this.goButton = nc.addButton( nc.graphicAssets.go, nc.mainScene, "Go" );
this.stopButton = nc.addButton( nc.graphicAssets.stop, nc.mainScene, "Stop" );
// initially, DISABLE the stop button
this.stopButton.disable();
// add the press callback to the buttons
this.goButton.addPressCallback( this, "onPress", ["Go"] );
this.stopButton.addPressCallback( this, "onPress", ["Stop"] );
}
onPress( event, camera, action ) {
console.log(action); // expected action
//toggle DISABLED/ENABLED
if ( "Go" == action ) {
this.stopButton.enable();
this.goButton.disable();
} else {
this.stopButton.disable();
this.goButton.enable();
}
}
}