Files
test/Assets/PerfectWorld/Scripts/Task/Doc/QuestTaskUI_Structure.md
T

8.4 KiB

Unity UI Structure for Quest/Task System

This document outlines a high-level Unity UI structure that mirrors the legacy C++ dialogs: DlgTask, DlgTaskList, DlgTaskTrace, DlgTaskConfirm, and the hint popup in DlgTaskConfirm. It provides an overview diagram, scene hierarchy, and per-GameObject component lists.


Diagram: UI Surfaces and Controllers

flowchart TD
  Canvas[(Canvas)]
  subgraph Windows
    QuestWin[QuestWindow (DlgTask)]
    TaskListWin[TaskListWindow (DlgTaskList)]
    TaskConfirmWin[TaskConfirmWindow (CDlgTaskConfirm)]
    TaskHintPop[TaskHintPopup (CDlgTaskHintPop)]
    QuestTraceMinion[QuestTraceMinion (DlgTaskTrace)]
  end

  Canvas --> QuestWin
  Canvas --> TaskListWin
  Canvas --> TaskConfirmWin
  Canvas --> TaskHintPop
  Canvas --> QuestTraceMinion

  subgraph Systems
    TaskService[TaskService]
    TaskTemplateRepo[TaskTemplateRepository]
    ElementDataService[ElementDataService]
  end

  TaskService --> QuestWin
  TaskService --> TaskListWin
  TaskService --> QuestTraceMinion
  TaskService --> TaskConfirmWin
  TaskService --> TaskHintPop
  TaskTemplateRepo --> QuestWin
  TaskTemplateRepo --> TaskListWin
  TaskTemplateRepo --> QuestTraceMinion
  ElementDataService --> QuestWin
  ElementDataService --> QuestTraceMinion

UI Hierarchy (Scene)

Canvas
├── QuestWindow (DlgTask)
│   ├── Header
│   │   ├── TitleText
│   │   └── CloseButton
│   ├── TopTabs
│   │   ├── HaveQuestToggle
│   │   └── SearchQuestToggle
│   ├── Body
│   │   ├── LeftPane
│   │   │   └── QuestTreeView (ScrollView)
│   │   └── RightPane
│   │       ├── Description (TextArea/ScrollView)
│   │       ├── ItemsAndAwards
│   │       │   ├── AwardItemsGrid
│   │       │   └── BaseAwardLabel
│   │       ├── ActionRow
│   │       │   ├── AbandonButton
│   │       │   ├── FinishTaskButton
│   │       │   └── GotoNPCButton
│   │       └── TraceRow
│   │           ├── ShowTraceToggle
│   │           └── TraceLabel
│   └── Footer
│       └── QuestCountLabel
├── TaskListWindow (DlgTaskList)
│   ├── Header (Title + Close)
│   ├── StorageInfo
│   │   ├── RefreshItemIcon
│   │   ├── RefreshRemainingLabel
│   │   └── DailyDeliverRemainingLabel
│   ├── TaskList (ScrollView)
│   └── Footer
│       ├── AcceptButton
│       └── RefreshButton
├── TaskConfirmWindow (CDlgTaskConfirm)
│   ├── Header (Title + MinimizeButton)
│   └── Content
│       ├── TaskRow[1..N]
│       │   ├── TaskNameLabel
│       │   └── DoneButton
│       └── AutoSizer
├── TaskHintPopup (CDlgTaskHintPop)
│   ├── Body
│   │   ├── MessageText
│   │   └── ShowTasksToConfirmButton (flashing)
│   └── CloseButton
└── QuestTraceMinion (DlgTaskTrace)
    ├── Header
    │   ├── Title
    │   ├── CollapseCheckbox
    │   └── ModeTabs (Traced | Titles | Contribution)
    ├── TraceText (TextArea/ScrollView + name-links)
    └── InlineButtons (positioned near hovered line)
        ├── UntraceButton
    	├── MapButton
    	├── ChatButton
    	└── FinishByContributionButton

Components per GameObject

  • Canvas

    • Components: Canvas, Canvas Scaler, Graphic Raycaster
    • Notes: Screen Space - Overlay (default) or Camera; match reference resolution for DPI scaling
  • QuestWindow (DlgTask)

    • Components: RectTransform, CanvasRenderer, Image
    • Scripts: QuestWindowController (maps to DlgTask behaviors)
    • Children and key components:
      • Header: HorizontalLayoutGroup, Image
        • TitleText: TextMeshProUGUI
        • CloseButton: Button, Image
      • TopTabs: HorizontalLayoutGroup
        • HaveQuestToggle: Toggle (ToggleGroup), Image, TextMeshProUGUI
        • SearchQuestToggle: Toggle (ToggleGroup), Image, TextMeshProUGUI
      • Body: HorizontalLayoutGroup
        • LeftPane
          • QuestTreeView: ScrollRect, Mask, Image
            • Viewport: RectTransform, Mask, Image
              • Content: VerticalLayoutGroup, ContentSizeFitter
                • TreeItem prefab(s): Button, LayoutElement, TextMeshProUGUI, Optional Expand/Collapse Toggle
        • RightPane
          • Description: ScrollRect, Mask, Image
            • Viewport -> Content: TextMeshProUGUI (rich text, link handlers)
          • ItemsAndAwards
            • AwardItemsGrid: GridLayoutGroup; ItemIcon prefab: Image, Button, TooltipTrigger
            • BaseAwardLabel: TextMeshProUGUI
          • ActionRow: HorizontalLayoutGroup
            • AbandonButton: Button, Image, TextMeshProUGUI
            • FinishTaskButton: Button, Image, TextMeshProUGUI
            • GotoNPCButton: Button, Image, TextMeshProUGUI
          • TraceRow: HorizontalLayoutGroup
            • ShowTraceToggle: Toggle, TextMeshProUGUI
            • TraceLabel: TextMeshProUGUI
      • Footer
        • QuestCountLabel: TextMeshProUGUI
  • TaskListWindow (DlgTaskList)

    • Components: RectTransform, Image
    • Scripts: TaskListWindowController (maps to DlgTaskList behaviors)
    • Children:
      • Header: TitleText (TextMeshProUGUI), CloseButton (Button)
      • StorageInfo: HorizontalLayoutGroup
        • RefreshItemIcon: Image, TooltipTrigger
        • RefreshRemainingLabel: TextMeshProUGUI
        • DailyDeliverRemainingLabel: TextMeshProUGUI
      • TaskList: ScrollRect, Mask, Image
        • Viewport -> Content: VerticalLayoutGroup
          • TaskRow prefab: Button, LayoutElement, TextMeshProUGUI
      • Footer: HorizontalLayoutGroup
        • AcceptButton: Button
        • RefreshButton: Button
  • TaskConfirmWindow (CDlgTaskConfirm)

    • Components: RectTransform, Image, VerticalLayoutGroup
    • Scripts: TaskConfirmWindowController
    • Children:
      • Header: TitleText (TextMeshProUGUI), MinimizeButton (Button)
      • Content: VerticalLayoutGroup, ContentSizeFitter
        • TaskRow prefab (repeat):
          • TaskNameLabel: TextMeshProUGUI
          • DoneButton: Button
  • TaskHintPopup (CDlgTaskHintPop)

    • Components: RectTransform, Image, ContentSizeFitter
    • Scripts: TaskHintPopupController
    • Children:
      • MessageText: TextMeshProUGUI
      • ShowTasksToConfirmButton: Button (with flashing/animation)
      • CloseButton: Button
  • QuestTraceMinion (DlgTaskTrace)

    • Components: RectTransform, Image
    • Scripts: QuestTraceMinionController (name-link text + hover inline buttons)
    • Children:
      • Header: HorizontalLayoutGroup
        • Title: TextMeshProUGUI
        • CollapseCheckbox: Toggle
        • ModeTabs: ToggleGroup
          • TracedToggle: Toggle, TextMeshProUGUI
          • TitlesToggle: Toggle, TextMeshProUGUI
          • ContributionToggle: Toggle, TextMeshProUGUI
      • TraceText: ScrollRect, Mask, Image
        • Viewport -> Content: TextMeshProUGUI (supports name-links via hyperlink callbacks)
      • InlineButtons (anchored to hovered line area):
        • UntraceButton: Button (hidden by default)
        • MapButton: Button
        • ChatButton: Button
        • FinishByContributionButton: Button

Mapping From C++ Dialogs to Unity Objects

  • DlgTask → QuestWindow + QuestWindowController

    • Tabs: Have vs Search mode → ToggleGroup state
    • TreeView + RightPane (Description, Items/Awards, Abandon/Finish/GotoNPC)
  • DlgTaskList → TaskListWindow + TaskListWindowController

    • Storage tasks, RefreshItem icon, Accept/Refresh actions
  • DlgTaskConfirm → TaskConfirmWindow + TaskConfirmWindowController

    • Dynamic list of confirmable tasks with Done buttons; auto-resize
  • CDlgTaskHintPop → TaskHintPopup + TaskHintPopupController

    • Flashing button to open TaskConfirmWindow
  • DlgTaskTrace → QuestTraceMinion + QuestTraceMinionController

    • Collapsible panel; modes: Traced | Titles | Contribution
    • Name-linked lines with inline Untrace/Map/Chat/Finish-by-Contribution

Notes and Recommendations

  • Prefer TextMeshPro for text rendering and link handling.
  • Implement a simple runtime TreeView using nested layout elements and expand/collapse toggles; or use UI Toolkit if available.
  • Keep each window as a prefab to support reuse and additive loading; wire controllers via serialized references.
  • Centralize data access in TaskService, TaskTemplateRepository, and ElementDataService to mirror TaskTemplMan, ElementDataMan, and task interfaces.