How-To: Display the Skill Tree
Goal: show a skill tree on screen and let the player interact with it. The ready-made screen and canvas live in the CrimsonCore plugin - you create Blueprint children, set a few defaults, and push the screen onto your UI. No code required.
UCrimsonSkillTreeManager on your player (see Quick Start), and a UCrimsonInputConfig asset for the UI input actions.1. Create the canvas and screen widgets
Canvas - a Widget Blueprint with parent class UCrimsonCoreSkillTreeGraph; add a Canvas Panel named NodeCanvasPanel (its BindWidget slot).
Screen - a Widget Blueprint with parent class UCrimsonCoreSkillTreeScreen; add your canvas widget to it as a child named SkillTreeGraph (its BindWidget slot).
Node style (optional) - a Widget Blueprint child of UCrimsonSkillTreeWidget_Node (implement On Update Node Appearance / On Node Hovered), assigned on the asset's GraphConfig Default Node Widget Class.
2. Configure the screen
On the screen Blueprint's Class Defaults:
| Setting | Value |
|---|---|
Default Skill Tree Type Tag | The tag of the tree to display |
UI Input Config | Your UCrimsonInputConfig asset |
Zoom / Pan Move / Pan Toggle / Primary / Secondary Tag | The UI input tag for each action |
Input Config | GameAndMenu - so input reaches the screen while it is open |
Game Mouse Capture Mode | CapturePermanently - keeps viewport focus so the cursor capture does not collapse on a click (the screen relies on this) |
Ignore Move / Look Input | true - don't drive the character while the menu is up |
Zoom Speed Factor / Min / Max Zoom Scale / Initial Canvas Scale | Zoom feel (optional) |
3. Author the input actions
In your UCrimsonInputConfig, add one UI Input Action per tag above. Any key works for any action - mouse buttons, wheel, mouse XY, keyboard, or gamepad - and all are rebindable:
| Action | Input Action value type | Typical key |
|---|---|---|
| Zoom | Axis1D | Mouse wheel |
| Pan Move | Axis2D | Mouse XY |
| Pan Toggle | Digital (hold) | Middle mouse |
| Primary | Digital | Left mouse / confirm |
| Secondary | Digital | Right mouse / cancel |
4. Show it
Push your screen Blueprint onto your CommonUI Menu layer. It resolves the local player's skill-tree manager, populates the canvas, and starts responding to the configured input. The selected-node detail (name, description, costs, level) is available for binding via the screen's view-model.
Ignore Move / Look Input covers movement and camera. To also suppress ability inputs while the menu is open, exclude your gameplay Input Mapping Contexts when a menu is active (Enhanced Input input-mode filtering).