概要
NineSlice 素材を指定サイズのウィンドウ画像に描画するノードです。 角は崩れず辺と中央だけが伸縮するので、同じ素材から名前欄もフル画面 ウィンドウも作れます。
使い方のポイント
nine_slice_packとセットで完結: pack(素材) → render(サイズ指定)。 サイズ違いのUIを量産する時は render を複数ぶら下げる- ドット絵の枠は
Repeat(くり返し)が基本。Stretchは模様が伸びて ドット感が崩れやすい - width / height を📌入力ピン化すれば「開くウィンドウ」アニメも作れる
関連ノード
nine_slice_pack— 素材側の相方blend— 文字・アイコンの上載せtext_rasterize— 載せる文字の生成主な用途: メッセージウィンドウ、UIパネル、ボタン背景、名前欄、ステータス枠の生成
このノードは、NineSlice 素材を受け取り、幅と高さを指定して画像にします。角は崩さず、辺と中央だけを伸ばすため、ドット絵の枠をきれいに保ったまま大きなウィンドウを作れます。
辺の伸ばし方
| 値 | 表示名 | 説明 |
|---|---|---|
Document |
素材設定 | NineSlice Pack 側で保存した設定を使います。 |
Repeat |
くり返し | 辺パーツをタイルのように並べます。ドット絵の枠線向けです。 |
Stretch |
引き伸ばし | 辺パーツを出力サイズに合わせて伸ばします。 |
中央の伸ばし方
| 値 | 表示名 | 説明 |
|---|---|---|
Document |
素材設定 | NineSlice Pack 側で保存した設定を使います。 |
Repeat |
くり返し | 中央パーツをタイルのように並べます。 |
Stretch |
引き伸ばし | 中央パーツを出力サイズに合わせて伸ばします。 |
Transparent |
透明 | 中央を描かず、透明のまま残します。 |
最小サイズ処理
9スライスは、左枠 + 右枠、上枠 + 下枠より小さいサイズには基本的にできません。その場合の処理を選べます。
| 値 | 表示名 | 説明 |
|---|---|---|
Clamp |
自動で広げる | 小さすぎる時、描画できる最小サイズまで自動で広げます。 |
Warn |
注意を出して広げる | 最小サイズまで広げたうえで、warnings に注意を書きます。 |
Error |
エラーにする | 小さすぎるサイズなら描画せずエラーにします。 |
基本的な使い方
9スライス素材作成のnine_sliceを、このノードのnine_sliceに接続します。widthとheightを指定します。image出力をPreviewなどにつなぎ、ウィンドウ画像を確認します。- 必要なら
edge_modeやcenter_modeを変更して、くり返しと引き伸ばしを比較します。
content_rect の意味
content_rect は、ウィンドウの中に文字やアイコンを置くための目安です。
| キー | 意味 |
|---|---|
| x | 中身エリアの左上X座標 |
| y | 中身エリアの左上Y座標 |
| width | 中身エリアの幅 |
| height | 中身エリアの高さ |
たとえば content_rect が x=8, y=8, width=80, height=32 なら、テキストはだいたい (8, 8) から 80x32 の範囲に置くと枠に重なりにくくなります。
注意
- このノードは描画専用です。素材の作成やパーツ順の指定は
NineSlice Packで行います。 - ドット絵の線を保ちたい場合は、まず
edge_mode=Repeatを試すのが基本です。 - グラデーションや単色面のように模様が目立たない素材なら
Stretchも使えます。 - paddingが出力を使い切ると
content_rectは0幅または0高さになり、content_rect_empty警告が出ます。 summaryとwarningsは言語に依存しない安定した診断形式です。 小さすぎるサイズを広げた場合はsize_clampedが出ます。