Banner¶
A three-sliced strip with centred text: a scroll, a ribbon, a plaque. The left and right caps are fixed art and the middle stretches, so a banner grows sideways to fit its text but never vertically.
{
"Type": "Banner",
"Text": "Chapter 2",
"FontType": "Small",
"CapWidth": 19,
"TexturePath": "Assets/PeacefulEnd.Parchment/bannerTitle1",
"Sizing": "ShrinkToFit",
"Alignment": "Center",
"Scale": 5
}
A banner's height is always its source rectangle's height × Scale. If you need something that grows in both directions, use a Panel with a text child. That's what nine-slicing is for.
Banner fields¶
| Property | Type | Default | Description |
|---|---|---|---|
CapWidth optional |
int |
a third of the strip | The width of the left and right caps, in unscaled sprite pixels. Everything between them is the middle segment. |
Padding optional |
int |
0 |
Extra space between the caps and the text, in unscaled sprite pixels × Scale. |
Sizing optional |
sizing mode |
ShrinkToFit |
How wide the banner is. ShrinkToFit hugs the text. |
Width optional |
int? |
— | The content width in unscaled sprite pixels × Scale. The caps and padding are added around it. Required when Sizing is Fixed. |
TextScale optional |
number |
1 |
The text's scale, independent of Scale, which sizes the sprite. |
TextOffset optional |
Point |
{ X: 0, Y: 0 } |
An offset applied to the text, from the origin point in the center of the banner. |
Make the middle segment one pixel wide
The middle stretches to whatever width the banner ends up. A one-pixel middle stretches perfectly to any width. A wider patterned one gives uneven columns. A 49-pixel strip with CapWidth: 24 is the shape you want, not equal thirds, which is only the default because it's the least surprising reading of "three segments". See Preparing your art.
Text fields¶
Text is always centred in the middle segment, whatever the banner's own Alignment is. A right-aligned banner still has centred text.
| Property | Type | Default | Description |
|---|---|---|---|
Text optional |
string |
— | The text to draw. Wraps automatically to the available width, including breaking words that are too long for a line on their own. \n forces a line break. |
FontType optional |
font type |
varies | Which font to draw with. The default differs per element type. |
TextColor optional |
color |
the book's default | The text colour. |
Sprite fields¶
| Property | Type | Default | Description |
|---|---|---|---|
TexturePath optional |
string |
— | The asset name of the sprite sheet, such as Assets/PeacefulEnd.Parchment/panelFrame2 or a vanilla path like LooseSprites/Cursors. This is a game asset name, not a file path in your content pack. Load your PNG into the game's content with a Content Patcher Load patch first. See Loading your art. |
TextureSourceRectangle optional |
Rectangle |
the whole texture | The area of the sprite sheet to draw. Almost always needed: without it, the whole sheet is used, which for a multi-sprite sheet means a much larger element than you expect. |
HoverTextureSourceRectangle optional |
Rectangle? |
— | An alternate source rectangle drawn while the cursor is over the element. Must be the same size as TextureSourceRectangle. The element's layout is measured from the normal rectangle, so a differently-sized hover sprite will overhang its own bounds. For a moving hover state on an Image, use HoverFrames instead. |
TintColor optional |
color |
white | A colour multiplied into the sprite. Multiplying means it can only darken: red on grey art gives red, red on blue art gives near-black. Best on neutral or greyscale art. |
SpriteEffects optional |
None | FlipHorizontally | FlipVertically |
None |
Mirrors the sprite within its own bounds. It does not move the element. If flipping appears to shift the art sideways, the sprite has uneven transparent padding inside its source rectangle. Combine with a comma: "FlipHorizontally, FlipVertically". Ignored by Panel and Button, which are nine-sliced. |
Common fields¶
Scale on a Banner is the sprite scale. Use TextScale for the text. Keep Scale a whole number. Fractional scaling distorts the cap art.
| Property | Type | Default | Description |
|---|---|---|---|
Type required |
element type |
— | Which kind of element this is. Determines every other field below. |
Id optional |
string |
— | An optional identifier for this element. Not used for navigation, purely for your own reference. |
Alignment optional |
Left | Center | Right |
Left |
Where the element sits within its container's width. Only has an effect when the element is narrower than the space available (see Layout). |
Scale optional |
number |
1 |
The element's scale. Its meaning depends on the element type: sprite scale for Image, Panel, Banner, Button and Divider. Font scale for Title, Heading and Paragraph. See Units and scale. |
SpacingAfter optional |
int |
8 |
The gap between this element and the next one, in unscaled sprite pixels × Scale. Not applied after the last visible element, so a trailing gap can't appear at the bottom of a page or panel. |
MarginLeft optional |
int |
0 |
Space reserved to the element's left, in unscaled sprite pixels × Scale. This narrows the width the element measures against, so text wraps at the indented width rather than overflowing. |
MarginRight optional |
int |
0 |
Space reserved to the element's right, in unscaled sprite pixels × Scale. |
Position optional |
Point |
{ X: 0, Y: 0 } |
The element's position, in screen pixels. Only used in Background, Foreground, Underlay and Overlay, where elements are placed rather than stacked. Unlike every other spacing field this is not multiplied by Scale. Changing an element's scale resizes it in place rather than moving it. |
Condition optional |
string |
— | A game state query. When it evaluates false the element is hidden, and elements below it close the gap. Re-checked several times a second while the book is open. |
Action optional |
string |
— | A trigger action run when the element is clicked. When set, the element becomes interactive: any element type can have one, not just Button. |
Actions optional |
list of string |
— | Trigger actions run in order when the element is clicked. Combined with Action rather than replacing it, so an element with both runs Action first. |
Sound optional |
string |
bigSelect |
The cue played when the element is clicked. Only used when Action or Actions is set, and played once however many actions run. Set to null for a silent click. |
HoverAction optional |
string |
— | A trigger action run when the cursor moves onto the element. Runs on entry, not while the cursor rests there. Sound doesn't apply. |
HoverActions optional |
list of string |
— | Trigger actions run in order when the cursor moves onto the element. Combined with HoverAction rather than replacing it, so an element with both runs HoverAction first. |
DisplayName optional |
string |
— | The bold title of the element's hover tooltip. Works in every list, including a page's Background and Foreground. |
Description optional |
string |
— | The body of the element's hover tooltip. Works in every list, including a page's Background and Foreground, where setting it is also what makes an otherwise decorative element reachable by the cursor. |
Text taller than the banner will overflow
A short strip can't hold a large font. If the text spills past the scroll, lower TextScale or pick a smaller FontType. Parchment logs a warning telling you both numbers.