WPF从如何动态从本地文件加载界面

在前面的文章中，我介绍过一种报告模板的实现思路。就是用的XAML本地加载。

https://www.cnblogs.com/zhaotianff/p/18254574

 

在另外一篇文章中，介绍了XAML是如何被转换成对象的。

https://www.cnblogs.com/zhaotianff/p/18363828

 

在这篇文章中，简单介绍了InitializeComponent函数，它的内部如下：

在任意一个界面的构造函数下都会调用InitializeComponent函数，也就是在InitializeComponent函数里，将XAML加载进来

/// <summary>
 /// InitializeComponent
 /// </summary>
 [System.Diagnostics.DebuggerNonUserCodeAttribute()]
 [System.CodeDom.Compiler.GeneratedCodeAttribute("PresentationBuildTasks", "4.0.0.0")]
 public void InitializeComponent() {
     if (_contentLoaded) {
         return;
     }
     _contentLoaded = true;
     System.Uri resourceLocater = new System.Uri("/WpfApp25;component/mainwindow.xaml", System.UriKind.Relative);

     #line 1 "..\..\MainWindow.xaml"
     System.Windows.Application.LoadComponent(this, resourceLocater);

     #line default
     #line hidden
 }

 

如果我们想界面从本地文件加载，是不是也可以利用这种方法呢？

答案是不行，因为Application.LoadComponent函数仅支持相对路径的资源，也就是说必须那是嵌入的。

 System.Windows.Application.LoadComponent(this, resourceLocater);

 

但是我们可以利用这种思路，只是改变一下加载方法。

我们还是使用前面的加载报告模板的那种方式。这种方式也支持三方控件。这里以HandyControl为例（HandyControl使用不作讲解）。

如果想为控件添加事件处理程序，可以通过FrameworkElement.FindName函数查找元素，并手动添加事件处理程序。

这里不作演示，本文以MVVM模式进行演示。

 

实现方式如下：

1、创建一个如下的UserControl

<UserControl x:Class="WPFDynamicLoadUI.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:WPFDynamicLoadUI"
             xmlns:hc="https://handyorg.github.io/handycontrol"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <hc:TransitioningContentControl>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition Height="30"/>
            </Grid.RowDefinitions>

            <Image></Image>
            <Button Content="确认" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Row="1" Width="88" Height="28"></Button>
        </Grid>
    </hc:TransitioningContentControl>
</UserControl>

 

2、将UserControl保存到本地文件

在保存之前需要移除一些元素，例如一些资源引入，x:Class声明等，另外还需要将元素进行绑定。

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:hc="https://handyorg.github.io/handycontrol"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <hc:TransitioningContentControl>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition Height="30"/>
            </Grid.RowDefinitions>

            <Image Source="{Binding ImagePath}"></Image>
            <Button Content="确认" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Row="1" Width="88" Height="28" Command="{Binding ConfirmCommand}"></Button>
        </Grid>
    </hc:TransitioningContentControl>
</UserControl>

 

3、创建ViewModel

    public class MyViewModel : ObservableObject
    {
        private string imagePath;

        public string ImagePath 
        { 
            get => imagePath;
            set
            {
                SetProperty(ref imagePath, value);
            }
        }

        public RelayCommand ConfirmCommand { get; private set; }

        public MyViewModel()
        {
            ConfirmCommand = new RelayCommand(Confirm);
        }

        private void Confirm()
        {
            Application.Current.MainWindow.Close();
        }
    }

 

4、创建从本地加载的方法

   private void LoadUIFromLocalFile()
   {
       var path = Environment.CurrentDirectory + "\\CustomUI.xaml";

       if (_contentLoaded)
       {
           return;
       }

       _contentLoaded = true;
       System.Uri resourceLocater = new System.Uri(path, System.UriKind.Absolute);
       System.Windows.Controls.UserControl uc = (System.Windows.Controls.UserControl)XamlReader.Parse(System.IO.File.ReadAllText(path));

       MyViewModel myViewModel = new MyViewModel();
       myViewModel.ImagePath = "https://img1.baidu.com/it/u=3587113956,547682065&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1732986000&t=718ac074cdbcbf7e38df3b6ccbd9d8b2";
       uc.DataContext = myViewModel;

       this.Content = uc;
   }

 

5、移除InitializeConponent函数，变成从本地加载的函数

 

   public MainWindow()
   {
       //InitializeComponent();
       LoadUIFromLocalFile();
   }

 

 

运行效果如下：

 示例代码