How do I realize mouseenter and mouseleave events?

I have many instances of object with states of "default" and "highlight" and I need to change states of exact instance when mouse cursor enters its area and leave it.

I do not want to check it every tick, but when event triggers.

I tried multiple approaches and cant do it "right" and without JS-code. Im a poor programmer and cannot understand how JS-code works in Construct3 =\</p>

It's easy to do with events running on every tick. If you worry about the performance, test it, I'm sure it will be fine.

You can use trigger once to stop running the event after activating, effectively making it a triggered condition/event.

If there are multiple object instances, I don't recommend using Trigger Once, it may work incorrectly. Besides, the condition will still be evaluated on every tick, so it won't give any performance increase.

All trigger conditions are evaluated constantly aren't they?

This shouldn't happen if you organize the events correctly. Try this:

On Every tick: Button Set frame to 0

(sub-event)
.... Mouse over Button : Button Set frame to 1

Same way - on every tick set text to its default position for all buttons.

If mouse is over the button - offset text position.

Utilize a very simple statemachine.

wackytoaster.at/parachute/buttonstatemachine.c3p

State machine is nice... but it check ALL objects in family EVERY frame!

Thats doesnt feel right.

Don't worry about it, it is right.

You see, mouseenter is an event that is triggered when the mouse first enters an object. How do you know if the mouse just entered an object? It has to "not" be on the object before, and then once it is over the object, the trigger is fired. How do you check if the mouse is (not) over the object? You ask, every tick, "Is mouse over object". So while yes, the mouseenter event is only fired once, it still has to evaluate the mouse position every tick to check if it is or isn't over the object.

It's similar to constructs "On collision" which is a trigger condition, but you only can know that two objects collide if you check for it every tick. So "On collision" will actually still require collision checks every tick, but the trigger is only called once.

Unless you are talking thousands of buttons you need to check every tick, this will not be an issue even on mobiles.

Sprites are not dom elements so they can't have js events such as mouseenter added to them. But either way to logic is the same: all the sprites would need to be checked to see if the mouse is overlapping them every frame, unless there is some spatial partitioning done behind the scenes.

Anyways, simpler is often better (and faster) with events. Like others have stated you can do this which will will access all the sprites twice per frame. You'll run into other performance issues with a high number of instances in other ways before this is an issue.

every tick -> sprite: set highlight to false
mouse over sprite -> sprite: set highlight to true

var prevUid=-1

sprite: pick by uid prevUID
-- set highlight to false
-- set prevUid to -1

mouse over sprite
-- sprite: set highlight to true
-- set prevUid to sprite.uid