How to render a Dioxus UI in a texture?

[jerome-caucat]

I'm currently exploring ways to integrate Bevy with Dioxus. I’ve implemented an example that renders a Bevy scene to a texture, then displays that texture within a Dioxus UI using the native backend. You can see the implementation here: #4359.

Now, I’m looking to do the reverse: render a Dioxus UI into a texture that can be displayed in a Bevy app. What would be the best approach to achieve this?

[nicoburns]

Now, I’m looking to do the reverse: render a Dioxus UI into a texture that can be displayed in a Bevy app. What would be the best approach to achieve this?

@jerome-caucat I've put up a draft pull request (#4365) that sketches out how to do this. It doesn't attempt actual Bevy integration. Some notes:

• I am assuming that you would let Bevy setup WGPU and then use the Device and Queue from Bevy in this scenario (so you wouldn't need the WGPUContext). I am also assuming that you would do texture management.
• You would probably store the DioxusDocument and VelloRenderer in the ECS somewhere.
• You would need to integrate with Bevy's event loop and input
• I think Blitz defaults to a white background, so we may need to make some changes to allow for transparent.

Dioxus Native isn't really set up for this yet (just hasn't been something we've really worked on). So there's definitely room for improvement.

[jerome-caucat]

@nicoburns Thank you very much, with this I can start testing with Bevy.

[rectalogic]

I implemented rendering web pages using blitz into a Bevy texture here https://github.com/rectalogic/bevy_blitz

[jerome-caucat]

Thanks for sharing! I'm not yet familiar enough with Bevy to fully grasp your rendering process, but I’ll take a closer look and dig into it.

In the meantime, I pushed an example where Dioxus is rendered to a texture shared with Bevy and displayed on a quad:
#4427