JButton - no visual indicator when button is in focus

[zanderson9]

when using material-ui-swing, it was noticed that there is no visual indicator to a user when a button is in focus. For example if user tabs through buttons in a window, there is no visual effect that a button received focus. Can this feature be implemented under material-ui-swing?

[vincenzopalazzo]

Hi @zanderson9,
Can you give me an example of the you effect want

[vincenzopalazzo]

Hi @zanderson9,

Do you like this effect?

[zanderson9]

Vincent, yes thank you, the effect you are suggesting is great.

[srcarter3]

Hi Vincent,
It appears that the buttons from your library, are skipped over entirely when tabbing through components.
I've attached a before and after Tab select in our previous look and feel.
This is achieved by pressing Tab until the JButton is the component in focus, or selected? I'm not sure if focus is technically the right state.
Hope the images help.

[vincenzopalazzo]

Hi @srcarter3,

Yes the effect should be this. when you effect tab the border button change color, the color default is black but in next official relaise I will add a constant into UIDefault.

I understand your problem? if I not understand your problem your use an example with jar into my project, her position is libs/file.jar

[srcarter3]

Hi Vincent,

Yes, that would be nice.
The jar that you gave my coworker, currently does not allow tabbing to select the button.
When I press tab, it skips the button entirely.
Does that make sense?

[srcarter3]

Also, would there be anyway to make the outline be around the text, not the edge of the component? It is easier to see with any color background, if the outline is "inside the button". Maybe something like the attached photo?

[vincenzopalazzo]

In material-ui-swing, in default is disabled, or you enable in all button whit button.setFocusable(true) or you change a value into UIDefaulti, whit this code
UIManager.put("Button.focusable", true);

For the border into text, is the effect don't like me, but I would like to add an effect like that of gmail, because the outline of the text knows to me of ancient, but if you want I can try to add this effect too

[srcarter3]

Okay, setting UIManager.put("Button.focusable", true); worked and now it recognizes the tabs.

One thing though, related to the "Default Button" look. The "focus" look and "default button" look is the same in your package, and they were distinctly different in the old package.
And when you gain focus of a different button, the default button looks just like any other button (loses it's outline).

I agree with you that the outline on the text looks ancient.
Maybe changing the font color then? When focused? and have the outline just for the default button?

[vincenzopalazzo]

@srcarter3,

Yes the color font, or the changing border color whit color equal button background, I will see examples.

Maybe changing the font color then? When focused? and have the outline just for the default button?

The problem is when the button is focused and the button default not have a border, right? and before this effect there was

[srcarter3]

The problem is when the button is focused and the button default not have a border, right? and before this effect there was

Yes, previously, it could be default, AND focused. Or another button could be focused, and the default button still looked like the default.

vs.

[vincenzopalazzo]

@zanderson9 I apported the more change, this is the bug, I will work on it calmly

[zanderson9]

I'd suggest we follow the guidelines from Material Design on buttons States

[lilili87222]

Yes,Swing focus is ugly，not need to create swing focus state. follow the flat and material skin.

[vincenzopalazzo]

Hello guys, thanks for your help.
I spent the morning doing tests and I changed the way to highlight the tabulated button, but I couldn't change the default button, for the moment I ask you to resolve otherwise if you have an imminent need for this effect, I can guarantee you that I will work on it but I can't guarantee a fix in the imminent future, so you can generate the focus effect with these constants in the default

UIMaganer.put("Button.focusable", false);
UIMaganer.put("Button[focus].background", MaterialColors.COSMO_BLUE);
UIMaganer.put("Button[focus].foreground", Color.DARK_GRAY);

sorry if I do not resolved your problem

[vincenzopalazzo]

Hi @zanderson9 , @srcarter3, @lilili87222

Hi @ zanderson9, @ srcarter3, @ lilili87222

My previous solution worked, yes but I hadn't calculated the click, in the click all the colors are strange, unfortunately there are too many events, like the hover that makes me jump something, but I thought of adding a line under the text to highlight a main mouse button, unfortunately the limits of my junior programmer allow me to find this solution for the moment, if you want to give me some guidelines or ideas to solve these problems I'm happy.

My problem is that I have no method to interfere with the button's life cycle, in fact I have nothing to interfere with the effect I want to give the button after the end of the action associated with the click, I only have one but it is not called as a last resort and therefore these changes are not successful

Since I never needed to highlight a button with the card, I ask you, is it also the result of another aspect and feeling that after pressing the button this remains in FOCUS? also Metal uses this type of approach and therefore for the moment I stop at this solution if it is good for you.

the constant is used to set the color of the line

UIManager.put("Button[focus].color", MaterialColors.BLACK);

I hope I have been helpful

[zanderson9]

Vincent thank you, we will give it a try. We appreciate you working toward finding the solution!

[vincenzopalazzo]

@zanderson9 I'm waiting your feedback, if the method not have a bugs, I will try Improve the graphics

[zanderson9]

@vincenzopalazzo Yes, we will test the new jar you built today and will share the feedback asap.
Thank you for your prompt responses to the issues.

[zanderson9]

verified with new test jar - looks good with the Underline effect

[vincenzopalazzo]

@zanderson9, Good, if the issue is fixed, I closing issue :)

[lilili87222]

This effect is very cool
https://camo.githubusercontent.com/d5af1ca60cb31e576c07ed996304377d48f3ba1e/68747470733a2f2f6d656469612e67697068792e636f6d2f6d656469612f3437466648593154484150335074374f7a552f67697068792e676966

I do not think you need to add a line under text,That was ugly really

[zanderson9]

@lilili87222 , could you check the link you posted in your recent Comment, please? It returns "Non-Image content-type returned" error...

[srcarter3]

I really like the underline for the focus, I think it looks good! Thank you Vincent.

[vincenzopalazzo]

Hi @srcarter3, This is the only solution for the moment, exist more event into jbutton, an example MouseHover but I want to have a better effect, maybe I'll keep working on it and try to maintain backwards compatibility with this version.

I'm glad you like my job