How does the .keyPressCallback() work?

[VirtualVirgin]

I am trying to set a callback for certain key presses on a label, but I don't understand how to use it.

Here is an example:

const var TestLabel = Content.addLabel("TestLabel", 100, 100);

// key press callback
TestLabel.setKeyPressCallback(function(key)
{
	Console.print("Key Pressed: " + key);
});	

When trying key presses on the test label, the console just keeps printing random object codes for the "key":

I'm not sure how I'm supposed to filter specific keys this way.
How do I create actions based on the "esc" key for instance?

[d.healey]

@VirtualVirgin key should be event and it's an object so you need to use trace() to see its contents.

[VirtualVirgin]

@d-healey said in How does the .keyPressCallback() work?:

trace()

Thank you :)

So few more questions:

with trace() it is now printing booleans on focus status:

A) how do I get it to recognize specific keys pressed?
I tried adding this:

TestLabel.setConsumedKeyPresses(["27"]);

But I see no results in the printout ("27" is supposed be key code for "escape" in Javascript, not sure if this applies in HISE or there is a different way to reference the keys?)

B) How do I utilize the focus status in the callback?
I can't seem to figure out an "if" statement to capture the status.

[d.healey]

@VirtualVirgin I'll give you an example when I'm back at my computer. If you follow on Patreon I covered this in the snake video last week.

[d.healey]

@VirtualVirgin

Ok so you start off with this

const var Label1 = Content.getComponent("Label1");

Label1.setConsumedKeyPresses("all");

Label1.setKeyPressCallback(function(event)
{
	Console.print(trace(event));
});

Click on the label and start pressing keys, and you'll see the data that comes up for the keys you're interested in. - Notice that at this point we are consuming all keypresses.

Once you've got the data for just the keypresses you are interested in you can replace "all" with that data.

For example:

const var Label1 = Content.getComponent("Label1");

Label1.setConsumedKeyPresses({keyCode: 27});

Label1.setKeyPressCallback(function(event)
{
	if (event.isFocusChange)
	{
		// Respond to focus changes here
		Console.print("FOCUS CHANGE");
		return;
	}
	
	// If we get to here, then the escape key (27) must have been pressed
	Console.print("ESC PRESSED!!!");
	
});

[VirtualVirgin]

@d-healey Ok, I'm getting it! :)
A couple further questions I have about it though:

A) the format here

Label1.setConsumedKeyPresses({keyCode: 27});

The parameters in curly brackets, that is not a key : value pair I think but is it JSON?

B) When I click on the label the console will print:

Interface: Key Pressed: {
  "isFocusChange": true,
  "hasFocus": false

and when I click off the label it will print:

Interface: Key Pressed: {
  "isFocusChange": true,
  "hasFocus": true

That "hasFocus" seems reversed. Is that a bug, or do I not understand the logic of it?

[d.healey]

@VirtualVirgin said in How does the .keyPressCallback() work?:

The parameters in curly brackets, that is not a key : value pair I think but is it JSON?

JSON is made up of key/value pairs, so yes it's a JSON object with a key value pair :)

@VirtualVirgin said in How does the .keyPressCallback() work?:

That "hasFocus" seems reversed. Is that a bug, or do I not understand the logic of it?

Yeah seems inverted to me too - there are a few things in HISE like that.

[VirtualVirgin]

@d-healey Trying to set multiples and not getting the syntax:

label.setConsumedKeyPresses({keyCode: 27}, {keyCode: 13});

I thought that would do it.

This obviously works, but seems too redundant:

label.setConsumedKeyPresses({keyCode: 13});				
label.setConsumedKeyPresses({keyCode: 27});

Actually, that doesn't do it either, as the 2nd one (27) overwrites the first one (13).

[d.healey]

@VirtualVirgin You can only pass a single parameter to the function. To pass multiple values you place them in an array:
Label1.setConsumedKeyPresses([{keyCode: 27}, {keyCode: 13}]);