I’m looking at adding some nicer UX to an application I’m working on. It can be described as such:
A vertical sizer filled with times aka generic controls (lets say panels).
This gets updated in realtime (its basically a list of items).
The update mechanism will add an item to the top and remove one from the bottom.
An animation will occur to slide down all the items (with the last disappearing and the newer one taking place at the top).
Hopefully this makes sense. Can anyone suggest any pointers for looking at creating such an animation? I think toasterbox may be an example, but I would love any other pointers anyone else has.
I'm looking at adding some nicer UX to an application I'm working on. It
can be described as such:
1. A vertical sizer filled with times aka generic controls (lets say
panels).
2. This gets updated in realtime (its basically a list of items).
3. The update mechanism will add an item to the top and remove one from
the bottom.
4. An animation will occur to slide down all the items (with the last
disappearing and the newer one taking place at the top).
Hopefully this makes sense. Can anyone suggest any pointers for looking
at creating such an animation? I think toasterbox may be an example, but
I would love any other pointers anyone else has.
I've done things like this in two basic ways, and which is best probably depends on the nature of what kind of movements the animation should use. The first is to ignore the sizer and brute-force everything by adjusting the position and size of the widgets that are being animated, making small adjustments for each step in the animation. Then when it's done just call the sizer's Layout and etc. so it can get caught up with the newly added or removed items.
The second approach is to manipulate the minsize of items to be sized, and perhaps also the size of spacer items in the sizer (to help move other items around because the spacer is changing size) for each step in the animation, and then call the sizer's Layout to actually move the items. This is a little less flexible than the brute-force method, but probably easier.
Be sure to use a timer to manage when to do each of the steps of the animation. This way the application can still process events between each step, for things like painting the widgets that have been moved and the parent can repaint the newly exposed areas.