×

Style

Styling in OmniOutliner can be quite sophisticated, composed of styles that affect the entire document, certain types of content, or individually selected rows or blocks of text.

These are broken down across two kinds of styles: Document Styles (which affect classes of objects) and Named Styles (which can be applied as desired atop document styles).

TIP: Each template theme comes with some pre-defined Named styles, which you can use, delete, or edit to suit the needs of your document.

The styles you set for the various row levels, headings, and text all stack on top of the styles you designate for the whole document—and Named styles stack on top of those. If you’re curious why a certain section looks the way it does, select it and see the Style Attributes Inspector for a list of styles affecting the selection in order of precedence.

style-attributes

Instance Properties

Here are the basic properties of a style.

Instance Functions

An instance of style can be manipulated by the following set of methods, beginning with a set of commands for clearing, getting, and setting its style attributes:

Style Attributes

A style attribute is a particular property or characteristic of a style. For example, font size and paragraph alignment are two attributes that can be adjusted using scripts. Here is the list of the attributes of a style instance:

“BackGroundColor” Attribute



styleInst.set(Style.Attribute.BackGroundColor, Color.white)

“BaselineOffset” Attribute



styleInst.set(Style.Attribute.BaselineOffset, 3) // up
styleInst.set(Style.Attribute.BaselineOffset, 0) // normal
styleInst.set(Style.Attribute.BaselineOffset, -3) // down

“BaselineSuperscript” Attribute



// turn on
styleInst.set(Style.Attribute.BaselineSuperscript, true)
// turn off
styleInst.set(Style.Attribute.BaselineSuperscript, false)

“Expansion” Attribute



// turn on
styleInst.set(Style.Attribute.Expansion, true)
// turn off
styleInst.set(Style.Attribute.Expansion, false)

Font Attributes



styleInst.set(Style.Attribute.FontCondensed, false)
styleInst.set(Style.Attribute.FontFamily, 'Helvetica Neue')
styleInst.set(Style.Attribute.FontFillColor, Color.white)
styleInst.set(Style.Attribute.FontFixedPitch, false)
styleInst.set(Style.Attribute.FontItalic, true)
styleInst.set(Style.Attribute.FontName, 'HelveticaNeue-MediumItalic')
styleInst.set(Style.Attribute.FontNarrow, false)
styleInst.set(Style.Attribute.FontSize, 14)
styleInst.set(Style.Attribute.FontStrokeColor, Color.red)
styleInst.set(Style.Attribute.FontStrokeWidth, 2)
styleInst.set(Style.Attribute.FontWeight, 6)

IMPORTANT: to set the font of a style to a specific variation, use a combination of the FontFamily, FontWeight, and FontItalic attributes rather than the FontName attribute:

Set Font to Specific Variation



// Set a style’s font to “Helvetica Neue UltraLight Italic”
styleInst.set(Style.Attribute.FontFamily, 'Helvetica Neue')
styleInst.set(Style.Attribute.FontItalic, true)
styleInst.set(Style.Attribute.FontWeight, 1)
styleInst.set(Style.Attribute.FontSize, 24)

NOTE: Values for the fontWeight property vary between font families. Here are the font weight values for Helvetica Neue:

Helvetica Neue UltraLight = 1
Helvetica Neue Thin = 2
Helvetica Neue Light = 3
Helvetica Neue Book = 4
Helvetica Neue Regular = 5
Helvetica Neue Medium = 6
Helvetica Neue Demi-Bold = 7
Helvetica Neue SemiBold = 8
Helvetica Neue Bold = 9
Helvetica Neue ExtraBold = 10
Helvetica Neue Heavy = 11
Helvetica Neue Black = 12
Helvetica Neue Ultra = 13
Helvetica Neue Extrablack = 14

“KerningAdjustment” Attribute



//-> increase (loosen)
styleInst.set(Style.Attribute.KerningAdjustment, 3)
//-> decrease (tighten)
styleInst.set(Style.Attribute.KerningAdjustment, -3)
//-> default
styleInst.set(Style.Attribute.KerningAdjustment, 0)

“LigatureSelection” Attribute



styleInst.set(Style.Attribute.LigatureSelection, LigatureStyle.All)
styleInst.set(Style.Attribute.LigatureSelection, LigatureStyle.Essential)
styleInst.set(Style.Attribute.LigatureSelection, LigatureStyle.Standard)

“Link” Attribute



url = URL.fromString('https://omni-automation.com')
styleInst.set(Style.Attribute.Link, url)

“Obliqueness” Attribute



// lean right
styleInst.set(Style.Attribute.Obliqueness, .25)
// lean left
styleInst.set(Style.Attribute.Obliqueness, -.25)
// none
styleInst.set(Style.Attribute.Obliqueness, 0)

“ParagraphAlignment” Attribute



styleInst.set(Style.Attribute.ParagraphAlignment, TextAlignment.Center)				
styleInst.set(Style.Attribute.ParagraphAlignment, TextAlignment.Justified)
styleInst.set(Style.Attribute.ParagraphAlignment, TextAlignment.Left)				
styleInst.set(Style.Attribute.ParagraphAlignment, TextAlignment.Natural)
styleInst.set(Style.Attribute.ParagraphAlignment, TextAlignment.Right)

“ParagraphBaseWritingDirection” Attribute



styleInst.set(Style.Attribute.ParagraphBaseWritingDirection, WritingDirection.LeftToRight)
styleInst.set(Style.Attribute.ParagraphBaseWritingDirection, WritingDirection.Natural)
styleInst.set(Style.Attribute.ParagraphBaseWritingDirection, WritingDirection.RightToLeft)


“ParagraphDefaultTabInterval” Attribute



styleInst.set(Style.Attribute.ParagraphDefaultTabInterval, 72)
//-> true
styleInst.get(Style.Attribute.ParagraphDefaultTabInterval)
//-> 72

“ParagraphTabStops” Attribute



styleInst.get(Style.Attribute.ParagraphTabStops)
//-> 28L,56L,84L,112L,140L,168L,196L,224L,252L,280L,308L,336L
styleInst.set(Style.Attribute.ParagraphTabStops, '72L,144L,216R')
styleInst.get(Style.Attribute.ParagraphTabStops)
//-> 72L,144L,216R

“ParagraphTailIndent” Attribute



styleInst.set(Style.Attribute.ParagraphTailIndent, 72)

“ShadowBlurRadius” Attribute



styleInst.set(Style.Attribute.ShadowBlurRadius, 2.5)

“ShadowColor” Attribute



styleInst.set(Style.Attribute.ShadowColor, Color.black)

“ShadowOffset” Attribute



// offset the shadow to the lower right (horizontal, vertical)
styleInst.set(Style.Attribute.ShadowOffset, new Point(3, -4))

Striketrough



// Single Line
styleInst.set(Style.Attribute.StrikethroughStyle, UnderlineStyle.Single)
// No Strikethrough
styleInst.set(Style.Attribute.StrikethroughStyle, null)

Style Attribute Instance Properties

Here’s a script that stores the local style attributes of the current document’s base style into a JavaScript object (JSON):

Storing Local Style Attributes



bStyle = document.outline.baseStyle
localAtts = bStyle.locallyDefinedAttributes
attKeys = localAtts.map(att => att.key)
passedStyleObj = new Object()
attKeys.forEach(thisKey => {
	targetAtt = localAtts.find(att => {
		return att.key === thisKey
	})
	attValue = bStyle.get(targetAtt)
	console.log(thisKey + ":", attValue)

	passedStyleObj[thisKey] = attValue
})
console.log(JSON.stringify(passedStyleObj))

The resulting console log:

text-background-color: [object Color]
font-fill: [object Color]
font-family: Helvetica Neue
font-size: 24
font-weight: 4
paragraph-head-indent: 8
paragraph-first-line-head-indent: 8
paragraph-line-height-multiple: 1.2
// NOTE: color objects do not display as text in JSON:
{"text-background-color":{},"font-fill":{},"font-family":"Helvetica Neue","font-size":24,"font-weight":4,"paragraph-head-indent":8,"paragraph-first-line-head-indent":8,"paragraph-line-height-multiple":1.2}

TIP: An example of use of the locallyDefinedAttributes property to create a new outline document that uses styles of the current document, can be found in the “New Styled Document with Selection” voice command for OmniOutliner.

Default Values

Here's a script that uses the defaultValue property to derive the default values for fonts:

val = Style.Attribute.FontFamily.defaultValue console.log("FontFamily: " + val) val = Style.Attribute.FontName.defaultValue console.log("FontName: " + val) val = Style.Attribute.FontSize.defaultValue console.log("FontSize: " + val) val = Style.Attribute.FontWeight.defaultValue console.log("FontWeight: " + val) clr = Style.Attribute.FontFillColor.defaultValue console.log("FontFillColor: " + [clr.red, clr.green, clr.blue]) clr = Style.Attribute.FontStrokeColor.defaultValue console.log("FontStrokeColor: " + [clr.red, clr.green, clr.blue]) val = Style.Attribute.FontStrokeWidth.defaultValue console.log("FontStrokeWidth: " + val) val = Style.Attribute.FontCondensed.defaultValue console.log("FontCondensed: " + val) val = Style.Attribute.FontItalic.defaultValue console.log("FontItalic: " + val) val = Style.Attribute.FontNarrow.defaultValue console.log("FontNarrow: " + val)
Default Font Style Attribute Values



Style.Attribute.FontFamily.defaultValue
//--> Helvetica
Style.Attribute.FontName.defaultValue
//--> Helvetica
Style.Attribute.FontSize.defaultValue
//--> 12
Style.Attribute.FontWeight.defaultValue
//--> 5
clr = Style.Attribute.FontFillColor.defaultValue
console.log([clr.red, clr.green, clr.blue])
//--> [0, 0, 0]
clr = Style.Attribute.FontStrokeColor.defaultValue
console.log([clr.red, clr.green, clr.blue])
//--> [0, 0, 0]
Style.Attribute.FontStrokeWidth.defaultValue
//--> 0
Style.Attribute.FontCondensed.defaultValue
//--> false
Style.Attribute.FontItalic.defaultValue
//--> false
Style.Attribute.FontNarrow.defaultValue
//--> false

Here's a script that resets the current value of an attribute to its default value:

Set Style Attribute Value to Default Value for Attribute



styleInst = document.outline.levelStyle(0)
styleInst.set(Style.Attribute.FontSize, Style.Attribute.FontSize.defaultValue)
 

UnderlineAffinity

A class whose properties indicate how the text is to be underlined.

 

UnderlinePattern

A class whose properties indicate how the line pattern to be used in underlining text.

 

UnderlineStyle

Underline style specifiers.

 

LigatureStyle

A class whose properties indicate the set of ligatures to be applied to the text.

 

TextAlignment

A class whose properties indicate the text alignment options for the styled paragraphs.

 

WritingDirection

A class whose properties indicate the available writing directions to use for the styled text.

Example Styling Plug-Ins

Here are example plug-ins that demonstrate how to apply and remove a style, in this case a strikethrough, to the selected text or topic text of the selected row. The first plug-in will prompt for whether to apply or remove the style:

Apply|Remove Strikethrough
 


/*{
	"type": "action",
	"targets": ["omnioutliner"],
	"author": "Otto Automator",
	"identifier": "com.omni-automation.oo.apply-remove-strikethrough",
	"version": "1.0",
	"description": "This plug-in will apply or remove strikethrough to the selected text or the topic text of the selected row.",
	"label": "Apply|Remove Strikethrough",
	"shortLabel": "Strikethrough"
}*/
(() => {
	const action = new PlugIn.Action(function(selection, sender){
		// action code
		// selection options: columns, document, editor, items, nodes, outline, styles
		
		var style = selection.styles[0]
		
		var alert = new Alert("Strikethrough", "Apply or remove?")
		alert.addOption("Apply")
		alert.addOption("Remove")
		alert.addOption("Cancel")
		alert.show(function(result){
			if (result == 0){
				style.set(Style.Attribute.StrikethroughStyle, UnderlineStyle.Single)
			} else if (result == 1){
				style.set(Style.Attribute.StrikethroughStyle, UnderlineStyle.None)
			}
		})
	});

	action.validate = function(selection, sender){
		// validation code
		// selection options: columns, document, editor, items, nodes, outline, styles
		return (selection.items.length === 1)
	};
	
	return action;
})();

This plug-in will set the underline color to match the current font color defined for the Whole Document style.

Update Underline Color
 


/*{
	"type": "action",
	"targets": ["omnioutliner"],
	"author": "Otto Automator",
	"identifier": "com.omni-automation.oo.update-underline-color",
	"version": "1.0",
	"description": "Updates the global underline color to match the font color defined for the Whole Document style.",
	"label": "Update Underline Color",
	"shortLabel": "Update Underline Color"
}*/
(() => {
	var action = new PlugIn.Action(function(selection, sender){
		// action code
		baseStyle.set(Style.Attribute.UnderlineColor, baseStyle.fontFillColor)
	});

	action.validate = function(selection, sender){
		// validation code
		return true
	};
	
	return action;
})();