-
Notifications
You must be signed in to change notification settings - Fork 1.9k
Description
Is your feature request related to a problem? Please describe.
Currently, egui
's CornerRadius
only supports standard circular corners. This is sufficient for many UIs, but it limits the ability to create more modern or stylized aesthetics. For example, "squircles" (superellipses) are increasingly common in UI design (e.g., on Apple platforms) and offer a visually softer and more continuous shape than a simple circle. Developers who want to achieve these shapes currently have to implement custom drawing logic, which is complex and doesn't integrate seamlessly with standard widgets like Button
.
Describe the solution you'd like
I propose adding support for superelliptical corners, following the model of the CSS corner-shape
property. This would provide developers with much greater control over the visual style of their widgets.
My suggestion is to introduce a new CornerShape
enum that could be applied to widgets. For instance, the Button
widget could be modified like this:
// In crates/egui/src/widgets/button.rs
pub struct Button<'a> {
// ... existing fields
corner_shape: Option<CornerShape>,
}
The CornerShape
enum itself could be defined as:
pub enum CornerShape {
/// Standard circular corner (current behavior)
Round,
/// A superellipse with a given exponent.
/// superellipse(1.0) is equivalent to Round.
/// superellipse(2.0) is a squircle.
/// superellipse(0.0) is a bevel.
/// superellipse(infinity) is a square.
Superellipse(f32),
}
This could also be integrated into the existing CornerRadius
or epaint::Shape
system to make it universally available for all relevant widgets.
This change would be aligned with web standards, where superellipse(1)
is equivalent to the default rounded corner.[2] This would make the new feature a non-breaking, backward-compatible addition.
Describe alternatives you've considered
The primary alternative is for developers to create their own custom widgets with manually drawn paths using a Painter
. While this is possible, it is not ideal because:
- It requires a lot of boilerplate code for a common styling need.
- It's difficult to ensure it integrates correctly with all of
egui
's features (e.g., borders, shadows, interactions). - It makes it harder for the community to share a consistent styling language.
By building this into the core library, egui
would become much more flexible and powerful out-of-the-box.
Additional context
Here are the web standard documents for reference:
corner-shape
: https://developer.mozilla.org/en-US/docs/Web/CSS/corner-shapesuperellipse()
: https://developer.mozilla.org/en-US/docs/Web/CSS/superellipse
Relevant source code files:
corner_radius_f32.rs
: https://github.com/emilk/egui/blob/main/crates/epaint/src/corner_radius_f32.rsbutton.rs
: https://github.com/emilk/egui/blob/main/crates/egui/src/widgets/button.rs#L52
Adding this feature would significantly enhance egui
's capability for modern UI design and custom styling. Thank you for considering it.