专栏首页林德熙的博客win10 uwp 使用 XamlTreeDump 获取 XAML 树元素内容

win10 uwp 使用 XamlTreeDump 获取 XAML 树元素内容

本文来安利大家 XamlTreeDump 库,通过这个库可以将 XAML 树上的元素转换为 json 字符串,可以用来进行 UI 单元测试

开始之前先通过 NuGet 工具安装 XamlTreeDump 库

假定咱有 UI 界面代码如下

<Page
    x:Class="WholebaycarNowawnawka.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:WholebaycarNowawnawka"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

  <Grid>
    <TextBlock>欢迎访问我博客 https://blog.lindexi.com 里面有大量 UWP WPF 博客</TextBlock>
  </Grid>
</Page>

可以在后台代码使用 VisualTreeDumper.DumpTree 方法获取 json 字符串

        public MainPage()
        {
            InitializeComponent();
            Loaded += MainPage_Loaded;
        }

        private void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            var xaml = VisualTreeDumper.DumpTree(this, null, Array.Empty<string>(), new AttachedProperty[0]);
        }

上面代码拿到的 xaml 字符串如下

{
  "XamlType": "WholebaycarNowawnawka.MainPage",
  "Background": "#FFFFFFFF",
  "BorderBrush": null,
  "BorderThickness": "0,0,0,0",
  "Clip": null,
  "CornerRadius": "0,0,0,0",
  "FlowDirection": "LeftToRight",
  "Foreground": "#FF000000",
  "HorizontalAlignment": "Stretch",
  "Margin": "0,0,0,0",
  "Padding": "0,0,0,0",
  "RenderSize": [1200, 900],
  "VerticalAlignment": "Stretch",
  "Visibility": "Visible",
  "children": 
  [
  {
    "XamlType": "Windows.UI.Xaml.Controls.Grid",
    "Background": null,
    "BorderBrush": null,
    "BorderThickness": "0,0,0,0",
    "Clip": null,
    "CornerRadius": "0,0,0,0",
    "FlowDirection": "LeftToRight",
    "HorizontalAlignment": "Stretch",
    "Margin": "0,0,0,0",
    "Padding": "0,0,0,0",
    "RenderSize": [1200, 900],
    "VerticalAlignment": "Stretch",
    "Visibility": "Visible",
    "children": 
    [
    {
      "XamlType": "Windows.UI.Xaml.Controls.TextBlock",
      "Clip": null,
      "FlowDirection": "LeftToRight",
      "Foreground": "#FF000000",
      "HorizontalAlignment": "Stretch",
      "Margin": "0,0,0,0",
      "Padding": "0,0,0,0",
      "RenderSize": [1200, 900],
      "Text": "欢迎访问我博客 https://blog.lindexi.com 里面有大量 UWP WPF 博客",
      "VerticalAlignment": "Stretch",
      "Visibility": "Visible"
    }
    ]
  }
  ]
}

详细请看 asklar/XamlTreeDump: A UWP library to produce and compare XAML tree dumps useful for visual end-to-end testing

本文所有代码放在 githubgitee 欢迎小伙伴访问


本文会经常更新,请阅读原文: https://blog.lindexi.com/post/win10-uwp-%E4%BD%BF%E7%94%A8-XamlTreeDump-%E8%8E%B7%E5%8F%96-XAML-%E6%A0%91%E5%85%83%E7%B4%A0%E5%86%85%E5%AE%B9.html ,以避免陈旧错误知识的误导,同时有更好的阅读体验。

本作品采用 知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议 进行许可。欢迎转载、使用、重新发布,但务必保留文章署名林德熙(包含链接: https://blog.lindexi.com ),不得用于商业目的,基于本文修改后的作品务必以相同的许可发布。如有任何疑问,请与我联系

无盈利,不卖课,做纯粹的技术博客

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • dotnet 从入门到放弃的 500 篇文章合集

    博客包括 C#、WPF、UWP、dotnet core 、git 和 VisualStudio 和一些算法,所有博客使用 docx 保存

    林德熙
  • [UWP]本地化入门

    在以前的XAML平台,resx资源文件是一种很方便的本地化方案,但在UWP中微软又再次推荐x:Uid方案,默认的资源文件也变成resw资源文件。虽然后缀名只差了...

    dino.c
  • win10 uwp 入门

    关于UWP介绍可以参见:http://lib.csdn.net/article/csharp/32451

    林德熙
  • 【译】Visual Studio 2019 中 WPF & UWP 的 XAML 开发工具新特性

    自Visual Studio 2019推出以来,我们为使用WPF或UWP桌面应用程序的XAML开发人员发布了许多新功能。在本周的 Visual Studio 2...

    郑子铭
  • win10 uwp 渲染原理 DirectComposition 渲染 例子创建工程如何写显示CompositionSurfaceBrush

    本文来告诉大家一个新的技术DirectComposition,在 win7 之后(实际上是 vista),微软正在考虑一个新的渲染机制。

    林德熙
  • win10 uwp 列表模板选择器 根据数据位置根据不同的数据

    本文主要讲ListView等列表可以根据内容不同,使用不同模板的列表模板选择器,DataTemplateSelector。 如果在 UWP 需要定义某些列的显示...

    林德熙
  • UWP基础教程 - XAML开篇

    XAML是英文Extensible Application Markup Language的缩写,中文可以称为“可扩展应用程序标记语言”,是基于Extensiv...

    陈仁松
  • win10 uwp 使用 Border 布局

    在 UWP 写一个界面需要将元素排列,在排列元素的时候有特殊的元素叫容器。容器的意思是元素里面包含元素,在 UWP 用到的容器有很多,也可以自己写一个。简单的容...

    林德熙
  • UWP 和 WPF 对比

    本文告诉大家 UWP 和 WPF 的不同。 如果在遇到技术选择或者想和小伙伴吹的时候可以让他以为自己很厉害,那么请继续看。

    林德熙

扫码关注云+社区

领取腾讯云代金券