How do I style paragraphs in a field?

This lesson applies to version 5.5 and later of LiveCode.

Create a stack with a field of text

Create a stack with a field of text

In all of the following steps we'll be looking at how to manipulate the second paragraph (or line 3 of field "content"). Each step will have a line of two of code and a screenshot of the results.

Center align our paragraph (textAlign Property)

Center align our paragraph (textAlign Property)
set the textAlign of line 3 of field "content" to "center"

Highlight our paragraph (backgroundColor property)

Highlight our paragraph (backgroundColor property)
set the backgroundcolor of line 3 of field "content" to "200,180,241"

Give our paragraph a strong border (borderWidth and borderColor properties)

Give our paragraph a strong border (borderWidth and borderColor properties)
set the bordercolor of line 3 of field "content" to "30,30,30"
set the borderwidth of line 3 of field "content" to 5

Pad our paragraph from its border (padding property)

Pad our paragraph from it's border (padding property)
set the padding of line 3 of field "content" to 15

Indent the first line of our paragraph (firstIndent property)

Indent the first line of our paragraph (firstIndent property)
set the firstindent of line 3 of field "content" to 40

Indent our paragraph (leftIndent and rightIndent properties)

Indent our paragraph (leftIndent and rightIndent properties)
set the rightIndent of line 3 of field "content" to 30
set the leftIndent of line 3 of field "content" to 30

Add space above and below our paragraph (spaceBefore and spaceAfter properties)

Add space above and below our paragraph (spaceBefore and spaceAfter properties)
set the spaceAbove of line 3 of field "content" to 18
set the spaceBelow of line 3 of field "content" to 18

Summary

All of the above steps can be gathered into a single routine to set the style of a particular run of text such as the paragraph in this example:

set the textalign of line 3 of field "content" to "center"
set the backgroundcolor of line 3 of field "content" to "200,180,241"
set the bordercolor of line 3 of field "content" to "30,30,30"
set the borderwidth of line 3 of field "content" to 5
set the padding of line 3 of field "content" to 15
set the firstindent of line 3 of field "content" to 40
set the rightIndent of line 3 of field "content" to 30
set the leftIndent of line 3 of field "content" to 30
set the spaceAbove of line 3 of field "content" to 18
set the spaceBelow of line 3 of field "content" to 18

5 Comments

Sean Cole

You can also change many other properties like 'textSize', 'textFont' or 'textStyle["Bold"] in a similar way using 'item', 'word', 'char' and so on. You could therefore highlight individual words based on a search.

Charles Szasz

I have run into problems using styled paragraph with Window for printing. Text including letters and word overlapped during printing. This does not occur on the Mac. Is there a solution for this problem?

Charles Szasz

How do you first indent a paragraph so that subsequent paragraphs are first indented?

Elanor Buchanan

Hi Charles, if you want each paragraph to be first indented you would do

set the firstindent of line 1 to -1 of field "content" to 40

This will indent the first line of each paragraph.

I hope that helps.

Elanor

Elanor Buchanan

Hi Charles,

Could you please report the printing issue on Windows as a bug with a recipe and/or sample stack at

https://quality.livecode.com/

From there the team will investigate the problem.

Thank you.

Elanor

Add your comment

E-Mail me when someone replies to this comment