react-nativelayoutjsxshapes

How to draw Any kind of Shape in React Native


I m new to react-native. and I want to design the basketball court. and every part of this layout will be clickable independently.

I m just tired of this. Please help me out if anyone knows how to solve this. every effort will be appreciated.

here is the example image


Solution

  • You can draw these kinds of shapes with SVG format with a design tool (like Adobe Illustrator, Inkscape etc.), then you can import your SVG to your react-native project using react-native-svg library. You can show SVG directly, or you can convert your SVG file as react-native-svg component with SVGR Playground. I suggest you convert your SVG to a component if you want control over your SVG (for ability to change colors and sizes etc.).