I want a Textbox to be disabled, except the user hovers with the mouse over it. But this does not seam to work, the Textbox is still not editable if I hover over it. (Yes I know that this is unusual.)
What I tried is:
<Border>
<TextBox Text="Hover to edit me!" IsEnabled="False" >
<TextBox.Style>
<Style TargetType="{x:Type TextBox}" BasedOn="{StaticResource {x:Type TextBox}}">
<Style.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Border}, Path=IsMouseOver}" Value="True">
<Setter Property="IsEnabled" Value="True" />
</DataTrigger>
<!-- this does not work either -->
<DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="True">
<Setter Property="IsEnabled" Value="True" />
</DataTrigger>
<!-- neither did this -->
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="IsEnabled" Value="True" />
</Trigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
</Border>
I wonder if it is possible at all using a trigger?
This is because of the Dependency Property Value Precedence in WPF.
You need to set the IsEnabled property to false in the Style, so the trigger can override the value.
The local value has always a higher priority, so setting IsEnabled="False" directly in the text box will override any style or style trigger value.
Here is a working example:
<Border>
<TextBox Text="Text">
<TextBox.Style>
<Style TargetType="TextBox">
<Setter Property="IsEnabled" Value="False"/>
<Style.Triggers>
<DataTrigger
Binding="{Binding IsMouseOver,
RelativeSource={RelativeSource FindAncestor, AncestorType=Border}}"
Value="True">
<Setter Property="IsEnabled" Value="True" />
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
</Border>
Related
I have a property in my ModularClientModule class called ExistsOnDisk. When that property is set to false, I want to disable the CheckBox. For some reason, this does not seem to work despite me putting it last in the Triggers XAML block, which means it should be the last thing to fire. I.e, nothing should be interfering. I know my code-behind should be correct because as you will see below, I have another control which receives the update and fires fine.
This one here responds to the ExistsOnDisk property change without issue, and strikesthrough the text:
GridViewColumn x:Name="FileNameHeader" Header="File Name">
<GridViewColumn.CellTemplate>
<DataTemplate DataType="{x:Type local:ModularClientModuleUI}">
<TextBlock Text="{Binding Filename}">
<TextBlock.Style>
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<DataTrigger Binding="{Binding ExistsOnDisk}" Value="False">
<Setter Property="TextDecorations" Value="Strikethrough"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
This one here does not, and the checkbox remains enabled:
<GridViewColumn x:Name="StatusHeader" Header="Status">
<GridViewColumn.CellTemplate>
<DataTemplate DataType="{x:Type local:ModularClientModuleUI}">
<StackPanel>
<CheckBox x:Name="ClientModuleStatusCheckBox" Margin="5, 0" Click="ClientModuleStatusCheckBox_Click" IsEnabled ="{Binding Client.Online}">
<CheckBox.Style>
<Style TargetType="{x:Type CheckBox}" BasedOn="{StaticResource MahApps.Styles.CheckBox}">
<Setter Property="IsEnabled" Value="False" />
<Style.Triggers>
<DataTrigger Binding="{Binding LoadState}" Value="Loaded">
<Setter Property="IsChecked" Value="True" />
<Setter Property="IsEnabled" Value="True" />
</DataTrigger>
<DataTrigger Binding="{Binding LoadState}" Value="Unloaded">
<Setter Property="Visibility" Value="Visible" />
</DataTrigger>
<DataTrigger Binding="{Binding LoadState}" Value="Loading">
<Setter Property="Visibility" Value="Collapsed" />
</DataTrigger>
<DataTrigger Binding="{Binding ExistsOnDisk}" Value="True">
<Setter Property="IsEnabled" Value="True" />
</DataTrigger>
<DataTrigger Binding="{Binding ExistsOnDisk}" Value="False">
<Setter Property="IsEnabled" Value="False" />
</DataTrigger>
</Style.Triggers>
</Style>
</CheckBox.Style>
</CheckBox>
What could be going on here?
Set the default value of the IsEnabled using a Setter and remove IsEnabled ="{Binding Client.Online}" from the <CheckBox> element:
<CheckBox x:Name="ClientModuleStatusCheckBox" Margin="5, 0" Click="ClientModuleStatusCheckBox_Click">
<CheckBox.Style>
<Style TargetType="{x:Type CheckBox}" BasedOn="{StaticResource MahApps.Styles.CheckBox}">
<Setter Property="IsEnabled" Value="False" />
<Style.Triggers>
<DataTrigger Binding="{Binding LoadState}" Value="Loaded">
<Setter Property="IsChecked" Value="True" />
<Setter Property="IsEnabled" Value="True" />
</DataTrigger>
<DataTrigger Binding="{Binding LoadState}" Value="Unloaded">
<Setter Property="Visibility" Value="Visible" />
</DataTrigger>
<DataTrigger Binding="{Binding LoadState}" Value="Loading">
<Setter Property="Visibility" Value="Collapsed" />
</DataTrigger>
<DataTrigger Binding="{Binding ExistsOnDisk}" Value="True">
<Setter Property="IsEnabled" Value="True" />
</DataTrigger>
</Style.Triggers>
</Style>
</CheckBox.Style>
</CheckBox>
Also note that you shouldn't use more than one trigger on the same bool property.
I need to Write DataTrigger to update the value of a Tag Property in a WPF TextBox.
If the TextBox Text.Count >0 then update the Tag property to True otherwise False.
XAML Source Code:
<TextBox Text="WPF" Tag="True">
<TextBox.Triggers>
<DataTrigger Property="Text" Value="0">
<Setter Property="Tag" Value="False" />
</DataTrigger>
</TextBox.Triggers>
</TextBox>
Your code won't work because you can't put data triggers into a control's Triggers collection. What you actually need is a trigger in the control's Style.
Try this instead:
<TextBox Text="WPF" Tag="True">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Style.Triggers>
<DataTrigger Value="0"
Binding="{Binding Text.Length, RelativeSource={RelativeSource Self}}">
<Setter Property="Tag" Value="False" />
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
Note that this is not foolproof: if the text box contains only whitespace for example, then it may appear to be empty but the length of the text will be greater than zero.
As the answers from user2946329 and ATM show, there are various ways of doing this in a <Style> trigger.
DataTrigger has not the property. You shoud use Property trigger for this purpose like this:
<TextBox Text="WPF" Tag="True">
<TextBox.Style>
<Style TargetType="TextBox">
<Style.Triggers>
<Trigger Property="Text" Value="0">
<Setter Property="Tag" Value="False" />
</Trigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
Or if you want to change the Tag based on text Length you should try this:
<Trigger Property="Text" Value="">
I've used StevenRands answer and adapted my own:
In this example Tag will be false if Text is null or empty.
<StackPanel>
<TextBox Text="WPF" Name="tb">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="Tag" Value="True"/>
<Style.Triggers>
<DataTrigger Value="" Binding="{Binding Text, RelativeSource={RelativeSource Self}}">
<Setter Property="Tag" Value="False" />
</DataTrigger>
<DataTrigger Value="{x:Null}" Binding="{Binding Text, RelativeSource={RelativeSource Self}}">
<Setter Property="Tag" Value="False" />
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
<!-- YOU CAN CHECK THE TAG'S VALUE HERE-->
<TextBlock Text="{Binding ElementName=tb, Path=Tag}"/>
</StackPanel>
And here's StevenRands better answer with some changes to make it work:
<TextBox Text="WPF">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="Tag" Value="True"/>
<Style.Triggers>
<DataTrigger Value="0" Binding="{Binding Text.Length, RelativeSource={RelativeSource Self}}">
<Setter Property="Tag" Value="False" />
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
You will have to do something similar to this:
Here I described a style and attached it to a control.
<Style TargetType="telerik:BarIndicator" x:Key="Percent">
<Style.Resources>
<vc:LoadPercentValueConverter x:Key="LPValueConverter"/>
</Style.Resources>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=myEngine.PercentLoaded, Converter={StaticResource LPValueConverter}}" Value="1" >
<Setter Property="Background" Value="Red"></Setter>
</DataTrigger>
<DataTrigger Binding="{Binding Path=myEngine.PercentLoaded, Converter={StaticResource LPValueConverter}}" Value="0" >
<Setter Property="Background" Value="Green"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
Here is the control:
<telerik:BarIndicator Style="{StaticResource Percent}" Visibility="{Binding WhileLoading}" Value="{Binding Path=myEngine.PercentLoaded}" StartWidth="0.13"/>
And you have to use a value converter. Here is mine.
class LoadPercentValueConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
long percent = (long)System.Convert.ChangeType(value, typeof(long));
if (percent > 80)
{
return 1;
}
else
{
return 0;
}
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
}
i have a button in my wpf form and the button is having the image text in mvvm application when i click the button it will attach the file, my requirement is when it attached successfully the text is changed to Approve , I want to write another command propery for this command after changed the text to Approve.
<Button ToolTip="Attach Approval"
Height="25"
Command="{Binding AddAttachmentCommand}"
Margin="5,10,5,10">
<Button.Style>
<Style TargetType="{x:Type Button}">
<!-- Default Content value -->
<Setter Property="Content">
<Setter.Value>
<StackPanel Orientation="Horizontal">
<Image Source="/UILibrary;component/Themes/Default/Images/Attach.PNG"/>
</StackPanel>
</Setter.Value>
</Setter>
<!-- Triggered values -->
<Style.Triggers>
<DataTrigger Binding="{Binding IsAttachmentAvailable}" Value="True">
<Setter Property="Visibility" Value="Visible"/>
<Setter Property="Content" Value="Appprove"/>
</DataTrigger>
<DataTrigger Binding="{Binding IsAttachmentAvailable}" Value="False">
<Setter Property="Visibility" Value="Visible"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Button.Style>
If you want to change a property (in your case the Command) in a trigger, you have to initialise the property in the style setter. To make your code work remove the command property from the button and add the command property to the style setter.
<Button ToolTip="Attach Approval"
Height="25"
Margin="5,10,5,10">
<Button.Style>
<Style TargetType="{x:Type Button}">
<!-- Default Content value -->
<Setter Property="Command" Value="{Binding AddAttachmentCommand}"/>
<Setter Property="Content">
<Setter.Value>
<StackPanel Orientation="Horizontal">
<Image Source="/UILibrary;component/Themes/Default/Images/Attach.PNG"/>
</StackPanel>
</Setter.Value>
</Setter>
<!-- Triggered values -->
<Style.Triggers>
<DataTrigger Binding="{Binding IsAttachmentAvailable}" Value="True">
<Setter Property="Visibility" Value="Visible"/>
<Setter Property="Content" Value="Appprove"/>
<Setter Property="Command" Value="SOME OTHER COMMAND"/>
</DataTrigger>
<DataTrigger Binding="{Binding IsAttachmentAvailable}" Value="False">
<Setter Property="Visibility" Value="Visible"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Button.Style>
I am new to WPF, I dont know how to do this.
I tried following code -
<TextBlock Grid.Column="3" Grid.Row="3" Visibility="{Binding Path=CanCreate, Converter={StaticResource BoolVisibilityConverter}}">
<Hyperlink KeyboardNavigation.TabIndex="2" Command="{Binding Path=CreateCommand}">Create
<Hyperlink.Style>
<Style TargetType="{x:Type Hyperlink}">
<Setter Property="KeyboardNavigation.IsTabStop" Value="False" />
<Style.Triggers>
<DataTrigger Binding="{Binding Path=CanCreate, Converter={StaticResource BoolVisibilityConverter}}">
<Setter Property="KeyboardNavigation.IsTabStop" Value="True" />
</DataTrigger>
</Style.Triggers>
</Style>
</Hyperlink.Style>
</Hyperlink>
</TextBlock>
Visibility depends on CanCreate Dependency property. Here IsTabStop is not enabling. Can anyone suggest the solution. Thanks in advance.
Requirement
I want to set TabIndex to hyperlink when it is visible.
You don't need a converter in the DataTrigger change your Hyperlink.Style to:
<Hyperlink.Style>
<Style TargetType="{x:Type Hyperlink}">
<Setter Property="KeyboardNavigation.IsTabStop" Value="False" />
<Style.Triggers>
<DataTrigger Binding="{Binding Path=CanCreate}" Value="True">
<Setter Property="KeyboardNavigation.IsTabStop" Value="True" />
</DataTrigger>
</Style.Triggers>
</Style>
</Hyperlink.Style>
EDIT: You may also want to remove focus when your TextBlock and Hyperlink is invisible, you can do it by adding another DataTrigger:
<Hyperlink.Style>
<Style TargetType="{x:Type Hyperlink}">
<Setter Property="KeyboardNavigation.IsTabStop" Value="False" />
<Style.Triggers>
<DataTrigger Binding="{Binding Path=CanCreate}" Value="True">
<Setter Property="KeyboardNavigation.IsTabStop" Value="True" />
</DataTrigger>
<DataTrigger Binding="{Binding Path=CanCreate}" Value="False">
<Setter Property="Focusable" Value="False" />
</DataTrigger>
</Style.Triggers>
</Style>
</Hyperlink.Style>
Is there any way to create a call'able image style? I have multiple buttons on a user control that have the same button and button image style. I can set the button style so that it can be called from the style (dynamic resource) of the button.
Here is an example of my code and the image style code:
<Grid.Resources>
<Style TargetType="Button"
x:Key="ButtonEditSaveStyle">
<Setter Property="IsEnabled"
Value="False" />
<Style.Triggers>
<DataTrigger Binding="{Binding CanEdit}"
Value="True">
<Setter Property="IsEnabled"
Value="True" />
</DataTrigger>
</Style.Triggers>
</Style>
</Grid.Resources>
<Button Width="32"
Height="22"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Name="gdEmployeeInfo_btnUpdateRecord"
Click="gdEmployeeInfo_btnUpdateRecord_Click"
Style="{DynamicResource ResourceKey=ButtonEditSaveStyle}"/>
I want to set my code up so that I can have the call above an have an additional call or a combined call to set the image style as well. I know I can have the image style in the button (as shown in this next code), but I want to have one place to update multiple buttons using the same style setup. Image style code:
<Image>
<Image.Style>
<Style TargetType="{x:Type Image}">
<Setter Property="Source"
Value="edit_32.png" />
<Setter Property="Stretch"
Value="Uniform" />
<Style.Triggers>
<DataTrigger Binding="{Binding IsEditing}"
Value="True">
<Setter Property="Source"
Value="save_smallest.png" />
<Setter Property="Stretch"
Value="Uniform" />
</DataTrigger>
</Style.Triggers>
</Style>
</Image.Style>
</Image>
Figured out the answer to my question. This set of code allows me to use dual style setting while creating only one call for the button's style:
<!--SaveEditImageSwitch-->
<Image x:Key="SaveEditImage" x:Shared="False">
<Image.Style>
<Style TargetType="{x:Type Image}">
<Setter Property="Source"
Value="edit_32.png" />
<Setter Property="Stretch"
Value="Uniform" />
<Style.Triggers>
<DataTrigger Binding="{Binding IsEditing}"
Value="True">
<Setter Property="Source"
Value="save_smallest.png" />
<Setter Property="Stretch"
Value="Uniform" />
</DataTrigger>
</Style.Triggers>
</Style>
</Image.Style>
</Image>
<!--ButtonEditSaveStyle-->
<Style TargetType="Button"
x:Key="ButtonEditSaveStyle">
<Setter Property="IsEnabled"
Value="False" />
<Setter Property="Content"
Value="{DynamicResource ResourceKey=SaveEditImage}" />
<Style.Triggers>
<DataTrigger Binding="{Binding CanEdit}"
Value="True">
<Setter Property="IsEnabled"
Value="True" />
</DataTrigger>
</Style.Triggers>
</Style>
<Button Width="32"
Height="22"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Name="gdEmployeeInfo_btnUpdateRecord"
Click="gdEmployeeInfo_btnUpdateRecord_Click"
Style="{DynamicResource ResourceKey=ButtonEditSaveStyle}">