views:

38

answers:

1

I have a UserControl that contains a TextBox. The TextBox.Text property is data-bound and validated. When a Validation.Error occurs, I would like to edit the Validation.ErrorTemplate. Specifically, I would like adorn it with a Polyline.

The end goal is to have a UserControl that has a red squiggly line under the text when it fails a validation. I'm probably going about it all wrong, b/c this is just WAY to hard.

+2  A: 

You should just need to set the ErrorTemplate on the TextBox. When validation fails for one of the bindings on the TextBox, the ErrorTemplate will be displayed in an adorner layer. You could draw a squiggly line by doing something like this:

<Validation.ErrorTemplate>
    <ControlTemplate>
        <StackPanel>
            <AdornedElementPlaceholder/>
            <Rectangle Height="7">
                <Rectangle.Fill>
                    <DrawingBrush
                            TileMode="Tile"
                            ViewportUnits="Absolute"
                            Viewport="0 0 4 7"
                            ViewboxUnits="Absolute"
                            Viewbox="0 0 4 7"
                            >
                        <DrawingBrush.Drawing>
                            <GeometryDrawing>
                                <GeometryDrawing.Pen>
                                    <Pen Brush="Red" Thickness="1"/>
                                </GeometryDrawing.Pen>
                                <GeometryDrawing.Geometry>
                                    <PathGeometry Figures="M0,2 L2,5 4,2, 6,5" />
                                </GeometryDrawing.Geometry>
                            </GeometryDrawing>
                        </DrawingBrush.Drawing>
                    </DrawingBrush>
                </Rectangle.Fill>
            </Rectangle>
        </StackPanel>
    </ControlTemplate>
</Validation.ErrorTemplate>
Quartermeister
That's amazing.
pomeroy
What would be your strategy if you wanted the line to extend only as far as the text within the TextBox? I can programmatically calculate that, but how do I get it into the markup?
pomeroy
You could create an attached property on the TextBox that had the location of the text, and then bind the location of the underline to that property.
Quartermeister