Search code examples
c#wpfxamlgifrive

How can I use Rive animations in a WPF / XAML project?


I have a *.rive file and I want to use that in my WPF app like a loading spinner.

There is any way to use rive file in WPF using Image, Media Element etc.

Do I need to convert it as gif?


Solution

  • Short answer: You cannot

    • Rive is not just an animation tool, but an animation framework that requires a specially written runtime for different kinds of hosts.
    • Rive's documentation says they only have first-party support for:
      • The web (and a first-party React wrapper).
      • iOS, Android, Flutter, Tizen
      • React Native
      • "C++"
    • Note the lack of WPF, XAML, WinUI, UWP, Jupiter, Silverlight, WinForms, etc.
      • Microsoft's desktop developer story in 2021 sure is fun, isn't it?
        • MS hasn't had a clear and consistent desktop story since Windows 7, it's depressing, and still awful.

    I note that "C++" isn't a platform, just a language, so it's odd that they describe it like that. Anyway, their C++ runtime ships with a renderer for Skia, which isn't of much use

    Long answer: You can, if you want to put the effort in

    1. Clone and build their C++ runtime.
    2. Replace the Skia renderer with a new renderer of your own creation that renders to WPF somehow.
      • You can host Skia within WPF, but it's an opaque surface: the structure and contents of the Rive animation wouldn't be rendered directly by WPF which would introduce inefficiencies.
      • Also, I think WPF is still stuck on DirectX 9, and there might be functionality in Rive that would benefit from being on DX12.
    3. And the rest is an exercise for the reader.