如何在用户控件WPF MVVM中呈现动态Xaml字符串？

根据我得到的数据，我已经用多行两列的方式创建了一个网格。现在我有了一个Xaml字符串。如何在加载时在我的用户控件中呈现。必须从我的viewmodel进行渲染。如何进行

真实场景

我将收到来自数据库的图像数量。每行必须显示两个图像。但我不能创建恒定的行数。因为它将基于动态数据。如果数据是10，我必须创建5行，更少意味着行也将减少

因此，我计划基于数据在Viewmodel中创建xaml。但是如何在我的用户控件中呈现它。

这里有一个解决方案

查看模型：

public class ViewModel : PropertyChangedMonitor
    {
        ObservableCollection<ImageModel> _imageList;
        public ViewModel()
        {
            _imageList = new ObservableCollection<ImageModel>();
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/1.png" });
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/2.png" });
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/3.png" });
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/4.png" });
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/5.png" });
            Columns = 2;
        }



        public ObservableCollection<ImageModel> ImageList
        {
            get
            {
                return _imageList;
            }

        }


        private int _column;

        public int Columns
        {
            get
            {
                return _column;
            }
            set
            {
                if (_column != value)
                {
                    _column = value;
                    OnPropertyChanged("Columns");
                }

            }
        }
    }

public class ImageModel
    {
        public string ImageName { get; set; }
    }

<UserControl x:Class="ImageLoad.ImageDisplay"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:ImageLoad"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:vm="clr-namespace:ImageLoad"
             d:DesignHeight="300"
             d:DesignWidth="300"
             mc:Ignorable="d">
    <UserControl.DataContext>
        <vm:ViewModel />
    </UserControl.DataContext>
    <Grid>
        <ItemsControl ItemsSource="{Binding ImageList}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <UniformGrid Columns="{Binding Columns, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Image Source="{Binding ImageName}" />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Grid>
</UserControl>

和您的用户控件：

public class ViewModel : PropertyChangedMonitor
    {
        ObservableCollection<ImageModel> _imageList;
        public ViewModel()
        {
            _imageList = new ObservableCollection<ImageModel>();
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/1.png" });
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/2.png" });
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/3.png" });
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/4.png" });
            ImageList.Add(new ImageModel { ImageName = "/ImageLoad;component/Images/5.png" });
            Columns = 2;
        }



        public ObservableCollection<ImageModel> ImageList
        {
            get
            {
                return _imageList;
            }

        }


        private int _column;

        public int Columns
        {
            get
            {
                return _column;
            }
            set
            {
                if (_column != value)
                {
                    _column = value;
                    OnPropertyChanged("Columns");
                }

            }
        }
    }

public class ImageModel
    {
        public string ImageName { get; set; }
    }

<UserControl x:Class="ImageLoad.ImageDisplay"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:ImageLoad"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:vm="clr-namespace:ImageLoad"
             d:DesignHeight="300"
             d:DesignWidth="300"
             mc:Ignorable="d">
    <UserControl.DataContext>
        <vm:ViewModel />
    </UserControl.DataContext>
    <Grid>
        <ItemsControl ItemsSource="{Binding ImageList}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <UniformGrid Columns="{Binding Columns, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Image Source="{Binding ImageName}" />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Grid>
</UserControl>

---

希望这能奏效

这根本没有必要。与其解析一段XAML，还不如通过编程方式创建UI元素。或者更好的方法是，向视图模型中添加与布局相关的属性，并使用带有适当ItemsPanel和ItemContainerStyle的ItemsControl，该控件绑定到视图模型属性。只需创建自定义UserControl，从视图模型中获取图像并处理所有布局。在ViewModel中创建UI不是MVVM。谢谢@MANIKANDAN NAGALAKSHMI。它起作用了。