Goals

• 梳理从应用启动到渲染上屏的完整调用链
• 创建可视化时序图展示各模块间的交互关系
• 明确 ace_engine_lite、ui_lite、graphic_utils_lite 三个仓库的协作关系

Non-Goals

• 不涉及具体硬件驱动实现细节
• 不深入讨论JS引擎执行机制

渲染流程时序图

sequenceDiagram
    participant App as 应用层<br/>(JS/HML/CSS)
    participant ACE as ACE Engine<br/>lite
    participant ViewMgr as ViewManager<br/>(视图管理)
    participant RootView as RootView<br/>(根视图)
    participant RenderMgr as RenderManager<br/>(渲染调度)
    participant UIView as UIView<br/>(视图组件)
    participant GfxEngine as BaseGfxEngine<br/>(图形引擎)
    participant DrawUtils as DrawUtils<br/>(绘制工具)
    participant GfxDriver as GfxEngines<br/>(驱动封装)
    participant Display as 显示驱动<br/>(FrameBuffer)

    Note over App,Display: 阶段1: 应用初始化
    App->>ACE: 启动应用 (Ability启动)
    ACE->>ACE: 解析HML/CSS/JS
    ACE->>ViewMgr: 创建组件树
    ViewMgr->>RootView: Attach到RootView
    
    Note over App,Display: 阶段2: 视图树构建
    RootView->>RootView: InitDrawContext()
    RootView->>GfxEngine: GetFBBufferInfo()
    GfxEngine-->>RootView: 返回帧缓冲区信息
    
    Note over App,Display: 阶段3: 无效区域标记
    App->>ACE: setState/setProperty
    ACE->>UIView: Invalidate()
    UIView->>RootView: AddInvalidateRect(rect)
    RootView->>RootView: OptimizeAddRect(rect)
    
    Note over App,Display: 阶段4: 渲染调度触发
    RenderMgr->>RenderMgr: Callback() [定时触发]
    RenderMgr->>RootView: Measure()
    RootView->>UIView: MeasureView()
    UIView->>UIView: ReMeasure()
    
    Note over App,Display: 阶段5: 视图树绘制
    RenderMgr->>RootView: Render()
    RootView->>RenderMgr: RenderRect(flushRect)
    RenderMgr->>RootView: GetTopUIView(mask)
    RootView->>RootView: DrawTop(view, rect)
    
    loop 遍历视图树
        RootView->>UIView: OnDraw(buffer, rect)
        UIView->>GfxEngine: DrawRect() / DrawLine() / Blit()
        GfxEngine->>DrawUtils: FillAreaWithSoftWare()
        DrawUtils-->>GfxEngine: 完成绘制
        
        alt 有子视图
            UIView->>UIView: 递归绘制子视图
        end
        
        RootView->>UIView: OnPostDraw(buffer, rect)
        UIView->>UIView: DrawViewBounds() [调试模式]
    end
    
    Note over App,Display: 阶段6: 缓冲区刷新上屏
    RootView->>GfxEngine: Flush(flushRect)
    
    alt 软件渲染
        GfxEngine->>GfxDriver: GfxFillArea() / GfxBlit()
        GfxDriver->>Display: 写入FrameBuffer
    else 硬件加速
        GfxEngine->>Display: GPU命令提交
    end
    
    Display-->>Display: 屏幕刷新(VSync)

调用链路详解

阶段1: 应用初始化

阶段2: 视图树构建

// RootView::InitDrawContext()
void RootView::InitDrawContext()
{
    dc_.bufferInfo = BaseGfxEngine::GetInstance()->GetFBBufferInfo();
    InitMapBufferInfo(dc_.bufferInfo);  // 初始化变换缓冲区
}

阶段3: 脏区标记

// UIView::Invalidate() -> RootView::AddInvalidateRect()
void UIView::Invalidate()
{
    // 向上遍历找到RootView
    while (view != nullptr) {
        if (view->transMap_ != nullptr && !view->GetTransformMap().IsInvalid()) {
            InvalidateRect(view->GetRect(), view);
            return;
        }
        view = view->parent_;
    }
    InvalidateRect(GetFullRect());  // 标记完整区域
}

阶段4: 渲染调度

// RenderManager::Callback() 定时触发
void RenderManager::Callback()
{
    RootView* rootView = RootView::GetInstance();
    rootView->Measure();   // 测量阶段
    rootView->Render();    // 渲染阶段
    UpdateFPS();          // FPS计算
}

阶段5: 视图树绘制

// RootView::DrawTop() - 核心绘制逻辑
void RootView::DrawTop(UIView* view, const Rect& rect)
{
    // 栈式遍历视图树
    while (par != nullptr) {
        if (curView->IsVisible()) {
            curView->OnDraw(*dc_.bufferInfo, curViewRect);  // 绘制
            // 递归子视图...
            curView->OnPostDraw(*dc_.bufferInfo, curViewRect); // 后处理
        }
        curView = curView->GetNextRenderSibling();
    }
}

阶段6: 缓冲区刷新

// BaseGfxEngine::Flush()
void SoftEngine::Flush(const Rect& flushRect)
{
    // 软件渲染直接写入FrameBuffer
    // 硬件渲染提交GPU命令
}

三个仓库的协作关系

graph TD
    subgraph ace_engine_lite
        A1[JS解析器]
        A2[组件工厂]
        A3[布局引擎]
    end
    
    subgraph ui_lite
        U1[UIView/ViewGroup]
        U2[RootView]
        U3[RenderManager]
        U4[BaseGfxEngine接口]
        U5[SoftEngine实现]
    end
    
    subgraph graphic_utils_lite
        G1[GfxEngines驱动封装]
        G2[DrawUtils绘制工具]
        G3[图形数学工具]
    end
    
    A1 --> A2
    A2 --> A3
    A3 --> U1
    U1 --> U2
    U2 --> U3
    U3 --> U4
    U4 --> U5
    U5 --> G2
    U5 --> G1
    G1 --> Display[显示驱动]

关键数据流

性能优化机制

1. 脏区优化: 只重绘标记的无效区域，避免全屏刷新
2. 视图树剪枝: IsVisible() 检查跳过不可见视图
3. 透明度继承: GetMixOpaScale() 计算累积透明度
4. 栈式遍历: 避免递归深度限制，支持更深的视图嵌套