Skip to content

Create advanced examples and API reference#113

Merged
thomasnemer merged 1 commit intomainfrom
16-create-advanced-examples-and-api-reference
Nov 11, 2025
Merged

Create advanced examples and API reference#113
thomasnemer merged 1 commit intomainfrom
16-create-advanced-examples-and-api-reference

Conversation

@thomasnemer
Copy link
Copy Markdown
Contributor

Summary

This PR implements issue #16 by adding comprehensive intermediate and advanced examples plus API reference documentation for the Prong UI framework.

Changes

Intermediate Examples (examples/intermediate/)

01_nested_panels - Complex nested layout composition

  • Demonstrates FlexLayout containing GridLayout containing StackLayout
  • Multiple levels of panel nesting with different layout strategies
  • Shows layout composition patterns

02_responsive_ui - Window resize behavior

  • Demonstrates ResizeBehavior (FIXED, SCALE, FILL)
  • Shows AxisResizeBehavior for per-axis control
  • Includes ResponsiveConstraints with min/max bounds
  • Real-time window resize handling

03_event_handling - Advanced event patterns

  • Custom InteractivePanel with handleEventSelf override
  • Mouse interactions: click, drag, hover states
  • Keyboard shortcuts and focus management
  • Event propagation demonstration

04_dynamic_layout - Runtime UI changes

  • Add/remove components dynamically
  • Switch between 5 different layout managers at runtime
  • Control panel with 9 interactive buttons
  • Shows invalidateLayout() usage

Advanced Examples (examples/advanced/)

01_custom_component - ColorPicker custom component

  • Full CRTP implementation inheriting from Component
  • Custom render() and handleEventSelf() implementations
  • Builder pattern for construction
  • Callback system for value changes

02_custom_layout - CircularLayout implementation

  • Custom layout manager using CRTP pattern
  • Implements measureLayout() and layout() methods
  • Positions 8 buttons in a circle using trigonometry

03_custom_renderer - IRenderer interface demonstration

  • Shows frame lifecycle (beginFrame/endFrame)
  • Demonstrates all IRenderer methods
  • Comprehensive README explaining renderer integration

04_performance - Performance optimization demo

  • 100 components in GridLayout
  • FPS counter showing performance
  • README with optimization guidelines

API Reference Documentation (docs/api/)

README.md - Navigation hub for all API documentation

  • Quick links to all sections
  • Architecture overview
  • Common patterns and examples
  • Building applications guide

QUICK_REFERENCE.md - Condensed one-page reference

  • All core classes with signatures
  • All 7 UI components
  • All 5 layout managers
  • Event handling patterns
  • Common code patterns
  • Performance tips

core/Component.md - Detailed Component API documentation

  • Full class declaration
  • Coordinate systems explanation
  • Ownership model
  • Event handling
  • Resize behavior
  • Usage patterns and best practices

Build Status

✅ All 8 new examples compile successfully
✅ All examples run without errors
✅ Code formatted with clang-format
✅ Git hooks passed

Files Changed

  • 28 files added
  • 4016 lines of code and documentation
  • 0 deletions (purely additive)

Testing

All examples have been built and verified to compile successfully with:

mise build-examples

Resolves #16

This commit implements issue #16 by adding:

**Intermediate Examples (examples/intermediate/):**
- 01_nested_panels: Complex nested layout composition with FlexLayout, GridLayout, and StackLayout
- 02_responsive_ui: Window resize behavior with ResizeBehavior, AxisResizeBehavior, and ResponsiveConstraints
- 03_event_handling: Advanced event patterns with custom event handling and focus management
- 04_dynamic_layout: Runtime UI changes with dynamic component addition/removal and layout switching

**Advanced Examples (examples/advanced/):**
- 01_custom_component: ColorPicker custom component demonstrating CRTP pattern, custom render/event handling, and builder pattern
- 02_custom_layout: CircularLayout implementation showing custom layout manager creation with CRTP
- 03_custom_renderer: IRenderer interface demonstration showing frame lifecycle and rendering concepts
- 04_performance: Performance optimization techniques with 100-component GridLayout and FPS counter

**API Reference Documentation (docs/api/):**
- README.md: Navigation hub for all API documentation
- QUICK_REFERENCE.md: Condensed one-page reference for quick lookup
- core/Component.md: Detailed Component class API documentation

All examples compile successfully and include:
- Complete CMakeLists.txt for each example
- Comprehensive README.md explaining concepts and usage
- Well-commented, educational source code
- Progressive complexity from intermediate to advanced topics

Resolves #16
@thomasnemer thomasnemer merged commit 369efe7 into main Nov 11, 2025
1 check passed
@thomasnemer thomasnemer deleted the 16-create-advanced-examples-and-api-reference branch November 11, 2025 10:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Create advanced examples and API reference

1 participant