How can I Load XAML dynamically in code behind

Question

One way to add a dynamic control in code-behind is something like this (obviously):

Button thisButton = new Button();
thisButton.Name = "somecool_btn";
thisButton.Content = "Click Me";
someStackPanel.Children.Add(thisButton);

I used to know how to do this using XAML in code behind for more complex dynamic control creation. Basically by creating a string with xaml and then adding it to the StackPanel (or some other UI element)....

string someXaml = @"<Button x:Name='somecool_btn' Content='Click Me' Width='100' Height='29'></Button>";

Now add someXaml to a StackPanel or something...

Answer 1

You can use XamlReader.Parse(https://learn.microsoft.com/dotnet/api/system.windows.markup.xamlreader.parse?view=netcore-3.1). Below is actual usage of it in my previous project(It's messy).

private readonly string gridTemplate = @"
    <Grid xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'
            xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'
        Margin=""0,27,0,0"">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <Rectangle Height=""3"" Grid.Column=""0"" Margin=""0,19,0,0"" VerticalAlignment=""Top"" HorizontalAlignment=""Right"" Fill=""#FFD8D8D8"" Width=""700"" StrokeDashArray=""1"" StrokeThickness=""3"" Stroke=""{Binding RelativeSource={RelativeSource Self}, Path=Fill}""/>
        <Rectangle Height=""3"" Grid.Column=""1"" Margin=""0,19,0,0"" VerticalAlignment=""Top"" HorizontalAlignment=""Right"" Fill=""#FFD8D8D8"" Width=""700"" StrokeDashArray=""1"" StrokeThickness=""3"" Stroke=""{Binding RelativeSource={RelativeSource Self}, Path=Fill}""/>
        <StackPanel Grid.ColumnSpan=""2"" HorizontalAlignment= ""Center"" VerticalAlignment= ""Top"" Margin= ""0"" Height= ""126"" >
            <Grid Margin=""70,0,70,40"">
                <Ellipse Fill = ""#FF555555"" HorizontalAlignment=""Left"" Width=""41"" Height=""41""/>
                <TextBlock FontFamily = ""{DynamicResource keyBoldFont}"" Foreground=""White"" HorizontalAlignment=""Center"" VerticalAlignment=""Center"" Text=""99"" FontSize=""20""/>
            </Grid>
            <TextBlock FontFamily = ""{DynamicResource keyBoldFont}"" FontSize= ""20"" HorizontalAlignment= ""Center"" Foreground= ""#FF555555"" TextWrapping= ""Wrap""/>
        </StackPanel >
    </Grid >";

private Grid MakeNewProgressItem(int gridColumn, string text)
{
    try
    {
        var resBase = System.Windows.Markup.XamlReader.Parse(gridTemplate) as Grid;
        var rectangleL = resBase.Children[0] as Rectangle;
        var rectangleR = resBase.Children[1] as Rectangle;
        var sp = resBase.Children[2] as StackPanel;
        var gr2 = sp.Children[0] as Grid;
        var ellipse = gr2.Children[0] as Ellipse;
        var num = gr2.Children[1] as TextBlock;
        var tb = sp.Children[1] as TextBlock;

        Grid.SetColumn(resBase, gridColumn);
...