将一个xaml文件动态加载到程序里面的XAML

12 将一个xaml文件动态加载到程序里面的XAML

1. 核心概念与场景衔接

• 场景承接：上一节演示了将字符串动态解析为控件并注册事件；本节演示在触发事件（如上一节动态生成的 button3_Click）时，如何动态加载一个完整的独立 XAML 文件到当前页面中。
• 文件准备要求：创建一个独立的 XAML 文件（如 Rectangle.xaml）。必须去掉根节点（如 Page 节点），使其仅保留具体的 UI 元素（如 <Rectangle ... />）作为单根元素，因为动态加载的片段不能作为独立页面，且需符合单根元素解析规则。

2. 完整代码实现逻辑

在事件方法中，通过异步读取文件并解析加载：

async void button3_Click(object sender, RoutedEventArgs e)
{
    // 替代原有的跳转逻辑：this.Frame.Navigate(typeof(MainPage));
    
    // 1. 定义变量存储读取到的 XAML 文本
    string xaml = string.Empty;
    
    // 2. 获取应用安装目录下的目标文件（Rectangle.xaml）
    StorageFile fileRead = await Windows.ApplicationModel.Package.Current.InstalledLocation.GetFileAsync("Rectangle.xaml");
    
    // 3. 异步读取文件全部文本内容
    xaml = await FileIO.ReadTextAsync(fileRead);
    
    // 4. 使用 XamlReader.Load 解析 XAML 字符串，并强制转换为目标类型（如 Rectangle）
    Rectangle button3 = (Rectangle)XamlReader.Load(xaml);
    
    // 5. 将动态生成的控件添加到当前页面的容器（如 Canvas）中
    this.canvas.Children.Add(button3);
}Code language: JavaScript (javascript)

3. 关键步骤拆解与底层机制

• 异步异步 IO (async/await)：UWP/Windows 10 应用访问文件系统（获取安装路径、读文件）必须是异步的，避免阻塞 UI 线程。
• 路径定位：Package.Current.InstalledLocation 指向应用安装根目录，要求 Rectangle.xaml 文件在编译时被打包进项目（通常设置生成操作为 Content）。
• 解析与映射：XamlReader.Load(xaml) 接收完整的格式化字符串，返回对象树根节点，需手动强转为实际控件类型（Rectangle）。
• 控件挂载：解析出的对象是独立实例，必须通过 Children.Add() 加入视觉树（如 canvas）才能渲染显示。