How to animate screen transitions in GTK4? (Can I vector-screenshot a widget and animate a lookalike vector graphik?)

Hi there, I’d be interested to hear tips on how to animate screen transitions in GTK4 apps.

I want to animate the transition between a list entry and its corresponding detail view: When the user selects a list entry, the animation grows this entry and fades it into the detail view. This is inspired by Tobias Bernhard’s article “Motion with Meaning”.

Video screencast and source code of my prototype:
see ticket #43 GTK4 rewrite in Gabriele’s “notorious” app project.

Questions:

  • How would you implement the animation? Do you know examples / documentation / best practices? thanks!
  • Should I animate the original widget or a lookalike copy? In my prototype, I found it easier to animate a lookalike widget in an overlay… this worked well in my experience. Is this generally a good practice? Which brings me to the next question:
  • How can I create lookalike copies of GTK4 widgets? Including complex widgets with children. As an idea, is it possible to vector-screenshot a widget and then animate the vector graphic? I found Gtk.Widget.snapshot() but I don’t see if and how I would use this function to create a lookalike.

thanks, Johannes

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.