Generating objects from extensions - Revision history

Moini at 19:56, 3 February 2023

2023-02-03T19:56:03Z

← Older revision		Revision as of 19:56, 3 February 2023
Line 1:		Line 1:
	{{~~outdated~~}}		{{Template:MovedToOtherSite\|topic=Extension development\|new_url=https://inkscape.gitlab.io/extensions/documentation/\|new_site=GitLab}}

			----

	If you need an extension to generate an object in Inkscape, there are many tools that already exist to help you. <tt>inkex.py</tt> is the most notable, as this provides the routines to insert the SVG element into the XML tree of the SVG document, for more info on these is available at [[Python modules for extensions]].		If you need an extension to generate an object in Inkscape, there are many tools that already exist to help you. <tt>inkex.py</tt> is the most notable, as this provides the routines to insert the SVG element into the XML tree of the SVG document, for more info on these is available at [[Python modules for extensions]].

Pulsar17: Mark page as outdated.

2022-03-10T21:33:38Z

Mark page as outdated.

← Older revision		Revision as of 21:33, 10 March 2022
Line 1:		Line 1:
			{{outdated}}
	If you need an extension to generate an object in Inkscape, there are many tools that already exist to help you. <tt>inkex.py</tt> is the most notable, as this provides the routines to insert the SVG element into the XML tree of the SVG document, for more info on these is available at [[Python modules for extensions]].		If you need an extension to generate an object in Inkscape, there are many tools that already exist to help you. <tt>inkex.py</tt> is the most notable, as this provides the routines to insert the SVG element into the XML tree of the SVG document, for more info on these is available at [[Python modules for extensions]].

Line 115:		Line 116:
	If in doubt about the right attribute name and format, just check a similar object in the XML viewer in Inkscape.		If in doubt about the right attribute name and format, just check a similar object in the XML viewer in Inkscape.

	===Line Segment===		===Line Segment ===

	Paths can be quite tricky to get the hang of if you don't know the meaning of the letters. Read the SVG specification for a full list.		Paths can be quite tricky to get the hang of if you don't know the meaning of the letters. Read the SVG specification for a full list.

Matyilona: Adding link to Python modules for extensions

2017-11-06T20:56:52Z

Adding link to Python modules for extensions

← Older revision		Revision as of 20:56, 6 November 2017
Line 1:		Line 1:
	If you need an extension to generate an object in Inkscape, there are many tools that already exist to help you. <tt>inkex.py</tt> is the most notable, as this provides the routines to insert the SVG element into the XML tree of the SVG document.		If you need an extension to generate an object in Inkscape, there are many tools that already exist to help you. <tt>inkex.py</tt> is the most notable, as this provides the routines to insert the SVG element into the XML tree of the SVG document, for more info on these is available at [[Python modules for extensions]].

	There is currently no universal set of tools to allow a single function to be called, because different extension have different attibutes for thir objects. For example, the barcode extension merely needs a black rectangle with no stroke, but another may need a way to set the stroke width, dashes and opacity. Thus, it is often best to write your own subroutine for generating your objects.		There is currently no universal set of tools to allow a single function to be called, because different extension have different attibutes for thir objects. For example, the barcode extension merely needs a black rectangle with no stroke, but another may need a way to set the stroke width, dashes and opacity. Thus, it is often best to write your own subroutine for generating your objects.

~suv: fix incorrect SVG stroke style property ('width' -> 'stroke-width')

2012-11-25T15:42:48Z

fix incorrect SVG stroke style property ('width' -> 'stroke-width')

← Older revision		Revision as of 15:42, 25 November 2012
Line 10:		Line 10:

	style = { 'stroke' : 'none',		style = { 'stroke' : 'none',
	'width' : '1',		'stroke-width' : '1',
	'fill' : '#000000'		'fill' : '#000000'
	}		}
Line 94:		Line 94:

	style = { 'stroke' : '#000000',		style = { 'stroke' : '#000000',
	'width' : '1',		'stroke-width' : '1',
	'fill' : 'none' }		'fill' : 'none' }
	ell_attribs = {'style':simplestyle.formatStyle(style),		ell_attribs = {'style':simplestyle.formatStyle(style),

Flor: /* Line Segment */

2010-11-02T08:54:07Z

Line Segment

← Older revision		Revision as of 08:54, 2 November 2010
Line 135:		Line 135:
	line = inkex.etree.SubElement(parent, inkex.addNS('path','svg'), line_attribs )		line = inkex.etree.SubElement(parent, inkex.addNS('path','svg'), line_attribs )
	</nowiki></pre>		</nowiki></pre>

			[[Category:Developer Documentation]]
			[[Category:Extensions]]

~suv: /* A simple example */ typo

2010-10-13T20:04:24Z

A simple example: typo

← Older revision		Revision as of 20:04, 13 October 2010
Line 4:		Line 4:

	==A simple example==		==A simple example==
	Let's look at a simple Python ~~fuunction~~ for drawing a black rectangle:		Let's look at a simple Python function for drawing a black rectangle:
	<pre>		<pre>
	#SVG element generation routine		#SVG element generation routine

Inductiveload: Created page with 'If you need an extension to generate an object in Inkscape, there are many tools that already exist to help you. `inkex.py` is the most notable, as this provides the routi...'

2009-11-06T18:55:03Z

Created page with 'If you need an extension to generate an object in Inkscape, there are many tools that already exist to help you. <tt>inkex.py</tt> is the most notable, as this provides the routi...'

New page

If you need an extension to generate an object in Inkscape, there are many tools that already exist to help you. <tt>inkex.py</tt> is the most notable, as this provides the routines to insert the SVG element into the XML tree of the SVG document.

There is currently no universal set of tools to allow a single function to be called, because different extension have different attibutes for thir objects. For example, the barcode extension merely needs a black rectangle with no stroke, but another may need a way to set the stroke width, dashes and opacity. Thus, it is often best to write your own subroutine for generating your objects.

==A simple example==
Let's look at a simple Python fuunction for drawing a black rectangle:
<pre>
#SVG element generation routine
def draw_SVG_square((w,h), (x,y), parent):

style = { 'stroke' : 'none',
'width' : '1',
'fill' : '#000000'
}

attribs = {
'style' : simplestyle.formatStyle(style),
'height' : str(h),
'width' : str(w),
'x' : str(x),
'y' : str(y)
}
circ = inkex.etree.SubElement(parent, inkex.addNS('rect','svg'), attribs )
</pre>

The first thing to notice is that all the attributes of the object are stored in a dictionary format, with everything being a string. This means you have to convert all your parameters to strings if appropriate (like the <tt>height</tt> and <tt>width</tt> attributes).

Next, all the style attributes (colours, widths, fonts, etc) are put together in SVG under <tt>style</tt>. To generate this string, there exists a helper function <tt>simplestyle.formatStyle()</tt>. You simply feed this function a dictionary of the styles you want, just like the attributes. You can then use this directly as the style attribute.

The next thing to see is how to add the element to the XML tree. <tt>inkex.py</tt> has the function to do this using the LXML parser. This needs to be given the "parent" of the object (we'll come back to this), the "type" of the object, and the attributes of the object.

The type of the object is in the <tt>svg</tt> namespace, which means it begins <tt>svg:</tt> (for a rectangle, it is <tt>svg:rect</tt>). LXML cannot parse colons, so we use the <tt>inkex.addNS</tt> to prepend the namespace.

The attributes of the object just needs to be passed the dictionary <tt>attribs</tt> we made earlier.

The "parent" of the object is the containing element. This is usually a group or a layer. This will be passed in by the calling function, and we will see it in action later.

When this function is run with the right parameters, the rectangle will be added to the SVG document.

==Getting the parent==

Finding the parent is easy: you can just pass in the current layer from the <tt>self</tt> object if you like:
<pre><nowiki>
parent = self.current_layer
draw_SVG_square((1,1), (0,0), parent)
</nowiki></pre>

This will just plonk the rectangle into the document, centred on the origin.

Alternatively, you can create a group much like any other object:
<pre><nowiki>
centre = self.view_center #Put in in the centre of the current view
grp_transform = 'translate' + str( centre )

grp_name = 'Group Name'
grp_attribs = {inkex.addNS('label','inkscape'):grp_name,
'transform':grp_transform }
grp = inkex.etree.SubElement(self.current_layer, 'g', grp_attribs)#the group to put everything in
</nowiki></pre>

By the way, any object can be assigned a name as we did there, which is often helpful when generating many objects:

<pre><nowiki>
inkex.addNS('label','inkscape') : name
</nowiki></pre>

By setting the transform as <tt>self.view_center</tt>, we made sure the origin of the group is in the centre of the current view of the document. We will come back to transforms later.

The <tt>grp</tt> object can now be used as a parent for the rectangle:
<pre><nowiki>
draw_SVG_square((1,1), (0,0), grp)
</nowiki></pre>
This will draw a 1×1 black square in the center of the view.

==Transforms==

It is easy to transform an object: just supply a string like the folllowing as the <tt>transform</tt> attribute of the element:
*<tt>trans = 'translate(10,10)'</tt>
*<tt>trans = 'translate(10,10) rotate(10)'</tt>
*<tt>trans = 'skewX(-1)'</tt>

Available commands: <tt>translate, scale, rotate, skewX, skewY, matrix</tt>. The transforms are composed in left-right order (i.e. the translate comes first in the second example).

==More Examples==

===Ellipses===

Ellipses are actually path elements, but Inkscape generates the nodes automatically if you feed it the correct attributes in the Sodipodi namespace. The vital ones are <tt>rx, ry, cx, cy</tt>.

Ellipses require some attributes in the <tt>sodipodi:</tt> namespace, so we also use the <tt>addNS()</tt> function in the attribute dictionary:

<pre><nowiki>
def draw_SVG_ellipse((rx, ry), (cx, cy), parent, start_end=0,2*pi),transform='' ):

style = { 'stroke' : '#000000',
'width' : '1',
'fill' : 'none' }
ell_attribs = {'style':simplestyle.formatStyle(style),
inkex.addNS('cx','sodipodi') :str(cx),
inkex.addNS('cy','sodipodi') :str(cy),
inkex.addNS('rx','sodipodi') :str(rx),
inkex.addNS('ry','sodipodi') :str(ry),
inkex.addNS('start','sodipodi') :str(start_end[0]),
inkex.addNS('end','sodipodi') :str(start_end[1]),
inkex.addNS('open','sodipodi') :'true', #all ellipse sectors we will draw are open
inkex.addNS('type','sodipodi') :'arc',
'transform' :transform

}
ell = inkex.etree.SubElement(parent, inkex.addNS('path','svg'), ell_attribs )
</nowiki></pre>

This will draw an open arc, with a black stroke of width 1 and no fill. The transform here can be passed in from outside.

If in doubt about the right attribute name and format, just check a similar object in the XML viewer in Inkscape.

===Line Segment===

Paths can be quite tricky to get the hang of if you don't know the meaning of the letters. Read the SVG specification for a full list.

Here, the style information has been passed in from outside the function.

<pre><nowiki>
#draw an SVG line segment between the given (raw) points
def draw_SVG_line( (x1, y1), (x2, y2), style, name, parent):
line_style = { 'stroke': style.l_col,
'stroke-width':str(style.l_th),
'fill': style.l_fill
}

line_attribs = {'style' : simplestyle.formatStyle(line_style),
inkex.addNS('label','inkscape') : name,
'd' : 'M '+str(x1)+','+str(y1)+' L '+str(x2)+','+str(y2)}

line = inkex.etree.SubElement(parent, inkex.addNS('path','svg'), line_attribs )
</nowiki></pre>