soma sekhar
soma sekhar

Reputation: 259

WPF, c# -customizing a textbox display property and implement a datatrigger

How can I customize a textbox display property(say..border, corner radius etc..) and also implement a datatrigger for the data to be entered in it.. Or how to customize a control's(say textbox, listbox etc.) look and feel and implement datatriggers for the same control at once through xaml...

could anybody help me with an example..

Thanks, Sekhar.

Upvotes: 2

Views: 601

Answers (2)

dowhilefor
dowhilefor

Reputation: 11051

First of all the "display property" is usually called ControlTemplate in WPF. So of course you can change the whole ControlTemplate of your TextBox or other Controls and modify it any way you like. For example you can change the ControlTemplate of a Button to just show a Rectangle.

<ControlTemplate x:Key="myNewButton" TargetType="{x:Type Button}">
    <Rectangle Fill="{TemplateBinding Background}"/>
</ControlTemplate>


<Button Template="{StaticResource myNewButton}"/>

The TemplateBinding markup is the way to pass dependency properties, in this case Background to your ControlTemplate children.

Now if you want to add data trigger you can do that in the ControlTemplate itself

<ControlTemplate x:Key="myNewButton" TargetType="{x:Type Button}">
    <Rectangle x:Name="rect" Fill="{TemplateBinding Background}"/>

    <ControlTemplate.Triggers>
        <DataTrigger Binding="{Binding MyDataProperty}" Value="True">
            <Setter TargetElement="rect" Property="Fill" Value="Green" />
        </DataTrigger
    </ControlTemplate.Triggers>

</ControlTemplate>

Upvotes: 2

Josh
Josh

Reputation: 2975

You have multiple options. If you want to completely customize the visual elements of the control you can override the control style and template. Examples are here: http://msdn.microsoft.com/en-us/library/aa970773(v=VS.100).aspx.

If you want to perform easy UI changes such as a red border if some value is false you use the Style of the object:

<Style TargetType="{x:Type TextBox}">
    <Setter Property="TextElement.FontFamily" Value="Calibri" />
    <Setter Property="TextElement.FontSize" Value="14" />
    <Setter Property="TextElement.Foreground" Value="Black" />
    <Style.Triggers>
        <DataTrigger Binding="{Binding Path=IsValid}" Value="False">
            <Setter Property="Effect">
                <Setter.Value>
                    <DropShadowEffect BlurRadius="5" Color="Red" ShadowDepth="0" />
                </Setter.Value>
            </Setter>
            <Setter Property="ToolTip" Value="Something is invalid." />
       </DataTrigger>
       <DataTrigger Binding="{Binding Path=IsValid}" Value="True">
           <Setter Property="Effect" Value="{x:Null}" />
       </DataTrigger>
  </Style.Triggers>
</Style>

The above is something that mimics the error templates available using a DataTrigger. Essentially it binds to a boolean value in the viewmodel which draws a red border around a textbox if the boolean is false and clears it if the boolean is true.

Upvotes: 1

Related Questions