When drawing the border of a button it's done so via nk_stroke_rect(). The problem with this is when a line is stroked, half of the width of the line is on one side, and the other half is on the other side. In the case of a button, this results in half of the border being drawn outside the bounds of the button. This commit pulls in the border rectangle by half the border width before performing the stroke so as to avoid any overflow.
The practical issue with this is clipping against the parent. Consider the layout below:
With this code, the left side of the button is clipped against the parent window, but because half of the border is overflowing the button's bounds, it's resulting in one pixel being clipped. I've set the border to 2 pixels to demonstrate:
You can see that the left border is thinner compared to the others. With the change in this PR it now looks like this which looks a lot cleaner and professional:
Note that this change will result in slightly different visual output to previous versions. I'd be happy to to add a flag somewhere to explicitly enable this particular change if that's preferable. Either way, in my opinion there needs to be some way to control this behavior, be it by default or via flag, because in my mind drawing outside the bounds of a control should be considered very bad practice.
When drawing the border of a button it's done so via
nk_stroke_rect()
. The problem with this is when a line is stroked, half of the width of the line is on one side, and the other half is on the other side. In the case of a button, this results in half of the border being drawn outside the bounds of the button. This commit pulls in the border rectangle by half the border width before performing the stroke so as to avoid any overflow.The practical issue with this is clipping against the parent. Consider the layout below:
With this code, the left side of the button is clipped against the parent window, but because half of the border is overflowing the button's bounds, it's resulting in one pixel being clipped. I've set the border to 2 pixels to demonstrate:![image](https://github.com/Immediate-Mode-UI/Nuklear/assets/1232553/b96138a7-9fc9-4931-bed0-662fccaddb59)
You can see that the left border is thinner compared to the others. With the change in this PR it now looks like this which looks a lot cleaner and professional:![image](https://github.com/Immediate-Mode-UI/Nuklear/assets/1232553/c389f454-1986-4767-a2b2-e4eb1e35db79)
Note that this change will result in slightly different visual output to previous versions. I'd be happy to to add a flag somewhere to explicitly enable this particular change if that's preferable. Either way, in my opinion there needs to be some way to control this behavior, be it by default or via flag, because in my mind drawing outside the bounds of a control should be considered very bad practice.