-
-
Notifications
You must be signed in to change notification settings - Fork 3.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add border radius to UI nodes (adopted) #12500
Conversation
I think |
From previous conversation with @viridia about the precursor:
|
I don't want to delay this unnecessarily, but here are my initial thoughts:
|
Assuming that you can get the rendering folks to sign off on the extra overhead involved in adding additional vertex params to UI node rendering, I would support this PR. It doesn't do everything I need, but a lot of people have wanted this for a long time, and as mentioned, I can always write custom shaders to fill the gaps. What would be helpful, I think, is if we could post some actual perf data showing the impact. I'm not so familiar on how to do this, but I know that for my previous PR @cart posted some numbers. |
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just a reflection comment.
Co-authored-by: Zachary Harrold <[email protected]>
Co-authored-by: Pablo Reinhardt <[email protected]>
Awesome, merging now: we can refine this more before 0.14 if issues come up <3 Thank you, I've wanted this feature for literally years. |
) # Objective - #12500 broke images and background colors in UI. Try examples `overflow`, `ui_scaling` or `ui_texture_atlas` ## Solution - Makes the component `BorderRadius` optional in the query, as it's not always present. Use `[0.; 4]` as border radius in the extracted node when none was found
# Objective - A new example `rounded_borders` was introduced in #12500, similar to the `borders` example, but containing labels to describe each border, leaving inconsistency between the examples. ## Solution - Update the `borders` example to be consistent with `rounded_borders`. Co-authored-by: François Mockers <[email protected]>
# Objective - #12500 added dead code to the ui shader ## Solution - Remove it
# Objective - #12500 broke rotating ui nodes, see examples `pbr` (missing "metallic" label) or `overflow_debug` (bottom right box is empty) ## Solution - Pass the untransformed node size to the shader
Objective
Implements border radius for UI nodes. Adopted from #8973, but excludes shadows.
Solution
BorderRadius
which contains a radius value for each corner of the UI node.Changelog
BorderRadius
: New component that holds the border radius values.NodeBundle
&ButtonBundle
: Added aborder_radius: BorderRadius
field.extract_uinode_borders
: Stripped down, most of the work is done in the shader now. Borders are no longer assembled from multiple rects, instead the shader uses a signed distance function to draw the border.UiVertex
: Added size, border and radius fields.UiPipeline
: Added three vertex attributes to the vertex buffer layout, to accept the UI node's size, border thickness and border radius.button
example, and arounded_borders
example.