Difference between revisions of "Extension GUI Reference"

From Inkscape Wiki
Jump to navigation Jump to search
Line 168: Line 168:
 
* Also for <code>description</code> type (and ''only'' for <code>description</code> type!) parameters an underscore is added to the tag name itself:<br><code><_param type="description">Localized text here.</_param></code>
 
* Also for <code>description</code> type (and ''only'' for <code>description</code> type!) parameters an underscore is added to the tag name itself:<br><code><_param type="description">Localized text here.</_param></code>
  
== INX Documentation for 1.0 ==
+
= Editing INX Parameters in 1.0 =
  
It the following sections, When you see <code>[name="value"]</code>, it means that <code>name</code> is an optional attribute. <code>att="val1"|"val2"</code> means eithe <code>"val1"</code> or <code>val2</code> are valid values for <code>att</code>. The <code>"1"</code> in <code>indent="1"</code> attributes can be changed by the indentation level you want.
+
In this section:
 +
* When an attribute is in square brackets (<code>[name="value"]</code>), it means that <code>name</code> is optional.
 +
* The 1 in <code>indent="1"</code> is the indentation level that you want.
  
=== Tags for the layout ===
+
== Tags for the layout ==
  
 
<source lang="xml">
 
<source lang="xml">
<label [indent="1"] [appearance="header"|"url"]>Some text</label>
+
<label [indent="1"] [appearance="header"]>Some text</label>
 +
<label [indent="1"] [appearance="url"]>http://some/url</label>
 
<image>some/inx/relative/path/to/img.svg</image>
 
<image>some/inx/relative/path/to/img.svg</image>
 
<spacer/>
 
<spacer/>
Line 183: Line 186:
 
</source>
 
</source>
  
=== Tags for the parameters ===
+
== Tags for the parameters ==
  
The <code>name</code> attribute of tag <code><param></code> means the name of the argument (<code>--name=</code>) your command will get. Defaults are set to the last used value, the defaults in the inx file are for the first use.
+
* The <code>name</code> attribute of tag <code><param></code> means the name of the argument (<code>--name=</code>) your command will get.
 +
* Defaults values are set to the last used value, the defaults values in the inx file are for the first use.
  
==== Tab view of pages ====
+
=== Tab view of pages ===
 
These can help with layout.
 
These can help with layout.
* You get the selected <code><page></code> as an argument to your extension.
+
* You get the value of the selected <code><page name></code> attribute as an argument to your extension.
* You get the <code><param></code> arguments of last <code><page></code> containing it. You better give them different parameter names.
+
* For a <code><param></code> used on multiple pages, you get the value of the <code><param></code> from the last <code><page></code>.
 +
** You better give them different parameter names.
  
 
<source lang="xml">
 
<source lang="xml">
Line 201: Line 206:
 
</source>
 
</source>
  
==== Checkbox. ====
+
=== Checkbox ===
  
Default's to <code>true</code>.
+
Default value is <code>true</code>.
  
 
<source lang="xml">
 
<source lang="xml">
<param type="boolean" name="varname" gui-text="label" [indent="1"]>false</param>                                             
+
<param type="bool" name="varname" gui-text="label" [indent="1"]>false</param>                                             
 
</source>  
 
</source>  
  
==== Numerical input spinner ====
+
=== Numerical input spinner ===
 
The widget has a precision of 0.1 for float.
 
The widget has a precision of 0.1 for float.
 
* With <code>appearance="full"</code> also use a full width slider.
 
* With <code>appearance="full"</code> also use a full width slider.
 
* The default <code>min</code> is "0"
 
* The default <code>min</code> is "0"
 
* The default <code>max</code> is "10"
 
* The default <code>max</code> is "10"
 +
* The default value is 0
  
 
<source lang="xml">
 
<source lang="xml">
<param type="int"  name="varname" [min="1"] [max="10"] gui-text="labal" [appearance="full"]  [indent="1"]/>
+
<param type="int"  name="varname" gui-text="labal" [min="1"] [max="10"] [appearance="full"]  [indent="1"]/>
<param type="float" name="varname" [min="0.5"] [max="5.0"] gui-text="label" [appearance="full"]  [indent="1"]/>
+
<param type="float" name="varname" gui-text="label" [min="0.5"] [max="5.0"] [appearance="full"]  [indent="1"]/>
 
</source>
 
</source>
  
==== Textbox ====
+
=== Textbox ===
 +
 
 +
The default value is the empty string and with such a value, the parameter is omited.
  
 
<source lang="xml">
 
<source lang="xml">
Line 226: Line 234:
 
</source>
 
</source>
  
==== File chooser ====
+
=== File chooser ===
 
* The attribute <code>mode</code> with a value of:
 
* The attribute <code>mode</code> with a value of:
 
** <code>"file"</code> or <code>"folder"</code> (without <code>s</code>) means to use a file chooser for 1 object.
 
** <code>"file"</code> or <code>"folder"</code> (without <code>s</code>) means to use a file chooser for 1 object.
Line 242: Line 250:
 
</source>
 
</source>
  
==== A choice in a list ====
+
=== A choice in a list ===
 
* The default <code>appearance</code> is <code>"radio"</code>, but can be also be <code>"combo"</code>.
 
* The default <code>appearance</code> is <code>"radio"</code>, but can be also be <code>"combo"</code>.
 
<source lang="xml">
 
<source lang="xml">

Revision as of 20:06, 23 March 2020

Here you will find the different parameter elements you may use in your .inx files (Inkscape Extensions)

Introduction

Use parameter elements to capture user input for further use by a script. The basic structure of the element is:

<param name="some_name" type="some_type">default value</param>

The default value is the value that is shown in the input control the first time the user opens the dialog window. Inkscape automatically displays the values used last time when the dialog window is opened again.

Common attributes

gui-description

Tooltip of the parameter, which is shown when the user hovers the mouse cursor over the active area of the parameter in question.

To enable translations for this string use the underscore variant (_gui-description , see localization of parameters below for details).

gui-hidden

If the value is set to true the parameter is hidden from the GUI (defaults to false).

gui-text

Label of the parameter.

To enable translations for this string use the underscore variant (_gui-text, see localization of parameters below for details).

indent

Sets indentation level of the parameter (e.g. indent="1").

name

The value of the name attribute is used as an identifier of the parameter. It has to be unique since the value of this attribute is used to save and transmit parameter values internally!

type

The type attribute determines the type of the parameter (for tags <param>) (possible values are boolean, int, float, string, enum, optiongroup, color, notebook, description), see the extensive description of available types below.

Available types

Type Description / Code Result
boolean Creates a checkbox input to set a boolean value. Set the default value to true or 1, false or 0.
<param name="name" type="boolean" gui-text="Some label text">false</param>
INX sample-boolean.png
color Creates a control to select a color value.

The returned value is an RGBA-value.

<param name="name" type="color"></param>
INX sample-color.png
description Creates a text element. Specifying the attribute xml:space="preserve" preserves whitespace in the text content of the description and enables multiline text.
<param name="name" type="description">Some text here.</param>

When additionally setting the attribute appearance="header" the text is styled as a heading and can be used as another possibility to group parameters.

<param name="name" type="description" appearance="header">Header</param>

All description type parameters are purely informational (they do not return any value). They are intended to be used to provide additional information / help on other parameters (Consider using the gui-description attribute for short help texts that are specific to a single parameter, though).


INX sample-description.png
default appearance



INX sample-description header.png
with appearance="header"


 

enum Creates a drop-down list from which one predefined value can be chosen. The different choices are created with <item> elements. The first <item> is selected by default.

The returned value for enum type parameters is the value of the value attribute of the selected <item>.

<param name="name" type="enum" gui-text="Some label text">
   <item value="1">First option</item>
   <item value="2">Second option</item>
</param>
INX sample-enum.png
float Creates a textbox input to enter a floating point number. Limit the input range with the min and max attributes; set the number of decimal places with the precision attribute. (Default: min="0", max="10" and precision="1")
<param name="name" type="float" precision="3" min="0" max="9999" 
gui-text="Some label text">1.234</param>

Use the attribute appearance="full" to create a slider with which the floating point value can be adjusted dynamically over the full range.

INX sample-float.png

INX sample-float full.png
int Creates a textbox input to enter an integer number. Limit the input range with the min and max attributes. (Default: min="0" and max="10")
<param name="name" type="int" min="1" max="100" gui-text="Some label text">1</param>

Use the attribute appearance="full" to create a slider with which the integer value can be adjusted dynamically over the full range.

INX sample-int.png

INX sample-int full.png
notebook Creates a set of pages (aka tab control). The user can switch between individual pages, each page can contain an arbitrary set of other parameters. Individual pages are created with the <page> element.

The returned value for notebook type parameters is the value of the name attribute of the selected <page>.

<param name="name" type="notebook">
    <page name="page_1" gui-text="First page">
        <param>...</param>
    </page>
    <page name="page_2" gui-text="Second page">
        <param>...</param>
    </page>
</param>
INX sample-notebook.png
optiongroup Creates a set of radio buttons from which one predefined value can be chosen. The different choices are created with <option> elements. The first <option> is selected by default.

The returned value for optiongroup type parameters is the value of the value attribute of the selected <option>.

<param name="name" type="optiongroup"
gui-text="Some label text">
   <option value="1">First option</option>
   <option value="2">Second option</option>
</param>

Set the attribute appearance="minimal" to display a drop-down list instead of radio buttons.
The option group will occupy the minimum space on the right hand side of the dialog. Versus the Enum, which expands to fill available space.

INX sample-optiongroup.png




INX sample-optiongroup-minimal.png
string Creates a textbox input to enter a character string. Limit the number of characters the user is allowed to enter with the max_length attribute. (Default: no limit)
<param name="name" type="string" gui-text="Some text label">Some default text</param>
INX sample-string.png

Localization of parameters

To mark parameters to be included into the translation files (this is done automatically during the build process) there exist special variants of all relevant attributes and tag names that start with an underscore.

  • Labels and tooltips can be marked for translation by simply using the attribute names _gui-text and _gui-description instead of their counterparts without underscore.
  • For <item>s and <option>s (both of which do not use the attributes just explained) add an underscore to the tag name itself:
    <_item value="1">Localized item name</_item> and
    <_option value="1">Localized option name</_option> respectively.
  • Also for description type (and only for description type!) parameters an underscore is added to the tag name itself:
    <_param type="description">Localized text here.</_param>

Editing INX Parameters in 1.0

In this section:

  • When an attribute is in square brackets ([name="value"]), it means that name is optional.
  • The 1 in indent="1" is the indentation level that you want.

Tags for the layout

<label [indent="1"] [appearance="header"]>Some text</label>
<label [indent="1"] [appearance="url"]>http://some/url</label>
<image>some/inx/relative/path/to/img.svg</image>
<spacer/>
<separator [indent="1"]/>
<hbox [indent="1"]></hbox>
<vbox [indent="1"]></vbox>

Tags for the parameters

  • The name attribute of tag <param> means the name of the argument (--name=) your command will get.
  • Defaults values are set to the last used value, the defaults values in the inx file are for the first use.

Tab view of pages

These can help with layout.

  • You get the value of the selected <page name> attribute as an argument to your extension.
  • For a <param> used on multiple pages, you get the value of the <param> from the last <page>.
    • You better give them different parameter names.
<param type="notebook" name="varname" [indent="1"]>
    <page name="value" gui-text="label">
        <!-- Any elements contained in the page goes here -->
    </page>
    <!-- You can add as many pages as you like -->
</param>

Checkbox

Default value is true.

<param type="bool" name="varname" gui-text="label" [indent="1"]>false</param>

Numerical input spinner

The widget has a precision of 0.1 for float.

  • With appearance="full" also use a full width slider.
  • The default min is "0"
  • The default max is "10"
  • The default value is 0
<param type="int"   name="varname" gui-text="labal" [min="1"] [max="10"] [appearance="full"]  [indent="1"]/>
<param type="float" name="varname" gui-text="label" [min="0.5"] [max="5.0"] [appearance="full"]  [indent="1"]/>

Textbox

The default value is the empty string and with such a value, the parameter is omited.

<param type="string" name="varname" gui-text="label" [indent="1"]>some text</param>

File chooser

  • The attribute mode with a value of:
    • "file" or "folder" (without s) means to use a file chooser for 1 object.
    • The versions ending with a s mean to use a file chooser for multiple objects.
    • And the ones ending with _new are for creating new objects.
  • The filetype attribute contains a list of file extensions to look for. In this example only svg or png files will be displayed.
<param type="path" name="varname" gui-text="label" [indent="1"] mode="file"     filetypes="svg,png"/>
<param type="path" name="varname" gui-text="label" [indent="1"] mode="files"    filetypes="svg,png"/>
<param type="path" name="varname" gui-text="label" [indent="1"] mode="file_new" filetypes="svg,png"/>
<param type="path" name="varname" gui-text="label" [indent="1"] mode="folder"/>
<param type="path" name="varname" gui-text="label" [indent="1"] mode="folders"/>
<param type="path" name="varname" gui-text="label" [indent="1"] mode="folder_new"/>

A choice in a list

  • The default appearance is "radio", but can be also be "combo".
<param type="optiongroup" name="varname" gui-text="label" [appearance="combo"|appearance="radio"] [indent="1"]>
    <item value="value">Some text</item>
    <!-- Other choices -->
</param>