How do I bind to another control's property from a trigger? - wpf

In my particular case, I want to bind to the IsReadOnly property of a TextBox to set the Content property of a Button? They are both part of the same StackPanel.
I've tried doing it with a DataTrigger with a Binding to the ElementName of the TextBox and a Trigger using the TextBox name as the SourceName.
Any thoughts?

You need to specify the trigger as part of a style -- the Triggers collection on the Button itself can only contain event triggers. With that in mind, a DataTrigger works fine. However, there is a wrinkle: the value from the Trigger Setter won't overwrite a local Content property. So you have to set the default Content in the Style as well. Here's how it looks:
<Button> <!-- Note no content set directly on button -->
<Button.Style>
<Style TargetType="Button">
<Setter Property="Content" Value="You may write!!!" /> <!-- Here is the 'normal' content -->
<Style.Triggers>
<!-- Here is how we bind to another control's property -->
<DataTrigger Binding="{Binding IsReadOnly, ElementName=textBox}" Value="True">
<Setter Property="Content" Value="NO NO NO" /> <!-- Here is the 'override' content -->
</DataTrigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>

Have you tried this:
<StackPanel x:Name="LayoutRoot">
<Button Width="75" Content="{Binding IsReadOnly, ElementName=textBox, Mode=Default}" />
<TextBox x:Name="textBox" VerticalAlignment="Top" Text="TextBox" />
</StackPanel>
??

Related

FocusElement does not change focus when I set it using a DataTrigger

I am making a window that shows the user multiple options, with each a radiobutton and a textbox.
When opening this window, the focus should be on the textbox corresponding to the radiobutton that is checked when opening the window (this is all preset, no need to worry about this).
It is important that it gets fixed either in xaml or in the code-behind.
I have used a DataTrigger to change the FocusedElement to the right textbox, however it gets overwritten after it is set.
The relevant code is in the DataTrigger below. The color gets changed correctly, however the FocusElement does not.
I have tried all the options that I have found on stackoverflow and google. The issue does not lie in the DataTrigger or the setting of the FocusedElement. I think it lies in the fact that it gets overridden at the end. I have used Snoop to see the changes in the Keyboard.FocusedElement and it does not show any change.
<DataTemplate x:Uid="DataTemplate_1" >
<RadioButton x:Uid="RadioButton_1" GroupName="Options" IsChecked="{Binding IsSelected}" Margin="4,0,0,0" Name="RadioBtn">
<StackPanel x:Uid="StackPanel_1" Orientation="Horizontal" >
<Label x:Uid="Label_1" Visibility="{Binding IsUserInput, Converter={cs:OppositeVisibilityConverter}}" Content="{Binding Description, Mode=OneWay}" />
<Label x:Uid="Label_2" Visibility="{Binding IsUserInput, Converter={cs:VisibilityConverter}}" Content="Anders, nl: " />
<TextBox x:Uid="MemAnders" Visibility="{Binding IsUserInput, Converter={cs:VisibilityConverter}}" Text="{Binding AlternativeText}"
Name="MemAnders" MinWidth="400" IsTabStop="False"
>
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsSelected}" Value="True">
<Setter Property="FocusManager.FocusedElement" Value="{Binding ElementName=MemAnders}"/>
<Setter Property="Background" Value="LightGoldenrodYellow" />
</DataTrigger>
<DataTrigger Binding="{Binding IsSelected}" Value="False">
<Setter Property="FocusManager.FocusedElement" Value="{Binding ElementName=RadioBtn}"/>
<Setter Property="Background" Value="LightBlue" />
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
</StackPanel >
</RadioButton >
</DataTemplate >
The textbox corresponding to the checked radiobutton should be focused. Instead another (parent?) object is focused.
Anyone know a workaround for this?
The work-around turned out to be setting focus to the textbox in the Window_Loaded function.
I used an algorithm provided by Find a WPF element inside DataTemplate in the code-behind to find the correct textbox element. Then I did TextBox.Focus(); and that fixed it.

Binding Button IsEnabled to TextBox.CanUndo

I'm trying to bind a button to a textbox's CanUndo property, except that I can't get it to work. I tried a direct binding like
IsEnabled="{Binding CanUndo, ElementName=txtDocument}"
But that didn't work. Button stayed disabled even after typing in textbox which would change the CanUndo property to true.
I also tried
<Button IsEnabled="False" >
<Button.Resources>
<Style TargetType="Button">
<Style.Triggers>
<DataTrigger Binding="{Binding CanUndo, ElementName=txtDocument}" Value="True">
<Setter Property="IsEnabled" Value="True" />
</DataTrigger>
</Style.Triggers>
</Style>
</Button.Resources>
<Image Source="/Images/32/undo.png" />
</Button>
I also tried with two separate datatriggers, one for enabled true and one for false, but still didn't work. Am I missing something fundamental? Like maybe this property doesn't raise the required events for binding changes?
Thanks
Set the Button's command property to the ApplicationCommands.Undo command and specify the CommandTarget property to be the TextBox.
The button will set the IsEnabled property based on ApplicationCommands.Undo command CanExecute state. The button will be disabled when CanExecute is false and enabled when CanExecute is true.
<StackPanel>
<TextBox x:Name="txtDocument">Test
</TextBox>
<Button Command="ApplicationCommands.Undo" CommandTarget="{Binding ElementName=txtDocument}" Content="Undo"/>
</StackPanel>

Trying to add a trigger to a button to change the button's Content property

I've got a UserControl that has a button on it. The UserControl has a DependencyProperty called IsNew. This is a bool value that is set to true if the object being edited in the control was newly created and hasn't been written to the database yet. It is false otherwise.
I've got a button that currently reads "Save". I've been asked to change the button so it reads "Insert" if the row is new. I now have the XAML below for the button:
<Button Background="{DynamicResource ButtonBackground}"
Click="SaveButton_Click"
Content="Save"
FontSize="20"
FontWeight="Bold"
Foreground="{DynamicResource ButtonForeground}"
Height="60"
IsEnabled="{Binding Path=IsDirty, RelativeSource={RelativeSource AncestorType={x:Type cs:Editor}}}"
Margin="5"
Name="SaveButton"
TabIndex="7"
Visibility="{Binding Path=CanModify, Converter={StaticResource BoolToVisibility}}">
<Button.Triggers>
<Trigger Property="Editor.IsNew" Value="True">
<Setter Property="Button.Content" Value="Insert" />
</Trigger>
<Trigger Property="Editor.IsNew>
<Setter Property="Button.Content" Value="Save" />
</Trigger>
</Button.Triggers>
</Button>
I'm getting an exception at run time, whose inner exception reads:
Triggers collection members must be of type EventTrigger.
How do I get this to work? I could do this easily in the code-behind, but I want to do it in the XAML.
Thanks
Tony
You can use only EventTriggers in Control.Triggers. To use other kind of trigger (Trigger, DataTrigger) you should use style:
<Button.Style>
<Style TargetType="Button">
<Style.Triggers>
<Trigger Property="Editor.IsNew" Value="True">
<Setter Property="Button.Content" Value="Insert" />
</Trigger>
And also your Property="Editor.IsNew" and Property="Button.Content" won't work because triggers belongs to Button and trigger will try to find property "Editor.IsNew" on button. You can fix it by changing trigger to DataTrigger and bind with RelativeSource to your UserControl and its IsNew property. And Property="Button.Content" needs to be changed to Property="Content".
The reason for this is that a control can only implement EventTriggers. The other kind of triggers you need have to be implemented in a style, and then your button uses that style.

XAML trigger template to set visibilty based on another element

I have several StackPanels that change visibility based on ToggleButtons. The code below works if I replace Tag with btn1 on the DataTrigger-lines.
How do I use the value of the Tag property?
<Window x:Class="MyTestApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="TestApp">
<Window.Resources>
<Style x:Key="panelStyle" TargetType="{x:Type StackPanel}">
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=Tag, Path=IsChecked}" Value="False">
<Setter Property="StackPanel.Visibility" Value="Collapsed" />
</DataTrigger>
<DataTrigger Binding="{Binding ElementName=Tag, Path=IsChecked}" Value="True">
<Setter Property="StackPanel.Visibility" Value="Visible" />
</DataTrigger>
</Style.Triggers>
</Style>
</Window.Resources>
<WrapPanel>
<ToggleButton Content="One" Name="btn1" />
<ToggleButton Content="Two" Name="btn2" />
<StackPanel Style="{StaticResource panelStyle}" Tag="{Binding btn1}">
<Label Content="Data to panel 1" />
</StackPanel>
<StackPanel Style="{StaticResource panelStyle}" Tag="{Binding btn2}">
<Label Content="Data to panel 2" />
</StackPanel>
</WrapPanel>
</Window>
This question is very similar, but I'm missing details on how to pass an element name.
XAML - Generic textbox stylewith triggers / parameters?
Your bindings are incorrect.
In your DataTemplate the bindings should be:
<DataTrigger Binding="{Binding Path=Tag.IsChecked, RelativeSource={RelativeSource Self}}" Value="False">
<Setter Property="StackPanel.Visibility" Value="Collapsed" />
</DataTrigger>
Here the RelativeSource with a mode of Self tells the binding engine that the object to bind against is object to which the style is being applied (e.g. your StackPanel). The PropertyPath of Tag.IsChecked tells the binding engine to look for a property called IsChecked from the object stored in Tag.
Finally the bindings in your StackPanel should be:
<StackPanel Style="{StaticResource panelStyle}" Tag="{Binding ElementName=btn1}">
<Label Content="Data to panel 1" />
</StackPanel>
Here ElementName creates a binding to another element in the logical tree. If you do not explicitly assign to any properties in a Binding as in your original example:
Tag="{Binding btn1}"
The value specified is assigned to the Path property. So this would be the same as:
Tag="{Binding Path=btn1}"
Also note, that using Tag is not considered best practice since it's type is of object and its use is unrestricted, and hence can take on any number of different meanings throughout your project (which often makes it difficult to understand, especially when used in Templates that are located far away from their actual use).
Hope this helps!
Use Converter: set the visibility of StackPanel:
<StackPanel Visivility="{Binding IsChecked, ElementName=btn1, Converter={StaticResource BooleanToVisibilityConverter}}">
...
</StackPanel>

WPF - Making selected listview column editable on button click

I have a listView with a gridview presentation and TextBlocks in each column. I would like to make the selected line editable by replacing the textblocks with TextBoxes and ComboBoxes when the user clicks on an edit button. I tried to do this by setting styles that toggles the visibility of the controls like this :
<Style x:Name="ItemDisplayStyle" TargetType="{x:Type TextBlock}" x:Key="ItemDisplayStyle">
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="Visibility" Value="{Binding Path=dislayMode}" />
</Style>
<Style x:Name="ItemEditStyle" TargetType="{x:Type FrameworkElement}" x:Key="ItemEditStyle">
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="Visibility" Value="{Binding Path=editMode}" />
</Style>
displayMode and editMode are Visibility properties set in the code-behind.
And lower in the xaml :
<GridViewColumn Header="Date de début" Width="80">
<GridViewColumn.CellTemplate>
<DataTemplate>
<Grid>
<TextBlock Margin="-6,0"
HorizontalAlignment="Stretch" TextAlignment="Center"
Text="{Binding Path=DateDebut, Mode=TwoWay}"
Style="{StaticResource ItemDisplayStyle}" />
<TextBox x:Name="tbDateDebut" Margin="-6,0"
HorizontalAlignment="Stretch" HorizontalContentAlignment="Center"
Text="{Binding Path=DateDebut, Mode=TwoWay}"
Style="{StaticResource ItemEditStyle}" />
</Grid>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
My problem is that changing 'editMode' and 'displayMode' in the code-behind does not seem to be detected at the UI level.
Also, even if I get this to work, I don't have any idea of how to apply it only to the selected line.
I can do this separately by binding the visibility value with the ListView so that when the user selects a line, she/he gets the editable controls on that line but I really want to allow this only when they click on a button.
Have you Refreshed the contents of the Grid after making changes? You can use the Grid.GetColumn method and send the sender object i.e. edit button (which I suppose would be separate for each column) and then probably use the VisualTreeHelper to get the textbox and combobox in that column.
Also, why don't you use the 'IsReadOnly' property of the TextBox instead of replacing the TextBlock? Make it true or false as per your requirement.

Resources