Line Spacing

Hi there,

I’m working on a project in Ignition Designer, and it would save me some time if I were able to adjust the line spacing for my text.

I’m running Windows 7 with the latest Java.
My ignition version information is as follows:
Ignition Platform: 7.7.1
SFC Module: 1.7.1-beta11
Instrument Interface Module: 1.7.1
OPC-UA Module: 2.7.1
Vision Module: 7.7.1
SQL Bridge Module: 6.7.1
OpcCom Module: 2.7.1
Alarm Notification Module: 2.7.1
Production Module: 1.7.1
Mobile Module: 2.7.1
Schedule Module: 1.7.1
Recipe Module: 1.7.1 [Trial]
SPC Module: 1.7.1 [Trial]
Reporting Module: 2.7.1
Symbol Factory Module: 3.7.1
OEE Downtime Module: 1.7.1

I found this thread: … ne+spacing

Which notes:

So, to avoid getting repeat answers, the question in that thread was: “How do I adjust line spacing using HTML?”
My question is: “How do I adjust line spacing?”


(P.S. So far I’m really enjoying my work in Ignition. You guys are doing great!)

Even now this can be an ambiguous question. Are we talking about:

a) adjust spacing between multiple components
b) adjusting space between multiple lines in a single component (like a label)

The first is easily accomplished from the tools at the right end of the Shape Editing Toolbar:

For the second, the answer may as well be “Nope”. The only way to do this would be via HTML. Unfortunately, while CSS support has been improved, line-height still only has a placeholder and no implememtation (for those interested in what CSS attributes are supported, you can look here).

The closest I have ever been able to come has been to use the padding-top attribute to achieve the same result-- sort of.

What it won’t do:
–work on word-wrapped lines.
–bring lines closer together. (Negative numbers for the padding value)

The attached files are a shared script and a window to illustrate.
test_Label_2014-12-10_0913.proj (5.24 KB)
global_html_2014-12-10_0843.proj (1.27 KB)

Here is an HTML solution. The only height directive obeyed by the
element is the base font size.
Reduce the line height by setting a smaller font size. Then set the font size to be larger in the HTML for the labels.

<html> <span style= "font-size:200%">label text 1</span> <span style= "font-size:100%">&nbsp;<BR></span> <span style= "font-size:200%">label text 2</span></html>

1 Like