# アーキテクチャ構成図

## システム全体構成図

```mermaid
graph TB
    subgraph "Application Layer"
        APP[Application]
        BUILDER[AppBuilder]
        LIFETIME[ApplicationLifetimes]
    end

    subgraph "Controls Layer"
        CONTROLS[Avalonia.Controls]
        TEMPLATES[Templates]
        PRIMITIVES[Primitives]
        PRESENTERS[Presenters]
    end

    subgraph "Markup Layer"
        XAML[Avalonia.Markup.Xaml]
        XAML_LOADER[XAML Loader]
        MARKUP[Avalonia.Markup]
    end

    subgraph "Base Layer"
        AVO[AvaloniaObject]
        PROP[AvaloniaProperty]
        STYLED[StyledElement]
        VISUAL[Visual]
        STYLING[Styling System]
        DATA[Data Binding]
        INPUT[Input System]
        MEDIA[Media/Graphics]
    end

    subgraph "Rendering Layer"
        COMPOSITOR[Compositor]
        RENDER_LOOP[RenderLoop]
        COMP_RENDERER[CompositingRenderer]
        IMM_RENDERER[ImmediateRenderer]
    end

    subgraph "Platform Abstraction"
        PLAT_RENDER[IPlatformRenderInterface]
        PLAT_WINDOW[IWindowImpl]
        PLAT_INPUT[Input Platform]
        PLAT_SETTINGS[IPlatformSettings]
    end

    subgraph "Platform Implementations"
        WIN32[Avalonia.Win32]
        NATIVE[Avalonia.Native macOS]
        X11[Avalonia.X11]
        BROWSER[Avalonia.Browser]
        ANDROID[Avalonia.Android]
        IOS[Avalonia.iOS]
    end

    subgraph "Rendering Backends"
        SKIA[Avalonia.Skia]
        OPENGL[Avalonia.OpenGL]
        VULKAN[Avalonia.Vulkan]
        METAL[Avalonia.Metal]
    end

    subgraph "Themes"
        FLUENT[Fluent Theme]
        SIMPLE[Simple Theme]
    end

    APP --> BUILDER
    APP --> LIFETIME
    APP --> CONTROLS

    CONTROLS --> TEMPLATES
    CONTROLS --> PRIMITIVES
    CONTROLS --> PRESENTERS

    XAML --> XAML_LOADER
    XAML --> MARKUP
    XAML --> CONTROLS

    CONTROLS --> AVO
    CONTROLS --> STYLED
    CONTROLS --> VISUAL

    AVO --> PROP
    STYLED --> AVO
    VISUAL --> STYLED

    VISUAL --> STYLING
    VISUAL --> DATA
    VISUAL --> INPUT
    VISUAL --> MEDIA

    VISUAL --> COMPOSITOR
    COMPOSITOR --> RENDER_LOOP
    COMPOSITOR --> COMP_RENDERER

    COMP_RENDERER --> PLAT_RENDER
    PLAT_RENDER --> PLAT_WINDOW
    PLAT_RENDER --> PLAT_INPUT
    PLAT_RENDER --> PLAT_SETTINGS

    PLAT_RENDER --> WIN32
    PLAT_RENDER --> NATIVE
    PLAT_RENDER --> X11
    PLAT_RENDER --> BROWSER
    PLAT_RENDER --> ANDROID
    PLAT_RENDER --> IOS

    WIN32 --> SKIA
    NATIVE --> SKIA
    X11 --> SKIA
    BROWSER --> SKIA
    ANDROID --> SKIA
    IOS --> SKIA

    WIN32 --> OPENGL
    WIN32 --> VULKAN
    NATIVE --> METAL
    X11 --> OPENGL
    X11 --> VULKAN

    APP --> FLUENT
    APP --> SIMPLE

    style APP fill:#4CAF50,color:#fff
    style CONTROLS fill:#2196F3,color:#fff
    style AVO fill:#9C27B0,color:#fff
    style COMPOSITOR fill:#FF9800,color:#fff
    style SKIA fill:#F44336,color:#fff
```

## レイヤー詳細図

```mermaid
graph LR
    subgraph "Avalonia.Base (Core)"
        direction TB
        AVO_OBJ["AvaloniaObject<br/>依存プロパティシステム"]
        PROP_SYS["AvaloniaProperty<br/>プロパティ定義"]
        VALUE_STORE["ValueStore<br/>プロパティ値管理"]

        AVO_OBJ --> PROP_SYS
        AVO_OBJ --> VALUE_STORE
    end

    subgraph "Visual Tree"
        direction TB
        VISUAL_NODE["Visual<br/>ビジュアルノード"]
        STYLED_ELEM["StyledElement<br/>スタイル適用"]
        INPUT_ELEM["InputElement<br/>入力処理"]

        INPUT_ELEM --> STYLED_ELEM
        STYLED_ELEM --> VISUAL_NODE
        VISUAL_NODE --> AVO_OBJ
    end

    subgraph "Styling"
        direction TB
        STYLE["Style<br/>スタイル定義"]
        SELECTOR["Selector<br/>セレクタ"]
        SETTER["Setter<br/>プロパティ設定"]
        THEME_VAR["ThemeVariant<br/>テーマ切替"]

        STYLE --> SELECTOR
        STYLE --> SETTER
        STYLE --> THEME_VAR
    end

    subgraph "Data Binding"
        direction TB
        BINDING["Binding<br/>バインディング"]
        COMPILED["CompiledBinding<br/>コンパイル済み"]
        REFLECTION["ReflectionBinding<br/>リフレクション"]

        BINDING --> COMPILED
        BINDING --> REFLECTION
    end
```

## コントロール階層図

```mermaid
classDiagram
    class AvaloniaObject {
        +PropertyChanged event
        +GetValue()
        +SetValue()
        +Bind()
    }

    class StyledElement {
        +Styles
        +Resources
        +DataContext
        +Classes
    }

    class Visual {
        +Bounds
        +ClipToBounds
        +Opacity
        +RenderTransform
        +InvalidateVisual()
    }

    class Layoutable {
        +Width
        +Height
        +Margin
        +HorizontalAlignment
        +VerticalAlignment
        +Measure()
        +Arrange()
    }

    class InputElement {
        +IsEnabled
        +Focusable
        +IsKeyboardFocusWithin
        +PointerPressed event
        +KeyDown event
    }

    class Control {
        +Tag
        +ContextMenu
        +ToolTip
    }

    class ContentControl {
        +Content
        +ContentTemplate
    }

    class ItemsControl {
        +Items
        +ItemTemplate
        +ItemsPanel
    }

    class TemplatedControl {
        +Template
        +ApplyTemplate()
    }

    AvaloniaObject <|-- StyledElement
    StyledElement <|-- Visual
    Visual <|-- Layoutable
    Layoutable <|-- InputElement
    InputElement <|-- Control
    Control <|-- TemplatedControl
    TemplatedControl <|-- ContentControl
    TemplatedControl <|-- ItemsControl
```

## 入力イベントフロー図

```mermaid
sequenceDiagram
    participant Native as Native Window
    participant Platform as Platform Layer
    participant InputMgr as InputManager
    participant Pointer as PointerOverPreProcessor
    participant Visual as Visual Tree
    participant Control as Control
    participant Handler as Event Handler

    Native->>Platform: Raw Input Event
    Platform->>InputMgr: RawInputEventArgs
    InputMgr->>Pointer: Process Input
    Pointer->>Visual: Hit Test
    Visual-->>Pointer: Target Visual
    Pointer->>Control: Route Event (Tunnel)
    Control->>Control: Preview* Event
    Control->>Handler: Bubble Event
    Handler-->>Control: Handled
```

## レンダリングパイプライン図

```mermaid
flowchart TB
    subgraph "UI Thread"
        INVALIDATE[InvalidateVisual]
        LAYOUT[Layout Pass<br/>Measure/Arrange]
        COMP_UPDATE[Composition Update]
    end

    subgraph "Compositor"
        SYNC[UI/Render Sync]
        BATCH[Batch Changes]
        COMMIT[Commit to GPU]
    end

    subgraph "Render Thread"
        SCENE[Scene Graph]
        DRAW_CTX[DrawingContext]
        DRAW_CMD[Drawing Commands]
    end

    subgraph "GPU Backend (Skia)"
        SKIA_CTX[Skia Context]
        GPU_CMD[GPU Commands]
        SWAP[Swapchain Present]
    end

    INVALIDATE --> LAYOUT
    LAYOUT --> COMP_UPDATE
    COMP_UPDATE --> SYNC
    SYNC --> BATCH
    BATCH --> COMMIT
    COMMIT --> SCENE
    SCENE --> DRAW_CTX
    DRAW_CTX --> DRAW_CMD
    DRAW_CMD --> SKIA_CTX
    SKIA_CTX --> GPU_CMD
    GPU_CMD --> SWAP
```

## プラットフォーム抽象化図

```mermaid
graph TB
    subgraph "Platform Interface Layer"
        IWI[IWindowImpl]
        IPRI[IPlatformRenderInterface]
        IPS[IPlatformSettings]
        IPT[IPlatformThreadingInterface]
    end

    subgraph "Windows Implementation"
        WIN_WI[WindowImpl<br/>Win32 Window]
        WIN_RI[D3D11/ANGLE<br/>Render Interface]
        WIN_PS[Win32 Settings]
        WIN_TI[Win32 Threading]
    end

    subgraph "macOS Implementation"
        MAC_WI[NSWindow<br/>Wrapper]
        MAC_RI[Metal/OpenGL<br/>Render Interface]
        MAC_PS[macOS Settings]
        MAC_TI[Cocoa RunLoop]
    end

    subgraph "Linux Implementation"
        X11_WI[X11 Window]
        X11_RI[Vulkan/OpenGL<br/>Render Interface]
        X11_PS[FreeDesktop Settings]
        X11_TI[X11 Event Loop]
    end

    subgraph "Browser Implementation"
        WEB_WI[Canvas Element]
        WEB_RI[WebGL/Canvas 2D]
        WEB_PS[Browser Settings]
        WEB_TI[RequestAnimationFrame]
    end

    IWI --> WIN_WI
    IWI --> MAC_WI
    IWI --> X11_WI
    IWI --> WEB_WI

    IPRI --> WIN_RI
    IPRI --> MAC_RI
    IPRI --> X11_RI
    IPRI --> WEB_RI

    IPS --> WIN_PS
    IPS --> MAC_PS
    IPS --> X11_PS
    IPS --> WEB_PS

    IPT --> WIN_TI
    IPT --> MAC_TI
    IPT --> X11_TI
    IPT --> WEB_TI
```

## モジュール依存関係図

```mermaid
graph TB
    subgraph "Core Packages"
        BASE[Avalonia.Base]
        CONTROLS[Avalonia.Controls]
        MARKUP[Avalonia.Markup]
        XAML[Avalonia.Markup.Xaml]
        REMOTE[Avalonia.Remote.Protocol]
    end

    subgraph "Rendering"
        SKIA[Avalonia.Skia]
        OPENGL[Avalonia.OpenGL]
        VULKAN[Avalonia.Vulkan]
        METAL[Avalonia.Metal]
    end

    subgraph "Platform"
        WIN32[Avalonia.Win32]
        NATIVE[Avalonia.Native]
        X11[Avalonia.X11]
        FREEDSK[Avalonia.FreeDesktop]
        BROWSER[Avalonia.Browser]
        ANDROID[Avalonia.Android]
        IOS[Avalonia.iOS]
    end

    subgraph "Themes"
        FLUENT[Avalonia.Themes.Fluent]
        SIMPLE[Avalonia.Themes.Simple]
    end

    subgraph "Meta Package"
        AVA[Avalonia]
        DESKTOP[Avalonia.Desktop]
    end

    CONTROLS --> BASE
    CONTROLS --> REMOTE
    MARKUP --> BASE
    XAML --> BASE
    XAML --> CONTROLS
    XAML --> MARKUP

    FLUENT --> BASE
    FLUENT --> CONTROLS
    SIMPLE --> BASE
    SIMPLE --> CONTROLS

    WIN32 --> AVA
    NATIVE --> AVA
    X11 --> FREEDSK
    FREEDSK --> AVA
    BROWSER --> AVA
    ANDROID --> AVA
    IOS --> AVA

    AVA --> BASE
    AVA --> CONTROLS
    AVA --> XAML
    AVA --> SKIA

    DESKTOP --> AVA
    DESKTOP --> WIN32
    DESKTOP --> NATIVE
    DESKTOP --> X11
```

## データバインディングフロー図

```mermaid
flowchart LR
    subgraph "Source"
        VM[ViewModel]
        PROP[Property]
        INPC[INotifyPropertyChanged]
    end

    subgraph "Binding System"
        BIND[BindingExpression]
        PATH[Property Path]
        CONV[ValueConverter]
        PRIO[BindingPriority]
    end

    subgraph "Target"
        CTRL[Control]
        AVA_PROP[AvaloniaProperty]
        VALUE[Effective Value]
    end

    VM --> PROP
    PROP --> INPC
    INPC --> BIND

    BIND --> PATH
    PATH --> CONV
    CONV --> PRIO

    PRIO --> AVA_PROP
    AVA_PROP --> VALUE
    VALUE --> CTRL

    CTRL -.-> |TwoWay| BIND
```
