Parse Exception occurring due to my Styling-CodePudding

I am creating a WPF application in C# using XAML. I have looked into the documentation of creating Styles for XAML.

It looks to be working correctly in the Designer before I actually run my application. Upon running my application I receive a parse exception. Looking at the line and position indicated, <Style="{StaticResource T}" /> is the cause of this error. Removing it solves the issue, but this requires me to do an inline Style which I would like to avoid.

The XAML code for the Page encountering this issue is below and I would appreciate any feedback and guidance on this issue. The Style not working here is the x:Key="T" TargetType="Border".

<Page x:Class="NGClient1.Screen1.BE2.WindowBe2Tablet"
      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:NGClient1.Screen1.BE2"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="WindowBe2Tablet" Width="1024" Height="1280" Background="Black">

    <Grid>

        <Grid>
            <Grid.ColumnDefinitions >
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

            <Image Source="Resources/backdrop.png" Stretch="UniformToFill" Grid.ColumnSpan="2" Grid.RowSpan="3" />

            <StackPanel Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" Grid.RowSpan="2" VerticalAlignment="Center" HorizontalAlignment="Center">
                <TextBlock Text="Advert Section Here" />
            </StackPanel>

            <Border Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2" BorderBrush="White" BorderThickness="4" Background="Black" Margin="40, 40, 40, 40" Opacity="0.5"/> -->
            <Border Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2" Style="{StaticResource T}" /> <!-- Exception being thrown here, unsure why -->
            
            <StackPanel Grid.Column="0" Grid.Row="2" VerticalAlignment="Center" HorizontalAlignment="Center">
                <TextBlock Text="Lower Section Left Here" />
            </StackPanel>

            <StackPanel Grid.Column="1" Grid.Row="2" VerticalAlignment="Center" HorizontalAlignment="Center">
                <TextBlock Text="Lower Section Right Here" />
            </StackPanel>

        </Grid>
    </Grid>

    <Page.Resources>
    
        <Style x:Key="T" TargetType="Border" > <!-- x:Key causing exception, unsure why -->
            
            <Setter Property="BorderBrush" Value="White"/>
            <Setter Property="BorderThickness" Value="4"/>
            <Setter Property="Background" Value="Black"/>
            <Setter Property="Margin" Value="40, 40, 40, 40"/>
            <Setter Property="Opacity" Value="0.5"/>
            
        </Style>

        <Style TargetType="TextBlock">
            
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="FontSize" Value="25"/>
            <Setter Property="HorizontalAlignment" Value="Center"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            
        </Style>
        
    </Page.Resources>
</Page>

CodePudding user response：

When using StaticResources, the order of defining and referencing a resource in XAML matters.

Provides a value for any XAML property attribute by looking up a reference to an already defined resource. Lookup behavior for that resource is analogous to load-time lookup, which will look for resources that were previously loaded from the markup of the current XAML page as well as other application sources, and will generate that resource value as the property value in the run-time objects.

As stated in the documentation for static resource lookup:

Forward references cannot be resolved by a static resource reference.

In your case, the resource section is at the bottom of the page, so the resource will be defined after it is first referenced through StaticResource. In order to solve the issue, you have to either move the resources section to a position before resources defined within it are referenced or use DynamicResource instead.

<Border Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2" Style="{DynamicResource T}"/>

The DynamicResource Markup Extension instead processes a key by creating an expression, and that expression remains unevaluated until the app runs, at which time the expression is evaluated to provide a value.