How to work with styled text in GemStone

Locally we rely on BlText Object subclass: #BlText uses: TBlDebug + TBlTextStyleable instanceVariableNames: 'announcer' classVariableNames: '' package: 'Bloc-Text-Text' and Object>>#asRopedText asRopedText ^ BlRunRopedText string: self asString to provide support for styling and decorating text.

Currently BlText Object subclass: #BlText uses: TBlDebug + TBlTextStyleable instanceVariableNames: 'announcer' classVariableNames: '' package: 'Bloc-Text-Text' is not present in GemStone. Instead GtPhlowText Object subclass: #GtPhlowText instanceVariableNames: '' classVariableNames: '' package: 'GToolkit-RemotePhlow-Text' is used. Object>>#asRopedText asRopedText ^ BlRunRopedText string: self asString is implemented in GemStone to return instances of GtPhlowText Object subclass: #GtPhlowText instanceVariableNames: '' classVariableNames: '' package: 'GToolkit-RemotePhlow-Text' .

The API for working with styled text is the same between GT and GemStone.

For example the snippet below styles text locally.

textLocal := 'This is red and this is green' asRopedText.
textLocal fontSize: 20.
(textLocal from: 9 to: 11) 
	foreground: (GtPhlowColor named: #red) asColor;
	fontSize: 45.
(textLocal from: 25 to: 29) 
	highlight: (GtPhlowColor named: #green) asColor.
(textLocal from: 1 to: 4)  decorationDo: [ :aDecoration |
	aDecoration 
		underline;
		dashed; 
		thickness: 3;
		color: (GtPhlowColor named: #blue) asColor ].
(textLocal from: 17 to: 20)  decorationDo: [ :aDecoration |
	aDecoration 
		lineThrough;
		wavy ].
textLocal
  

We can use exactly the same API in GemStone.

remoteLocal := 'This is red and this is green' asRopedText.
remoteLocal fontSize: 20.
(remoteLocal from: 9 to: 11) 
	foreground: (GtPhlowColor named: #red) asColor;
	fontSize: 45.
(remoteLocal from: 25 to: 29) 
	highlight: (GtPhlowColor named: #green) asColor.
(remoteLocal from: 1 to: 4)  decorationDo: [ :aDecoration |
	aDecoration 
		underline;
		dashed; 
		thickness: 3;
		color: (GtPhlowColor named: #blue) asColor ].
(remoteLocal from: 17 to: 20)  decorationDo: [ :aDecoration |
	aDecoration 
		lineThrough;
		wavy ].
remoteLocal
  

Examples of text styles

The method GtRemotePhlowDeclarativeTextTestInspectable>>#styledPhlowTextWithHighlights styledPhlowTextWithHighlights <gtExample> | text | text := GtPhlowText forString: 'Examples of text styling: Emphases: Italic text Oblique text Normal text Colors: Blue foreground Green highlight Weight: Thin text Bold text Size: 8px text 28px text Fonts: Helvetica font Source Sans Pro font Combined styles: Several styles '. (text from: 39 to: 49) italic. (text from: 52 to: 63) oblique. (text from: 66 to: 76) normal. (text from: 88 to: 102) foreground: (GtPhlowColor named: #blue). (text from: 105 to: 119) highlight: (GtPhlowColor named: #green). (text from: 132 to: 140) thin. (text from: 143 to: 152) bold. (text from: 162 to: 169) fontSize: 8. (text from: 172 to: 180) fontSize: 28. (text from: 191 to: 205) fontName: 'Helvetica'. (text from: 208 to: 226) fontName: 'Source Sans Pro'. (text from: 249 to: 262) oblique; bold; fontSize: 18; foreground: (GtPhlowColor named: #red); fontName: 'Source Sans Pro'. ^ text and GtRemotePhlowDeclarativeTextTestInspectable>>#styledPhlowTextWithDecorations styledPhlowTextWithDecorations <gtExample> | text | text := GtPhlowText forString: 'Examples of text decorations: Different styles: Solid style Dashed style Dotted style Wavy style Different types: Line Through Overline Underline Different color: Blue color Different thickness: Thickness 3 Combined decorations: Several decorations '. (text from: 51 to: 61) decorationDo: [ :aDecoration | aDecoration solid; underline ]. (text from: 64 to: 75) decorationDo: [ :aDecoration | aDecoration dashed; underline ]. (text from: 78 to: 89) decorationDo: [ :aDecoration | aDecoration dotted; underline ]. (text from: 92 to: 101) decorationDo: [ :aDecoration | aDecoration wavy; underline ]. (text from: 123 to: 134) decorationDo: [ :aDecoration | aDecoration solid; lineThrough ]. (text from: 137 to: 144) decorationDo: [ :aDecoration | aDecoration solid; overline ]. (text from: 147 to: 155) decorationDo: [ :aDecoration | aDecoration solid; underline ]. (text from: 177 to: 186) decorationDo: [ :aDecoration | aDecoration underline; color: (GtPhlowColor named: #blue) ]. (text from: 212 to: 222) decorationDo: [ :aDecoration | aDecoration underline; thickness: 3 ]. (text from: 249 to: 267) decorationDo: [ :aDecoration | aDecoration underline; overline; dashed; thickness: 3; color: (GtPhlowColor named: #blue) ]. ^ text show two examples of styling text.

The first one is related to text styles:

And second one is related to text decorations:

The texts above are create in the local image. We can also create them in GemStone.

GtRemotePhlowDeclarativeTextTestInspectable new 
	styledPhlowTextWithHighlights
  

GtRemotePhlowDeclarativeTextTestInspectable new 
	styledPhlowTextWithDecorations