Comments (4)
There are two scenarios we want to cover:
A) Setting the offset before layout
B) Setting the offset during or after layout
A) Setting the offset before layout
This could be solved with extending the ScrollArea
builder like this:
ScrollArea::auto_sized().set_center_offset(500.0).show(...)
where set_center_offset(500)
would scroll so that the center of the scroll area focuses 500 points down in the contents.
The downside with this is that one needs to anticipate how many points we want the offset to be ahead of time, which only works for trivial content (e.g. rows of single-line labels).
This should be fairly easy to implement
B) Setting the offset during or after layout
Dear ImGui has a very useful SetScrollHere()
function that you can call from within the layout. This will signal the surrounding scroll area to scroll down to that line the next frame.
I think this could be accomplished by something like this:
egui::ScrollArea::auto_sized().show(ui, |ui| {
for (i, line) in my_text.iter().enumerate() {
if i == selected_line {
ui.scroll_to_here();
}
ui.label(line);
}
});
scroll_to_here
would set a scroll_offset: Option<f32>
in struct FrameState
in Context
. The scroll area logic would look for that after doing the layout, and store in its own State
and use the next frame. The implementation becomes a bit hairy perhaps, but it would be very convenient for the user. In particular, one could call scroll_to_here
on any ui
deep down far away from any surrounding ScrollArea
, and it would still work.
Other considerations
Sometimes one want to center on a particular line, sometimes make it the top of the layout. For centering one also needs to take into account the size of the widget one is centering on, so that we center on the center of the widget. Perhaps:
let response = ui.label(line);
if i == selected_line {
response.scroll_to_me(Align::CENTER);
}
Having it part of Response
would be neat, as it contains the Rect
of the widget we want to center on.
from egui.
I'm working on an implementation for this, got the basics from B) done, and works pretty well, this design is pretty good, gets the job done, in my case, with a few lines. Just don't know the best way to achieve:
In particular, one could call scroll_to_here on any ui deep down far away from any surrounding ScrollArea, and it would still work.
Currently you need to call scroll_to_here
from the ScrollArea.content_ui
in the add_contents
callback. What do you think is the ideal way to do that?
from egui.
Currently you need to call
scroll_to_here
from theScrollArea.content_ui
in theadd_contents
callback.
Why? Do you have a branch I can look at?
from egui.
from egui.
Related Issues (20)
- `with_always_on_top` causes window to display incorrectly when window size is equal to screen size HOT 12
- Displaying a JPEG image does not work with `image` crate version higher than 0.24 HOT 2
- Using the user agents capabilities for loading images on web
- `ctx.input(|i| i.focused)` always gets `false` for the first few frames
- `with_position` method of ViewportBuilder does not seem to work on wayland
- Better tooltip size management
- Error: WinitEventLoop(NotSupported(NotSupportedError))
- `Style` feature to have label truncate by default HOT 1
- Allow returning errors from eframe app creator
- `SidePanel` frame leaks into `BottomPanel` HOT 3
- Dependency fails to build on nightly
- How to avoid the CMD window pop up when running on Windows? HOT 2
- Allow for manual placement of the canvas element
- Add function to request a repaint to WebRunner
- Improve compile times of `eframe`
- [IME] Can't input CompositionEnd only characters because of checking ccursor.index and ime_cursor.index HOT 2
- Gif Support
- Custom light & dark themes on system theme change HOT 1
- Add a User-Agent header to HTTP image loader HOT 5
- Dithering in Fragment Shader HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from egui.