'How to center a react native svg with flex?

How would I use flex to center an svg within a View in react native?
Here is an expo snack that centers an svg by its origin parameters.

Do I need to hardcode origin parameters, place the svg in a View with a flex property, and then export it as a component? Does svg care about flex?

A related but distinct SO question:
How to center an SVG in React Native? -> From this answer, should I convert my shape-based svg into a path xml tag? That doesn't seem like the right answer here.

I would rather define svgs inline than import svg files.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source