emilk / egui

egui: an easy-to-use immediate mode GUI in Rust that runs on both web and native
https://www.egui.rs/
Apache License 2.0
22.44k stars 1.6k forks source link

Rotation for UI elements (widgets to layouts) #2054

Open targrub opened 2 years ago

targrub commented 2 years ago

Is your feature request related to a problem? Please describe. I want to be able to specify that a UI elements should shown in a rotation of 90 degree increments. To be able to show text or images upside-down, or 4 players seated around a table (imagine an app on a tablet supporting four card players).

Could be a simple field in a styling data structure

enum RotationEnum {
    Normal,
    Right90,
    Rotated180,
    Left90,
}

There doesn't appear to be a way to display UI elements in any way other than right-side up, so if I have an image, like a playing card (which is currently a RetainedImage), that I want rotated, I would have to maintain 4 versions of it. And if I want text to be rotated as well, there isn't a way to produce it (other than pre-rendering to an image without benefit of any egui features, and even then, only to a known rotation).

Current Issues which are more specific, but may be solved by a solution of this issue. https://github.com/emilk/egui/issues/1646 https://github.com/emilk/egui/issues/1279

Describe the solution you'd like

I want to be able to set a style parameter on a UI element to have it treated as rotated some increment of 90 degrees. This could include entire panels down to individual widgets.

Describe alternatives you've considered

I could have four versions of each playing card, or render each card to four images, but I don't see a way to do text or any other layout functions in a rotated way.

Additional context

xTibor commented 2 years ago

And if I want text to be rotated as well, there isn't a way to produce it

You can render rotated text, TextShape has an angle field. However speaking from experience it's rather painful to use.

Telzhaak commented 2 years ago

@xTibor Would you mind sharing an example? Since the angle field is only directly available on the TextShape, and TextShape requiring a reference to the current galley to set up, it is indeed painful to use

xTibor commented 2 years ago

Example as a widget: https://github.com/xTibor/egui_extras_xt/blob/838692151ef0e63c793c6589e91bfb643dc4d544/egui_extras_xt/src/ui/rotated_label.rs#L25-L52

Example as a drawing primitive: https://github.com/xTibor/egui_extras_xt/blob/838692151ef0e63c793c6589e91bfb643dc4d544/egui_extras_xt/src/common.rs#L357-L398