diff --git a/.claude-plugin/CLAUDE.md b/.claude-plugin/CLAUDE.md index c6768bfe..bae9f1fd 100644 --- a/.claude-plugin/CLAUDE.md +++ b/.claude-plugin/CLAUDE.md @@ -10,7 +10,7 @@ Unity framework for runtime hot updates. Unity 2022.3+, C#. ### JEngine.UI (com.jasonxudeveloper.jengine.ui) - **MessageBox**: Async modal dialogs with UniTask (runtime) -- **Editor Components**: JButton, JTextField, JStack, JCard, etc. (editor) +- **Editor Components**: JButton, JTextField, JStack, JCard, JTabView, etc. (editor) - **Design Tokens**: Theme-aware colors, spacing, typography ## Key Patterns diff --git a/.claude-plugin/plugin.json b/.claude-plugin/plugin.json index 7b34e53f..ffef09b7 100644 --- a/.claude-plugin/plugin.json +++ b/.claude-plugin/plugin.json @@ -1,7 +1,7 @@ { "name": "jengine", "description": "AI guide for game development with JEngine Unity hot-update framework", - "version": "1.0.6", + "version": "1.1.0", "author": { "name": "JasonXuDeveloper" }, diff --git a/.claude-plugin/skills/editor-ui/SKILL.md b/.claude-plugin/skills/editor-ui/SKILL.md index 90fd827b..73a1f8c6 100644 --- a/.claude-plugin/skills/editor-ui/SKILL.md +++ b/.claude-plugin/skills/editor-ui/SKILL.md @@ -1,6 +1,6 @@ --- name: editor-ui -description: JEngine Editor UI component library with theming. Triggers on: custom inspector, editor window, Unity editor UI, UIElements, VisualElement, JButton, JStack, JCard, JTextField, JDropdown, design tokens, dark theme, light theme, editor styling, themed button, form layout, progress bar, status bar, toggle button, button group +description: JEngine Editor UI component library with theming. Triggers on: custom inspector, editor window, Unity editor UI, UIElements, VisualElement, JButton, JStack, JCard, JTextField, JDropdown, JTabView, tab view, tabbed container, design tokens, dark theme, light theme, editor styling, themed button, form layout, progress bar, status bar, toggle button, button group --- # JEngine Editor UI Components @@ -241,6 +241,28 @@ bc.SetPath("New", "Path"); bc.Clear(); ``` +### JTabView - Tabbed Container +```csharp +// Basic tab view +var tabs = new JTabView() + .AddTab("General", generalContent) + .AddTab("Advanced", advancedContent) + .AddTab("Debug", debugContent); + +// Responsive: max 3 tabs per row before wrapping +var responsiveTabs = new JTabView(maxTabsPerRow: 3) + .AddTab("Tab 1", content1) + .AddTab("Tab 2", content2); + +// Programmatic selection (zero-based index: 0=General, 1=Advanced, 2=Debug) +tabs.SelectTab(2); // Select "Debug" tab + +// Read state +int selected = tabs.SelectedIndex; // -1 if no tabs +int count = tabs.TabCount; +int maxPerRow = tabs.MaxTabsPerRow; +``` + ## Design Tokens The `Tokens` class provides named constants that adapt to Unity's dark/light theme. @@ -365,7 +387,7 @@ enum AlignItems { Start, Center, End, Stretch } ## Game Development Examples -### Settings Panel +### Settings Panel (with Tabs) ```csharp public class GameSettingsWindow : EditorWindow { @@ -384,8 +406,8 @@ public class GameSettingsWindow : EditorWindow root.style.paddingBottom = Tokens.Spacing.Lg; root.style.paddingLeft = Tokens.Spacing.Lg; - // Graphics Section - var graphics = new JSection("Graphics") + // Graphics tab content + var graphics = new JStack(GapSize.MD) .Add( new JFormField("VSync", _vsyncToggle = new JToggle(true)), new JFormField("Target FPS", _fpsDropdown = new JDropdown( @@ -394,17 +416,22 @@ public class GameSettingsWindow : EditorWindow formatSelectedValue: static fps => fps == -1 ? "Unlimited" : $"{fps} FPS", formatListItem: static fps => fps == -1 ? "Unlimited" : $"{fps} FPS"))); - // Audio Section - var audio = new JSection("Audio") + // Audio tab content + var audio = new JStack(GapSize.MD) .Add(new JFormField("Master Volume", _volumeSlider = new JProgressBar(0.8f) .WithHeight(20))); + // Tabbed settings + var tabs = new JTabView() + .AddTab("Graphics", graphics) + .AddTab("Audio", audio); + // Actions var actions = new JButtonGroup( new JButton("Apply", ApplySettings, ButtonVariant.Primary), new JButton("Reset", ResetSettings, ButtonVariant.Secondary)); - root.Add(graphics, audio, actions); + root.Add(tabs, actions); rootVisualElement.Add(root); } } diff --git a/CLAUDE.md b/CLAUDE.md index 67e4e9a8..56c783ae 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -92,3 +92,4 @@ Document all public APIs with XML comments. - [ ] Thread-safe where needed - [ ] Proper resource cleanup - [ ] Unit tests added for non-core package changes +- [ ] Plugin skill docs updated for new/changed JEngine.Util or JEngine.UI APIs (see `.claude/rules/plugin-maintenance.md`)