Lemur button with scaled icon - click handler bug

I think I may have found a bug in Lemur (or I’m doing something wrong). When a button has an IconComponent set against it that is scaled it responds to clicks outside the button’s rendered area.

A minimal example

public class LemurTest extends SimpleApplication{

    @Override
    public void simpleInitApp(){
        GuiGlobals.initialize(this);
        BaseStyles.loadGlassStyle();
        GuiGlobals.getInstance().getStyles().setDefaultStyle("glass");

        Container myWindow = new Container();
        guiNode.attachChild(myWindow);
        myWindow.setLocalTranslation(300, 300, 0);

        Button addButton = new Button("");
        IconComponent addIcon = new IconComponent("/Textures/plus.png");
        addButton.setIcon(addIcon);
        addButton.addClickCommands(source -> {
            System.out.println("add clicked");
        });
        addIcon.setIconScale(0.5f); //<--- this causes the behaviour
        myWindow.addChild(addButton);
    }

    public static void main(String[] args){
        LemurTest app = new LemurTest();
        app.start();
    }
}

This application looks like this

But the + button responds to clicks in this area

Where responds to clicks means both the “add clicked” ending up in the console and the click animation playing.

Now that I know this is what is causing my problems I can stop scaling my icons like this, but I wanted to report it

I think the Lemur demo has a page with buttons and scaled icons. Can you confirm it it does/doesn’t also show the problem?

No, it doesn’t do it in that one. But the bug only seems to occur when the icon is scaled smaller, whereas in that example it’s scaled larger (And when I tried tinkering with it, the layout it’s in forces the button to remain large even when I change the scaling to be 0.5f)

However to ensure there was no contamination from my project I did copy paste my example into it and used the pre existing pngs from the demo and that has the same behaviour

public class LemurTest extends SimpleApplication{

    @Override
    public void simpleInitApp(){
        GuiGlobals.initialize(this);
        BaseStyles.loadGlassStyle();
        GuiGlobals.getInstance().getStyles().setDefaultStyle("glass");

        Container myWindow = new Container();
        guiNode.attachChild(myWindow);
        myWindow.setLocalTranslation(300, 300, 0);

        Button addButton = new Button("");
        IconComponent addIcon = new IconComponent("test64.png");
        addButton.setIcon(addIcon);
        addButton.addClickCommands(new Command<Button>(){
            @Override
            public void execute(Button source){
                System.out.println("Clicked");
            }
        });
        addIcon.setIconScale(0.5f); //<--- this causes the behaviour
        myWindow.addChild(addButton);
    }

    public static void main(String[] args){
        LemurTest app = new LemurTest();
        app.start();
    }
}

What happens if you set the icon scale before adding it to the button?

Thanks for reporting the issue. I’ve looked at the code and can’t understand why it’s happening. By my reading, anything affecting the click zone should also affect the size of the background/border… so it’s very strange indeed.

Yes! That’s it! Moving the setIconScale to be above the addButton.setIcon(addIcon) makes the problem go away

Ok, cool… it’s still a problem but now it’s an entirely different kind of problem. :slight_smile:

…and things make sense again.

Edit: and for the record, I believe it’s an edge case where invalidate() on a component that was changed after being added to the stack (the button) but before the button is actually visible enters into some kind of edge case.

…I suspect setting the scale after the button was displayed will probably also work.

Edit 2: but note that’s just a guess without having looked at the code again.

1 Like

Thanks for diagnosing! Moving a line is a much easier work around than rescaling the pngs

1 Like