通过“实时可视化树”,开发者可以获取正在运行的XAML代码的实时视图,以树状结构显示Xamarin.Forms应用程序的UI元素层次。使用此功能需要满足以下要求:使用Xamarin.Forms 5.0或更高版本,并确保热重载已启用(默认情况下已启用)。
满足要求后,在调试应用时,实时可视化树窗口会显示应用的运行时UI层次结构。在Windows上,默认显示在IDE左侧,可通过“调试”>“Windows”>“实时可视化树”打开;在Mac上,默认显示在IDE右侧,可通过“视图”>“调试Windows”>“实时可视化树”访问。使用树状视图可以检查UI层次,通过展开或折叠节点来专注于特定部分。
为了简化视图,默认启用“仅显示我的XAML”功能,它只显示XAML元素;你可以通过工具栏按钮切换此功能以显示所有UI元素,或在选项中禁用此设置以始终显示所有元素。需要注意的是,Visual Studio for Mac目前不支持“仅显示我的XAML”功能。
由于XAML结构可能包含大量不直接相关的元素,实时可视化树提供了几种方式来帮助定位和检查元素。首先,支持“选择正在运行的应用程序中的元素”模式(目前仅适用于UWP应用),通过工具栏最左侧按钮启用,可以在应用中选择UI元素并自动在树中定位对应节点及其属性。其次,支持“选择正在运行的应用程序中的布局装饰器”模式(同样仅适用于UWP应用),通过相邻按钮启用,会显示边界线和边距矩形以辅助对齐查看。此外,还支持“预览所选内容”模式,通过第三个工具栏按钮启用,如果有源代码访问权限,会显示元素声明处的XAML代码。
这些功能结合使用,能显著提升Xamarin.Forms应用的UI调试效率。更多相关信息,可参考XAML热重载的使用文档。