skills.rest
vchelaru
vchelaruCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

gum-tool-tree-view

Documents the Gum editor's WPF element tree view architecture, refresh model, and icon system.

614|78|Updated Mar 11, 2015
Search Tags:#drag and drop#UI architecture#treeview#WPF#themING#editor tooling#gum
One-click install
npx skills add https://github.com/vchelaru/Gum --skill gum-tool-tree-view
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: gum-tool-tree-view
Source: https://github.com/vchelaru/Gum/tree/main/.claude/skills/gum-tool-tree-view
Command: npx skills add https://github.com/vchelaru/Gum --skill gum-tool-tree-view

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Developers modifying the Gum editor's left-hand element tree panel need to understand its non-obvious architecture—model-based selection, diff-based refresh, drag payload workarounds, and icon tinting—before making changes that could silently break selection, expansion state, or theming.

Core Features & Use Cases

  • File Map: Locates every relevant source file, from GumTreeView.cs and ElementTreeViewManager to TreeIconRegistry and the headless Gum.Presentation logic twins.
  • Architecture Guidance: Explains why selection lives on GumTreeNode rather than TreeViewItem, how diff-based RefreshUi() preserves scroll and selection, and how RefreshCoalescer batches bulk imports.
  • Gotcha Catalog: Documents pitfalls like remove-then-insert reordering, TreeDragPayload replacing DataObject, backslash-separated FullPath, and persisted expansion state formats.
  • Use Case: When adding a new node type or icon to the Gum tree panel, follow the documented steps—add a constant in TreeNodeImageIndices, register it in TreeIconRegistry, and supply a white-on-transparent PNG.

Quick Start

Ask the AI to explain how to add a new icon or node type to the Gum element tree panel using this reference.

Frequently Asked Questions about gum-tool-tree-view

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

FAQPage Schema
How do I add a new icon to the Gum element tree view?▼

Add a constant in TreeNodeImageIndices and a matching entry in TreeIconRegistry mapping the index to a pack URI and theme color key. The source PNG must be white-on-transparent so theme tinting via OpacityMask renders correctly.

How does selection work in the Gum WPF TreeView?▼

Selection is tracked on the GumTreeNode model, not on TreeViewItem containers, because WPF TreeView enforces single selection. GumTreeView handles keyboard navigation in OnKeyDown and the row template binds its selected visual to GumTreeNode.IsSelected.

Why does drag and drop in the Gum tree not use the DataObject?▼

Gum's *Save types are not serializable, so anything placed on the DataObject returns null. Drag payloads travel in the static TreeDragPayload instead, with the data object carrying only a marker format.

Why does reordering tree nodes throw an exception in Gum?▼

GumTreeNodeCollection throws if a node is inserted into the collection it already belongs to, because detaching first would shift the caller's computed index. Reordering within one collection must be done as remove-then-insert.

Does the Gum tree view support UI virtualization?▼

No, virtualization is intentionally off, which is the WPF TreeView default. This keeps GumTreeView.ContainerFor and EnsureVisible reliable, since enabling virtualization would break container lookup for off-screen nodes.

Related Skills

Explore More Software Engineering Skills→
vchelaruvchelaru
597

gum-tool-delete-logic

Orchestrate Gum UI deletion workflows with confirmation dialogs and undo locks.

Community
Intermediate
jiaiyanjiaiyan
21

el-tree

Organize hierarchical data into an interactive Element Plus el-tree UI with selection, filtering, and drag-and-drop.

Community
Intermediate
vchelaruvchelaru
597

gum-tool-variable-grid

Guide developers through Gum's Variables tab and DataUiGrid system.

Community
Basic
syncfusionsyncfusion
5

syncfusion-wpf-breadcrumb

Implement Syncfusion WPF HierarchyNavigator breadcrumbs for hierarchical navigation.

Official
Advanced