Generic.xaml for a text box with a rectangle vertically stacked on top of it?

I'm trying to write a template for my control, SuperTextB, that set a rectangle over the entire area of the control's TextBox. This rectangle will be used to display validation error messages when validation failes and will be hidden the rest of the time. What I've tried to do follows, but it didn't really work.

<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:SuperTB">
<Style TargetType="{x:Type local:SuperTextB}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:SuperTextB}">
                <Border Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}">
                    <Canvas x:Name="painting" Background="Red"
                            Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Height}" 
                                 Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Width}">
                        <TextBox Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Text, Mode=TwoWay, UpdateSourceTrigger=LostFocus }" x:Name="PART_input"
    开发者_高级运维                             Height="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Canvas, AncestorLevel=1}, Path=Height}" 
                                 Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Canvas, AncestorLevel=1}, Path=Width}" 
                                 Canvas.ZIndex="1"/>
                        <Rectangle x:Name="PART_error"
                                 Height="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Canvas, AncestorLevel=1}, Path=Height}" 
                                 Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Canvas, AncestorLevel=1}, Path=Width}" 
                                 Canvas.ZIndex="2"/>
                    </Canvas>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

---

You don't need all those width and height bindings. Replace the Canvas with a Grid, then set your TextBox and Rectangle as Grid children in that order. The ZIndex will automatically make the rectangle appear on top. Set the Rectangle background to null or set it to Hidden until you are ready to display it. So for example:

<Style TargetType="{x:Type local:SuperTextB}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:SuperTextB}">
                <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                    <Grid x:Name="painting" Background="Red">
                        <TextBox Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Text, Mode=TwoWay, UpdateSourceTrigger=LostFocus }" x:Name="PART_input"/>
                        <Rectangle x:Name="PART_error" Visibility="Hidden"/>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>