Back to Node List

NineSlice Render

nine_slice_render

Renders a nine-slice material at an arbitrary pixel size.

Reviewed
Guide available
The node name and summary are available in English. Port, parameter, and article details are currently shown in Japanese.

Input Ports

NameTypeDescription
9スライス
nine_slice
NineSlice
Required
9スライス素材作成ノードで作った、伸ばせるウィンドウ素材です。
width
Int
出力するウィンドウの幅です。接続するとパラメータより優先します。
高さ
height
Int
出力するウィンドウの高さです。接続するとパラメータより優先します。

Output Ports

NameTypeDescription
画像
image
Image
指定サイズで描画したウィンドウ画像です。
中身エリア
content_rect
Map
文字やアイコンを置きやすい内側エリアです。x、y、width、height を出します。
概要
summary
Text
描画結果の短いまとめです。
注意
warnings
Text
描画時の注意点です。問題がなければ空です。

Parameters

NameTypeDefaultRangeDescription / Options
width
Int
961–4096

出力するウィンドウの幅です。

高さ
height
Int
481–4096

出力するウィンドウの高さです。

辺の伸ばし方
edge_mode
Enum
Document

描画時だけ辺の伸ばし方を上書きできます。

  • 素材設定Document
    9スライス素材に保存されている辺の伸ばし方を使います。
  • くり返しRepeat
    辺パーツをタイル状にくり返します。
  • 引き伸ばしStretch
    辺パーツを出力サイズに合わせて引き伸ばします。
中央の伸ばし方
center_mode
Enum
Document

描画時だけ中央の伸ばし方を上書きできます。

  • 素材設定Document
    9スライス素材に保存されている中央の伸ばし方を使います。
  • くり返しRepeat
    中央パーツをタイル状にくり返します。
  • 引き伸ばしStretch
    中央パーツを出力サイズに合わせて引き伸ばします。
  • 透明Transparent
    中央を塗らず透明のままにします。
最小サイズ処理
min_size_policy
Enum
Clamp

指定サイズが枠より小さい時の扱いです。

  • 自動で広げるClamp
    指定サイズが小さすぎる時、描画できる最小サイズまで自動で広げます。
  • 注意を出して広げるWarn
    小さすぎる時は最小サイズまで広げ、注意出力にも書きます。
  • エラーにするError
    指定サイズが枠より小さい時はエラーにします。

Overview

Renders a NineSlice asset as a window image of the requested dimensions. Only the edges and center resize, leaving the corners intact, so the same asset can produce both a name box and a full-screen window.

Usage tips

  • Complete the workflow with nine_slice_pack: pack defines the asset, render sets its dimensions. Attach multiple Render nodes to batch-produce UI at different sizes.
  • Repeat is the standard choice for pixel-art borders. Stretch can elongate patterns and damage the pixel-art look.
  • Promote width / height to input pins 📌 to animate a window opening.

Related nodes

  • nine_slice_pack — the asset counterpart

  • blend — overlays text and icons

  • text_rasterize — generates text to place in the window

  • Primary uses: message windows, UI panels, button backgrounds, name boxes, and status frames

This node accepts a NineSlice asset and renders it at the specified width and height. It preserves the corners and resizes only the edges and center, keeping pixel-art borders clean in a large window.

Edge scale methods

Value Display name Description
Document Asset setting Uses the setting stored by NineSlice Pack.
Repeat Repeat Tiles the edge part. Best for pixel-art borders.
Stretch Stretch Stretches the edge part to the output dimensions.

Center scale methods

Value Display name Description
Document Asset setting Uses the setting stored by NineSlice Pack.
Repeat Repeat Tiles the center part.
Stretch Stretch Stretches the center part to the output dimensions.
Transparent Transparent Leaves the center undrawn and transparent.

Minimum-size handling

A nine-slice generally cannot be smaller than the sum of its left and right borders or its top and bottom borders. Choose how to handle smaller requests.

Value Display name Description
Clamp Expand automatically Expands an undersized request to the smallest renderable size.
Warn Warn and expand Expands to the minimum size and writes a note to warnings.
Error Raise an error Does not render and raises an error when the requested size is too small.

Basic usage

  1. Connect nine_slice from NineSlice Pack to this node's nine_slice input.
  2. Set width and height.
  3. Connect image to Preview or another node and inspect the window image.
  4. If needed, change edge_mode or center_mode to compare repeating and stretching.

Meaning of content_rect

content_rect is a guide for placing text or icons inside the window.

Key Meaning
x X coordinate of the content area's top-left corner
y Y coordinate of the content area's top-left corner
width Width of the content area
height Height of the content area

For example, if content_rect is x=8, y=8, width=80, height=32, placing text roughly within the 80x32 area beginning at (8, 8) helps keep it clear of the frame.

Notes

  • This node only renders. Create the asset and specify part order in NineSlice Pack.
  • To preserve pixel-art lines, start with edge_mode=Repeat.
  • Stretch also works for assets where patterns are unobtrusive, such as gradients or flat colors.
  • If padding consumes the output, content_rect has zero width or height and warnings contains content_rect_empty.
  • summary and warnings use stable locale-independent diagnostics. size_clamped reports an expanded undersized request.
Back to Node List
NineSlice Render — PixPipeline Node Reference