skills.rest
SummerEngine
SummerEngineOFFICIAL
Explore all skills by this author →
WebsiteGitHub

use-widget-asset

Wire generated UI widget slices into NinePatchRect, TextureProgressBar, or TextureRect nodes.

66|4|Updated Feb 26, 2026
Search Tags:#ui widgets#asset pack#game ui#summer engine#ninepatchrect#9-slice#textureprogressbar
One-click install
npx skills add https://github.com/SummerEngine/summer --skill use-widget-asset-summerengine
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: use-widget-asset
Source: https://github.com/SummerEngine/summer/tree/main/library/skills/use-widget-asset
Command: npx skills add https://github.com/SummerEngine/summer --skill use-widget-asset-summerengine

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Generated UI asset packs contain widget slices with 9-slice margins and fill-rect metadata, but turning those flat PNGs into functional, stretchable game UI controls requires manual interpretation of sliceMeta and correct node configuration in Summer Engine. ## Core Features & Use Cases - 9-Slice Panel Wiring: Convert frameMargins percentages into pixel patch margins on NinePatchRect nodes for panels and buttons. - Value-Driven Widgets: Configure TextureProgressBar with fill rects for progress bars, and HSlider with TextureRect overlays for sliders. - Toggle Pairs and Composites: Swap on/off textures via pairWith metadata, and reconstruct composite panels by grouping children with parentSliceIndex and zOrder. - Use Case: After generating a UI kit with create-asset-sheet, wire the detected slider, progress bar, and toggle slices into working Summer Engine controls that stretch and respond to game state. ## Quick Start Use the use-widget-asset skill to wire the panel and progress bar slices from my generated asset pack into Summer Engine controls.

Frequently Asked Questions about use-widget-asset

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I turn a generated UI slice into a stretchable panel in Godot?▼

Use a NinePatchRect and convert the slice's frameMargins percentages into pixel patch_margin values using the slice's own dimensions. Corners stay fixed while edges and center stretch when the node is resized.

How do I wire a progress bar slice into TextureProgressBar?▼

Assign the slice texture to both texture_under and texture_progress, set fill_mode based on orientation, and convert the fillRect percentages into stretch_margin values so only the fill region animates with the value property.

Which shapes support 9-slice stretching in generated UI packs?▼

Rectangles and rounded rectangles work with NinePatchRect since corners stay fixed. Circles, hexagons, and organic shapes should use static TextureRect nodes because 9-slice would distort their angled or curved edges.

How do toggle on/off pairs work in asset packs?▼

The sliceMeta pairWith field links a toggle's on and off slices by index. Look up the paired slice's URL in packFiles and swap the TextureRect texture based on the toggle state.

What should I do with composite panel slices marked isComposite?▼

Filter out slices with isComposite set to true since they are flat preview images, not runtime assets. Group the remaining children by parentSliceIndex, sort by zOrder, and spawn them as positioned Sprite2D or Control nodes.

What does this skill not cover for game UI assets?▼

It does not handle auto-tiling terrain, which belongs to tileable-texture workflows, or animated UI like button press states, which requires sprite-sheet handling. Non-AABB widgets fall back to static TextureRect rendering.

Related Skills

Explore More Design & Creative Skills→
pikachu0310pikachu0310

unity-ui

Create and lay out Unity UGUI screens, Canvas elements, and RectTransform layouts.

Community
Advanced
lunafishlunafish

assets-prefab-instantiate

Instantiate prefab assets into the active scene with position, rotation, and scale.

Community
Basic
ishaansingh-aiishaansingh-ai

screenshot-game-view

Captures a screenshot from the Unity Editor Game View as an image.

Community
Basic
tcobertcober

art-pipeline

Generate and validate pixel-art tilesets and sprite sheets for Godot RPGs.

Community
Advanced