Introduction

This article introduces you to our custom Weather app and its core features.

Info

The Weather app is deployed to customer servers per request. To learn more contact our support at sales@wallboard.info!

Please note

This custom app is under active development and any information in this documentation could be inaccurate or outdated! If you have any questions please contact our support at support@wallboard.info

What is Text Gallery?

Text Gallery is a custom Wallboard widget that displays animated text content. It supports multiple animation styles, text formatting, and can pull content from both static text input or external data sources.

Work Modes

The Text Gallery widget operates in two distinct work modes:

1. Plain Text Mode

Use this mode when you want to display static text that you enter directly in the editor.

Configuration:

• Select "Plain text" in the Work Mode dropdown
• Enter your text in the "Text" text area
• Multi-line text is supported (each line becomes a separate animated item)

2. Datasource Mode

Use this mode when you want to display dynamic text from an external data source.

Configuration:

• Select "Datasource" in the Work Mode dropdown
• Use the "Set text source" data picker to connect to your data source
• Specify the "Datasource key" - this is the property name from your data objects that contains the text to display (default: "title")

Data Source Requirements: The data source should provide an array of objects, each containing the key you specified. For example, if your datasource key is "title":

[
  { "title": "First message" },
  { "title": "Second message" },
  { "title": "Third message" }
]

---

Animation Styles

Text Gallery supports 9 different animation styles:

Animation	Description
Marquee	Continuous horizontal scrolling ticker. Text scrolls from right to left in a loop.
Fade	Text fades in and out. Each line fades in, displays, then fades out before the next line appears.
Bounce	Text bounces into view with an elastic effect.
BackDown	Text animates in from above with a back-down motion effect.
FlipX	Text flips in horizontally (around the X-axis).
FlipY	Text flips in vertically (around the Y-axis).
Rotate	Text rotates into view with a spinning effect.
Roll	Text rolls in from the side with rotation.
Zoom	Text zooms in from small to full size.

---

Settings

Work Settings Group

Setting	Type	Description
Work Mode	Select	Choose between "Plain text" or "Datasource" mode
Text	Text Area	(Plain text mode only) Enter the text to display. Use line breaks to create multiple items.
Set text source	Data Picker	(Datasource mode only) Connect to your data source
Datasource key	Text	(Datasource mode only) The property name to extract text from (default: "title")

Text Style Settings Group

Setting	Type	Range	Description
Select animation	Select	-	Choose the animation style (see Animation Styles section)
Separator Text	Text	-	(Marquee only) Text displayed between items in the marquee ticker
Text align	Select	left/center/right/justify	Horizontal text alignment
Animation speed	Slider	1-40	Controls animation timing. Higher values = slower animations
Wait till repeat	Checkbox	-	When enabled, adds a pause/blank screen before repeating the animation cycle
Maximum lines in queue	Slider	1-20	Maximum number of lines that can be queued via external commands

Font Settings Group

Setting	Description
Font Family	Select the font typeface
Font Size	Set the text size in pixels
Font Style	Configure bold, italic, underline options
Font Color	Set the text color

---

Text Formatting

Text Gallery supports inline formatting using bracket-based modifiers. These can be used in both plain text input and data source values.

Simple Modifiers

Modifier	Syntax	Description
Bold	[bold]text[/bold]	Makes text bold
Italic	[italic]text[/italic]	Makes text italic
Underline	[underline]text[/underline]	Underlines text
Small	[small]text[/small]	Reduces text size
Large	[large]text[/large]	Increases text size

Complex Modifiers

Modifier	Syntax	Description
Background Color	[color:{color code}]	Sets background color for the entire line
Font Color	[fontcolor:{color code}]text[/fontcolor]	Changes text color for wrapped content
Font Size	[fontsize:{size in px or in %}]text[/fontsize]	Sets specific font size for wrapped content
Icon	[icon:symbol]	Displays a symbol/icon
Line Break	[br]	Inserts a line break (note: removed in marquee mode)

Formatting Examples

[bold]Important:[/bold] This is a critical message
[color:red]This line has a red background
[fontcolor:#00ff00]Green text[/fontcolor] with normal text
[large][bold]BIG BOLD TEXT[/bold][/large]

---

External Commands

External commands allow other widgets or automations to change the Text Gallery widget externally.

Available Commands

1. Reset text gallery

Resets the text gallery to its default state, clearing any externally-set content and reverting to the original configured text or data source.

Parameters: None

Usage: Use this command to restore the widget after using setText or insertLine commands.

2. Set text

Completely replaces the current text content with new text.

Parameters:

Parameter	Type	Description
Value	Text	The text to display. Use semicolons (;) to separate multiple lines.

Example Values:

• Single line: Hello World
• Multiple lines: First message;Second message;Third message

Note: This command supports all text formatting modifiers.

3. Insert line

Adds a new line to the queue without replacing existing content.

Parameters:

Parameter	Type	Description
Value	Text	The text line to insert into the queue

Behavior:

• Lines are added to a queue that displays alongside the original content
• The queue respects the "Maximum lines in queue" setting
• When the queue is full, the oldest line is removed to make room for the new line
• Only available in modes that support line insertion

Note: This command supports all text formatting modifiers.