Exporting designs in apps as vector (XML/svg) file?

问题

My ultimate goal is to export designs created in mobile apps as vector graphics. Say I have a list of points of corners of shapes and the respective color that goes inside each shape and this design is being displayed on a mobile app (iOS and Android because cocos2d-x is being used). Is it possible to convert this information into a vector file (SVG file which is essentially an XML file)?

回答1:

SVG contains a path element that stores the lines that make up a shape's path. The d attribute stores a path string, and the style attributes stores the path's styling, such as stroke and fill. To export a shape to SVG there are several things you should care about:

The size of the SVG in pixels (the width and height attributes)

Example:<svg width='640px' height='640px'
The size of the shape in pixels (the viewBox attributes)

Example:viewBox='0 0 100 100'
The color used to stroke the shape

Example:style='stroke:red;' or style='stroke:none;'
The color used to fill each shape

Example:style='fill:blue;' or style='fill:none;'
The shape of the path

Example:d='M10 10L20 20 L30 10Z'
- Each path is divided into commands. The M command moves the pen, the L command draws to a new position, and the Z command closes the shape.

Example SVG file:

<svg width='640px' height='640px' viewBox='0 0 100 100' 
  xmlns='http://www.w3.org/2000/svg'>
     <path style='stroke:red;fill:none'  d='M10 10L20 20 L30 10Z'/>
</svg>

来源：https://stackoverflow.com/questions/36097569/exporting-designs-in-apps-as-vector-xml-svg-file

标签

mobile

svg

vector

shapes