SVG resizable frame

Discuss SVG code, accessible via the XML Editor.
devdri

SVG resizable frame

Postby devdri » Tue Jun 30, 2009 5:51 am

Hello,

I have been using Inkscape for webdesign and creating a box frame involved cutting the design in 8 pngs (top, top-left, ...) for all directions plus the inner color. This way complicated frame shapes couldn't be achieved, but the overall result was good for web.
Now using svg images becomes more popular and to make the box frame resolution independent, one would cut the svg design to 8 svgs(!). That would not be great, because svg renderers may not be pixel perfect and there could be glitches between the images. Nicest solution would be to have it all in one svg containing some additional metadata. This will probably not be possible on current web browsers, but...
I am creating some software, that would need skinning and the skins will probably be very artistic. I am not tied to web, as the program will be standalone.
What I want to achieve is being able to automatically modify svg from:
Image
to:
Image

One solution is to add metadata to each path node, associating it with up/down, left/right.
It would be easy normally, as svg is xml and I can add metadata to any object, but path nodes are just text instead of xml tags.
Another solution would be to associate nodes with corners based on their position, but that would be limiting and may be hard to predict.

Image

Vector graphics is clearly future and I cannot believe I couldn't find any info on this subject. Please share your thoughts on this. How could fully-svg design enable resizing to fit the contents?

User avatar
hellocatfood
Posts: 193
Joined: Fri Aug 29, 2008 8:49 pm
Contact:

Re: SVG resizable frame

Postby hellocatfood » Tue Jun 30, 2009 6:13 am

devdri wrote:How could fully-svg design enable resizing to fit the contents?


I'm no expert coder, but I know javascript can be used well with SVG. Someone's already created an Javascript plugin to add slideshow features to an SVG file http://wiki.inkscape.org/wiki/index.php/Inkview. It has support for slide transitions, and other basic animations.
I'm on The Web | Flickr | tumblr

hanoixan
Posts: 1
Joined: Sat Jan 01, 2011 6:32 am

Re: SVG resizable frame

Postby hanoixan » Sat Jan 01, 2011 7:40 am

Devdri, I found your post while searching for the same solution. I too am building an app where I would like to encode resizing metadata into the SVG for later parsing, and make resize by sliding the corners in place, instead of scaling. Can you tell me a bit about your solution for this, if you found one?

Thanks,
Sean


Return to “SVG / XML Code”