扁平景觀傾印

本文件將說明如何傾印作業的 Flatland 並在場景中讀取輸出內容這份指南很實用 而且在開發應用程式 Fuchsia 並使用 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

拓撲區段會建立整個平面的 ASCII 表示法 場景。

所有平地 轉換 節點代表的是 數字。組合中的第一個數字是 *Flatland 執行個體 ID*。這項服務 代表建立了該特定 Transform 的哪個 Flatland 執行個體。 組合中的第二個數字是轉換 ID。這是使用者定義 轉換的識別碼，在 執行個體。在上例中，(2:0)、(2:1)、(4:1) (等) 代表 轉換節點。ID 為 2 的 Flatland 執行個體建立了兩個 轉換 (0 和 2)。

每一行只包含一個轉換節點，且可能包含偵錯名稱。 偵錯名稱可使用 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)」節點有 可視區域/檢視區塊關係，其中根轉換節點的內容 (4:1) (以及產生的子節點圖表) 會在 節點「(2:1)」。

請注意，在上述範例中，節點 (4:1) 有兩個子節點：(4:0) 和 (4:5)。直接子項節點會在同一個縮排資料欄中表示。 這兩個節點之間的線條代表子節點 (4:0) 的子圖表。 後續 (4:1) 的各行代表節點 (4:1) 的子圖表。

拓撲一律從螢幕的根節點開始。也就是說 任何未連接至 Display 的 Flatland 執行個體和 Transforms 圖表也不會以 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 執行個體的拓撲，但不顯示 執行個體之間的可視區域/檢視連線。ASCII 表示法 但每個 Flatland 執行個體除外。

還記得「拓撲」一節只列出 已連線至根顯示節點的執行個體會顯示在這裡。在這個輸出內容中 會列出執行個體，不論執行個體是否已連線至根螢幕 可能性總和是否相符在上述範例中，執行個體 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. 每張圖片的資訊都會顯示為三行。

第一行顯示圖片屬性。具體措施包括：

第二行顯示建立映像檔的 Transform 節點。

第三行列出圖片矩形的屬性。具體措施包括：

  • 起點，代表矩形的左上角。
  • 表示矩形的寬度和高度的程度。
  • 順時針對應 UV。從左上角開始旋轉 順時針，每個邊角的 (x, y) 取樣點都會以值表示 範圍：[0.0, 1.0]。因此，順時針的 UV 含有 範例區域、剪裁區域和旋轉