如果您想在针对 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 Instance Id*。它表示哪个 Flatland 实例创建了该特定 Transform。该 ID 对中的第二个数字是转换 ID。这是由用户定义的转换标识符,在实例创建的所有转换中都是唯一的。在上面的示例中,(2:0)
、(2:1)
、(4:1)
(依此类推)表示转换节点。标识符为 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)
具有 Viewport/View 关系,其中,根转换节点 (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-|
本部分列出了平面实例的拓扑,但未显示实例之间的视口/视图连接。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 创建的平面图。每张图片的相关信息用三条线表示。
第一行显示图片属性。其中包括:
- 尺寸(以像素为单位),表示为“
[width]x[height]
” - RGBA 颜色,每个值都在
[0.0, 1.0]
范围内 - fuchsia.ui.composition.Flatland.BlendMode
第二行显示的是创建图片的转换节点。
第三行列出了 Image Rectangle 的属性。其中包括:
- 原点,表示矩形的左上角。
- 范围,表示矩形的宽度和高度。
- 顺时针映射 UV。从左上角开始并顺时针旋转,每个角的
(x, y)
采样点由[0.0, 1.0]
范围内的值表示。因此,顺时针 UV 包含有关样本区域、裁剪区域和旋转的信息。