Reputation: 259
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
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
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