Allow for ui scaling #2808

TheNeikos · 2021-09-11T20:54:51Z

Objective

Allow users to change the scaling of the UI

Solution

The user can modify the UiScale struct to change the scaling at runtime. This multiplies the Px values by the scale given, while not touching any others.
The example showcases how this even allows for fluid transitions

Here's how the example looks like:
https://user-images.githubusercontent.com/1631166/132979069-044161a9-8e85-45ab-9e93-fcf8e3852c2b.mp4

crates/bevy_ui/src/widget/text.rs

examples/ui/scaling.rs

examples/README.md

MinerSebas

Accidentally pressed approve

DJMcNab

This looks like a handy small addition, thanks!

Overall I don't see anything technically wrong with this implementation, just a few misc thoughts

examples/ui/scaling.rs

DJMcNab · 2021-09-11T21:37:39Z

crates/bevy_ui/src/lib.rs

@@ -39,9 +41,33 @@ pub enum UiSystem {
    Focus,
 }

+#[derive(Debug)]
+/// The current scale of the UI for all windows


Is there a conceptual reason this should be global instead of per-UI camera?

For example, I've needed a custom scale for different vscode windows because of different monitor scaling requirements - e.g. for presenting on one with notes on the other. Although I appreciate that is slightly different because those windows are different processes.

Not a conceptual one no. So far ui-handling is not done per-window though, so I didn't go as far as understand how multiple window bevy works technically.

DJMcNab · 2021-09-11T21:40:04Z

crates/bevy_ui/src/lib.rs

+///
+/// ## Note
+/// This is purely about the logical scale, and can
+/// be considered like a zoom


Hmm, I'm not if it's quite a zoom - in my mind it's closer to a shrinking of the logical UI window size. For me, a zoom suggests showing only part of the logical window, which this isn't intended for.

As a dev I feel it more intuitive if one considers a zoom, since it effectively multiplies the size of the pixels shown just like a zoom would.

This feels better described to me as "setting UI scale", rather than a true zoom.

So, should I remove the note?

DJMcNab · 2021-09-11T21:40:37Z

crates/bevy_ui/src/lib.rs

+    ///
+    /// # Example
+    ///
+    /// A scale of `2.` will make every pixel size twice as large.


I think this whole 'example' section is potentially superfluous

Potentially, I prefer to make it clear though that one needs to put in 2. instead of 0.5 for twice the scale.

examples/ui/scaling.rs

TheNeikos · 2021-09-12T07:36:45Z

There's some build failures that do not come from my changes as far as I am aware: https://github.com/bevyengine/bevy/runs/3578487123#step:6:223

DJMcNab · 2021-09-12T07:44:53Z

Hmm, yeah

That's a new nightly check which excludes derived clones and debugs from counting as reading fields

TheNeikos · 2021-09-12T08:12:19Z

I've added a video to the description

Co-authored-by: Daniel McNab <36049421+DJMcNab@users.noreply.github.com>

TheNeikos · 2021-09-13T10:53:50Z

I have rebased on e74f7a7 so it should build again.

Is any of the open discussions blocking? Otherwise I'd suggest to transform them into issues/discussions.

alice-i-cecile · 2022-07-04T13:32:09Z

@TheNeikos, sorry for letting this languish for so long. If you can rebase I'll wrangle the reviewers needed to get this merged.

TheNeikos · 2022-07-04T13:51:47Z

Heya! Sadly I won't have the time in the foreseeable future to do this. If anyone else wants to pick it up, they are free to do so.

alice-i-cecile · 2022-07-04T14:49:37Z

Sounds good. The label is added; thanks for letting us know.

Weibye · 2022-08-27T15:11:02Z

@TheNeikos Thanks for your work! I've continued it over at #5814 so will close this :)

# Objective - Allow users to change the scaling of the UI - Adopted from #2808 ## Solution - This is an accessibility feature for fixed-size UI elements, allowing the developer to expose a range of UI scales for the player to set a scale that works for their needs. > - The user can modify the UiScale struct to change the scaling at runtime. This multiplies the Px values by the scale given, while not touching any others. > - The example showcases how this even allows for fluid transitions > Here's how the example looks like: https://user-images.githubusercontent.com/1631166/132979069-044161a9-8e85-45ab-9e93-fcf8e3852c2b.mp4 --- ## Changelog - Added a `UiScale` which can be used to scale all of UI Co-authored-by: Andreas Weibye <13300393+Weibye@users.noreply.github.com> Co-authored-by: Carter Anderson <mcanders1@gmail.com>

# Objective - Allow users to change the scaling of the UI - Adopted from bevyengine#2808 ## Solution - This is an accessibility feature for fixed-size UI elements, allowing the developer to expose a range of UI scales for the player to set a scale that works for their needs. > - The user can modify the UiScale struct to change the scaling at runtime. This multiplies the Px values by the scale given, while not touching any others. > - The example showcases how this even allows for fluid transitions > Here's how the example looks like: https://user-images.githubusercontent.com/1631166/132979069-044161a9-8e85-45ab-9e93-fcf8e3852c2b.mp4 --- ## Changelog - Added a `UiScale` which can be used to scale all of UI Co-authored-by: Andreas Weibye <13300393+Weibye@users.noreply.github.com> Co-authored-by: Carter Anderson <mcanders1@gmail.com>

github-actions bot added the S-Needs-Triage This issue needs to be labelled label Sep 11, 2021

TheNeikos force-pushed the feature/add_ui_scaling branch from 8c71310 to caa58f9 Compare September 11, 2021 20:59

MinerSebas approved these changes Sep 11, 2021

View reviewed changes

crates/bevy_ui/src/widget/text.rs Outdated Show resolved Hide resolved

examples/ui/scaling.rs Outdated Show resolved Hide resolved

examples/ui/scaling.rs Outdated Show resolved Hide resolved

examples/README.md Show resolved Hide resolved

MinerSebas suggested changes Sep 11, 2021

View reviewed changes

DJMcNab reviewed Sep 11, 2021

View reviewed changes

TheNeikos closed this Sep 12, 2021

TheNeikos reopened this Sep 12, 2021

TheNeikos and others added 6 commits September 13, 2021 12:51

Allow for ui scaling

472808e

Add ui/scaling.rs to readme

2940eda

Change the docstring for the example

143c804

Co-authored-by: Daniel McNab <36049421+DJMcNab@users.noreply.github.com>

Do not postfix the scale

50ab722

Re-order TargetScale in scaling example

c3613e4

Clarify scaling easing

2eead4b

TheNeikos force-pushed the feature/add_ui_scaling branch from eaf5f09 to 2eead4b Compare September 13, 2021 10:52

alice-i-cecile added A-UI Graphical user interfaces, styles, layouts, and widgets C-Enhancement A new feature and removed S-Needs-Triage This issue needs to be labelled labels Sep 14, 2021

alice-i-cecile added the S-Needs-Review label Sep 22, 2021

cart removed the S-Needs-Review label Dec 16, 2021

alice-i-cecile added the S-Adopt-Me The original PR author has no intent to complete this work. Pick me up! label Jul 4, 2022

Weibye mentioned this pull request Aug 27, 2022

[Merged by Bors] - Add UI scaling #5814

Closed

Weibye closed this Aug 27, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Allow for ui scaling #2808

Allow for ui scaling #2808

TheNeikos commented Sep 11, 2021 •

edited

Loading

MinerSebas left a comment

DJMcNab left a comment

DJMcNab Sep 11, 2021

TheNeikos Sep 12, 2021

DJMcNab Sep 11, 2021

TheNeikos Sep 12, 2021

alice-i-cecile Sep 14, 2021

TheNeikos Sep 15, 2021 •

edited

Loading

DJMcNab Sep 11, 2021

TheNeikos Sep 12, 2021

TheNeikos commented Sep 12, 2021 •

edited

Loading

DJMcNab commented Sep 12, 2021

TheNeikos commented Sep 12, 2021

TheNeikos commented Sep 13, 2021

alice-i-cecile commented Jul 4, 2022

TheNeikos commented Jul 4, 2022 •

edited

Loading

alice-i-cecile commented Jul 4, 2022

Weibye commented Aug 27, 2022

Allow for ui scaling #2808

Allow for ui scaling #2808

Conversation

TheNeikos commented Sep 11, 2021 • edited Loading

Objective

Solution

MinerSebas left a comment

Choose a reason for hiding this comment

DJMcNab left a comment

Choose a reason for hiding this comment

DJMcNab Sep 11, 2021

Choose a reason for hiding this comment

TheNeikos Sep 12, 2021

Choose a reason for hiding this comment

DJMcNab Sep 11, 2021

Choose a reason for hiding this comment

TheNeikos Sep 12, 2021

Choose a reason for hiding this comment

alice-i-cecile Sep 14, 2021

Choose a reason for hiding this comment

TheNeikos Sep 15, 2021 • edited Loading

Choose a reason for hiding this comment

DJMcNab Sep 11, 2021

Choose a reason for hiding this comment

TheNeikos Sep 12, 2021

Choose a reason for hiding this comment

TheNeikos commented Sep 12, 2021 • edited Loading

DJMcNab commented Sep 12, 2021

TheNeikos commented Sep 12, 2021

TheNeikos commented Sep 13, 2021

alice-i-cecile commented Jul 4, 2022

TheNeikos commented Jul 4, 2022 • edited Loading

alice-i-cecile commented Jul 4, 2022

Weibye commented Aug 27, 2022

TheNeikos commented Sep 11, 2021 •

edited

Loading

TheNeikos Sep 15, 2021 •

edited

Loading

TheNeikos commented Sep 12, 2021 •

edited

Loading

TheNeikos commented Jul 4, 2022 •

edited

Loading