扁平景觀傾印

本文將說明如何擷取場景資訊並讀取輸出內容。如果您想在為 Fuchsia 開發時,使用 Flatland 建立圖形檢視畫面,並對 Flatland 場景的狀態進行偵錯,這份指南就很實用。如要進一步瞭解 Flatland,請參閱 Flatland

檢查 Flatland 場景

您可以使用元件檢查功能,將 Flatland 場景的相關資訊轉儲:

ffx inspect show core/ui/scenic:root/scenic/FlatlandEngine:scene_dump

瞭解場景傾印輸出內容

場景資訊可分為三個部分:

拓撲學

輸出內容範例:


Topology:

2:0-| <-- (FlatlandDisplay)
 | 2:1-|
 |  | 4:1-|
 |  |  | 4:0-| <-- (SceneManager Display)
 |  |  |  | 4:2-|
 |  |  |  |  | 4:3-|
 |  |  |  |  |  | 4:4-|
 |  |  |  |  |  |  | 3:1-|
 |  |  | 4:5-|
 |  |  |  | 4:6-|
 |  |  |  |  | 5:1

拓樸結構部分會建立整個 Flatland 場景的 ASCII 表示法。

每個 Flatland 這組數字中的第一個數字是 *Flatland Instance ID*。代表哪個 Flatland 例項建立了該特定 Transform。組合中的第二個數字是 轉換 ID。這是使用者定義的轉換作業 ID,在執行個體建立的所有轉換作業中皆不重複。在上述範例中,(2:0)(2:1)(4:1) 等代表了轉換節點。使用 ID 2 的 Flatland 例項已建立兩個轉換 (02)。

每行只包含一個轉換節點,且可能包含偵錯名稱。您可以使用 fuchsia.ui.composition.Flatland.SetDebugName 指定偵錯名稱。在上述範例中,節點 (2:0) 具有偵錯名稱 FlatlandDisplay

-|」符號代表節點之間的父項/子項關係,可建立圖表結構。舉例來說,節點 (2:1) 是節點 (2:0) 的子項。如要進一步瞭解相關影響,請參閱 fuchsia.ui.composition.Flatland。簡而言之,這表示節點 (2:1) 會在節點 (2:0) 上方算繪。同樣地,系統會擷取兩個 Flatland 例項之間的關係。節點 (2:1) 和節點 (4:1) 之間有 Viewport/View 關係,其中根轉換節點 (4:1) 的內容 (以及轉換後產生的子節點圖表) 會顯示為節點 (2:1) 中的內容。

請注意,在上述範例中,節點 (4:1) 有兩個子節點:(4:0)(4:5)。直接子項節點會顯示在相同的縮排欄中。這兩個節點之間的線條代表子節點 (4:0) 的子圖。接續節點 (4:1) 的線條代表節點 (4:1) 的子圖。

拓樸圖一律會從螢幕的根節點開始。也就是說,任何未連結至「Display」圖表的 Flatland 例項Transform 都不會顯示在 ASCII 表示法中。

所有執行個體

輸出內容範例:


All Instances:

Instance 2 (FlatlandDisplay):
2:0-|
 | 2:1-|

Instance 4 (SceneManager Display):
4:1-|
 | 4:0-|
 |  | 4:2-|
 |  |  | 4:3-|
 |  |  |  | 4:4-|
   4:5-|
      4:6

Instance 3:
3:1-|

Instance 5:
5:1-|

Instance 6:
6:1-|
   6:2-|
      6-3-|

本節會列出 Flatland 執行個體的拓樸,但不會顯示執行個體之間的 Viewport/View 連線。ASCII 表示法類似,但每個 Flatland 例項會分別列出。

請注意,拓樸結構部分指出,系統只會顯示已連結至根顯示節點的例項拓樸結構。在這個輸出內容中,無論是否已連線至根顯示器拓撲,所有執行個體都會列出。在上述範例中,Instance 6 並未連線至根節點拓樸,因此在「拓樸」一節的範例中並未顯示。

圖片和圖片矩形

輸出內容範例:


Frame display-list contains 2 images and image-rectangles.
        image: size=1280x800  multiply_color=(1,1,1,1)  blend_mode=SRC
        transform: (4:3)
        rect: Rectangle2D[origin:(0, 0) extent:(1280, 800) clockwise_uvs:[(1, 0),(1, 1),(0, 1),(0, 0)]]
        image: size=64x64  multiply_color=(1,1,1,1)  blend_mode=SRC_OVER
        transform: (3:1)
        rect: Rectangle2D[origin:(128, 128) extent:(64, 64) clockwise_uvs:[(1, 0),(1, 1),(0, 1),(0, 0)]]

本節列出使用 fuchsia.ui.composition.Flatland.CreateImage 建立的平面圖圖片。每張圖片的資訊會以三行表示。

第一行顯示圖片屬性。蒐集的資料包括:

第二行顯示建立圖片的轉換節點。

第三行會列出圖片矩形的屬性。蒐集的資料包括:

  • 原點,代表矩形的左上角。
  • 代表矩形寬度和高度的範圍。
  • 順時針對應的 UV。從左上角開始,順時針旋轉,每個角落的 (x, y) 取樣點都會以 [0.0, 1.0] 範圍內的值表示。因此,順時針 UV 包含樣本區域、裁剪區域和旋轉的相關資訊。