Adapt UI for smaller screens #1608
Conversation
emilk
added
🕸️ web
crates/re_ui/src/lib.rs
Outdated
|
|
||
| /// Is this a small-screen device? | ||
| pub fn is_mobile(ctx: &egui::Context) -> bool { | ||
| ctx.screen_rect().width() < 500.0 |
There was a problem hiding this comment.
For the moment the definition of is_mobile isn't great here and used only as "is this a narrow screen"... which completely ignores using mobile in landscape which can be very wide!
This opens up the question what the semantics of this really are. It is used for "this is a narrow screen", but one would expect is_mobile to be also about different controls, bigger buttons etc.
There was a problem hiding this comment.
Yeah I agree, it was badly named. I removed it.
It makes sense to have different limits for different parts of the UI anyway. We need to support a range of devices, not just "mobile" and "desktop".
|
|
||
| ui.allocate_rect(time_range_rect, egui::Sense::hover()); | ||
| } | ||
| if ui.max_rect().width() < 600.0 { |
There was a problem hiding this comment.
consider using is_mobile (or is_portrait_mode?) as established in re_ui. It's nice to have a hard size threshold in a single place, this is already a different width here and further below
There was a problem hiding this comment.
We need to support a range of devices, not just "mobile" and "desktop", so it makes sense to have different limits for different parts of the UI. This limit (600px) is very much specific for the time panel.
| ctx.rec_cfg | ||
| .time_ctrl | ||
| .time_control_ui(ctx.re_ui, ctx.log_db.times_per_timeline(), ui); | ||
| if ui.max_rect().width() < 600.0 { |
There was a problem hiding this comment.
nit: most of this stuff could still be in time_control_ui.rs. This mod.rs is a bit crowded.
There was a problem hiding this comment.
Not easily. The "draggable timeline" element of it is not at all part of time_control_ui.rs at the moment.
Some low-hanging fruit to make the UI more usable on small screens (e.g. mobile web).
Future work:
Checklist