Controls with TemplateSelector property - wpf

Now I have ListView and in one column has:
<GridViewColumn CellTemplateSelector="{StaticResource messagerEditorTemplateSelector}"/>
And everything is fine: cell is filled with content based on item. But now I want to place in this cell 2 controls: for one template must be selected based on binding and other is control with name, say TimeRangeView. But I cannot understand how it can be implemented? So I must have code like:
<GridViewColumn>
<DataTemplate>
<StackPanel>
<SomeControlWhichSupportTemplateSelector ... />
<views:TimeRangeView ... />
</StackPanel>
</DataTemplate>
</GridViewColumn>`
Which control should I use for template? I've found only listbox but it must be bound to collection. Of course, I could bind like:
<ListBox ItemsSource="{Binding Converter=ItemToCollectionConverter}" />
but it doesn't look elegant. May be there is another way to do it?

You can use a ContentControl and set its ContentTemplateSelector property:
<GridViewColumn>
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel>
<ContentControl ContentTemplateSelector="{StaticResource messagerEditorTemplateSelector}" />
<views:TimeRangeView ... />
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
Note that for Binding to work within your ContentControl, you will have to set the Content property to whichever object is used in the Bindings of the DataTemplate returned by your selector.
So that's for option 1.
You can also just use DataTriggers:
<GridViewColumn>
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel>
<ContentControl Content="{Binding MyBoundObject}">
<ContentControl.Style>
<Style>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=MyBoundObject.ABooleanProperty}" Value="True">
<Setter Property="ContentControl.ContentTemplate" Value="{StaticResource myFirstTemplate}" />
</DataTrigger>
<DataTrigger Binding="{Binding Path=MyBoundObject.ABooleanProperty}" Value="False">
<Setter Property="ContentControl.ContentTemplate" Value="{StaticResource mySecondTemplate}" />
</DataTrigger>
</Style.Triggers>
</Style>
</ContentControl.Style>
</ContentControl>
<views:TimeRangeView ... />
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
Which is what i do and it works like a charm =)

Related

How to create ToolTip for DataGridColumnHeader in WPF?

I have found how to create ToolTip for DataGridColumnHeader in WPF (and make sure that the Header is wrapped).
<Style x:Key="StartingTabToolTipHeaderStyle" TargetType="DataGridColumnHeader">
<Setter Property="ToolTip" Value="{x:Static r:Resource.StartingTabToolTip}"/>
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<TextBlock TextWrapping="Wrap" Text="{Binding}"/>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
I can use this style in this way:
<DataGridComboBoxColumn Header="{x:Static r:Resource.StartingTab}" SelectedItemBinding="{Binding StartingTab}"
HeaderStyle="{StaticResource StartingTabToolTipHeaderStyle}">
This solution is not nice because I need to create a separate style for each header because the tooltip is hardwired in the style. I would like a general style which can be used in this way:
<DataGridComboBoxColumn Header="{x:Static r:Resource.StartingTab}" SelectedItemBinding="{Binding StartingTab}"
MyToolTip="{x:Static r:Resource.StartingTabToolTip}">
Any idea how to do it? May be with attached property?
You can set the ToolTipService.ToolTip attached property on each column and bind your values to it, because it is not used on columns.
<DataGridComboBoxColumn Header="{x:Static r:Resource.StartingTab}"
SelectedItemBinding="{Binding StartingTab}"
HeaderStyle="{StaticResource StartingTabToolTipHeaderStyle}"
ToolTipService.ToolTip="{x:Static r:Resource.StartingTabToolTip}">
Then you can bind this text on the column in your header style using a RelativeSource binding.
<Style x:Key="StartingTabToolTipHeaderStyle" TargetType="{x:Type DataGridColumnHeader}">
<Setter Property="ToolTip" Value="{Binding Column.(ToolTipService.ToolTip), RelativeSource={RelativeSource Self}}"/>
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<TextBlock TextWrapping="Wrap" Text="{Binding}"/>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
Now you only have a single style. If you want to avoid setting the style on each column, make it an implicit style by omitting the x:Key. Then it will be applied to all matching types in scope.
<Style TargetType="{x:Type DataGridColumnHeader}">
You could use DataGridTemplateColumn
<DataGrid AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTemplateColumn Header="yourHeader" HeaderStyle={StaticResource HeaderStyle1}">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<!--you can add any control such as ComboBox, Button etc-->
<TextBlock Text="{Binding Message}"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
<!--Editing cell template is not mandatory, only if you want allow user to edit a particular cell, shown here only for reference-->
<DataGridTemplateColumn.CellEditingTemplate>
<DataTemplate>
<!--When the user double clicks on this cell, it changes the control to TextBox (from TextBlock - see above) to allow for user input-->
<TextBox Text="{Binding Message}"/>
</DataTemplate>
</DataGridTemplateColumn.CellEditingTemplate>
</DataGridTemplateColumn>
<!--Second Column-->
<DataGridTemplateColumn Header="secondHeader" HeaderStyle={StaticResource HeaderStyle2}">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<ComboBox ItemSource="{Binding SomeSource}"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
This might seem a bit much for each column. But it gives you far more control & better scalability for future complex changes. Its somewhat trivial work put in during the initial dev phase.
Atleast thats my opinion since after the success of the concept, several further inputs/changes & new requirements come in to improve user interactivity with specific rules & logic on how/when the user can interact with UI Elements especially when altering data.
Edit -
Your style can be exactly like you made i.e. targeting DataGridColumnHeader.

Comma-separated text boxes in listbox

given a list of business objects with a fixed number of properties (for example List of person, and person with properties FirstName, LastName, City, Department
I would like to show each person in a listboxitem, and was able to define a datatemplate that does the display.
Now the question: I do NOT want to display a gridlike structure, but would like to see only filled textboxes, and they should be separated by commas:
"Karl, Miller, Chicago, Legal" when all fields are filled, but
"Harry, Manning" when city and department is empty and
"Maria, IT" when lastname and city is not set.
Which is the way to choose for this task?
Regards
Use Trigger.
<ListBox ItemsSource="{Binding MyObjects}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<StackPanel.Resources>
<Style TargetType="TextBlock" BasedOn="{DynamicResource x:Type TextBlock}">
<Style.Triggers>
<Trigger Property="TextBlock.Text" Value="">
<Setter Property="Visibility" Value="Collapsed" />
</Trigger>
<Trigger Property="TextBlock.Text" Value="{x:Null}">
<Setter Property="Visibility" Value="Collapsed" />
</Trigger>
</Style.Triggers>
</Style>
</StackPanel.Resources>
<TextBlock Text="{Binding FirstName}" />
<TextBlock Text="{Binding LastName}" />
<TextBlock Text="{Binding City}" />
<TextBlock Text="{Binding Department}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
This solution does not have commas, but I need to know exactly what you want it to look like before I can really suggest that.
Alternatively, use MultiBinding with an IMultiValueConverter.
Solved this like this:
In Xaml I have this Structure:
...
<local:CaptionedTextBox Caption="{x:Static p:Resources.EMail}"
Text="{Binding EMail.Value}"
Visibility="{Binding EMail.Value,
Converter={StaticResource LengthToVisibilityConverter}}" />
<local:SeparatorBox Visibility="{Binding RelativeSource={RelativeSource Self}, Converter={StaticResource LastFilledToVisibilityConverter}}" />
<local:CaptionedTextBox Caption="{x:Static p:Resources.Mobile}"
Text="{Binding Mobile.Value,
UpdateSourceTrigger=PropertyChanged}"
Visibility="{Binding Mobile.Value,
Converter={StaticResource LengthToVisibilityConverter}}" />
<local:SeparatorBox Tag="HIDE" Visibility="{Binding RelativeSource={RelativeSource Self}, Converter={StaticResource LastFilledToVisibilityConverter}}" />
So, basically I have list of alternating Text and Separator elements.
The last element in the list is a Separator with TAG=HIDE.
In the Converter I only set TAG for not necessary separators to HIDE and finally set the visibility for all separators regarding the TAG.

How to apply a KeyBinding in a CellTemplate of a DataGridTemplateColumn?

I've got a bit of a curly problem that I cannot find any complete and definitive information on...
My requirement is very simple: I want to apply a KeyBinding to a DataGridTemplateColumn. The purpose of this is to execute a command when the Delete key is hit for that column - a different command is executed if Delete is hit anywhere else on the grid. Both Delete commands exist in the VM of the grid.
While I could have a single keybinding defined at the grid level and then in the command test which column the active cell belongs to, this is a messy solution because:
that doesn't scale well when the grid is used on several different pages
the column in question is defined as a resource in a ResourceDictionary
Besides, I've seen nothing that indicates that this isn't possible... yet it eludes me.
I believe my problem is because focus is not automatically applied to the CellTemplate when that cell becomes the grid's current cell. There is a focus rectangle on the cell, but no focus events get triggered inside the cell (I've checked this). While readonly controls like TextBlocks can receive focus, if they don't then the keybinding cannot be triggered. The commands for the keybinding are correctly bound, so binding is not an issue.
The grid is defined like this:
<DataGrid x:Name="MyGrid"
ItemsSource="{Binding Path=FilteredSortedData}"
>
<DataGrid.Columns>
<StaticResource ResourceKey="StatusColumn" />
<StaticResource ResourceKey="MySpecialDeleteColumn" />
<StaticResource ResourceKey="...etc..." />
</DataGrid.Columns>
</DataGrid>
Then the column:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
x:Class="MyNamespace.GridColumns"
>
<FrameworkElement x:Key="GridColProxy" Name="GridColProxy" DataContext="{Binding DataContext, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}, NotifyOnSourceUpdated=True, NotifyOnTargetUpdated=True, Mode=OneWay}" />
<DataGridTemplateColumn x:Key="MySpecialDeleteColumn"
x:Shared="False"
Header="My Special Delete Column"
IsReadOnly="False"
>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel >
<!-- keybinding doesn't work at this level -->
<StackPanel.Style >
<Style TargetType="StackPanel">
<Setter Property="localBehaviours:InputBindingsBehaviour.AttachedKeyBindings">
<Setter.Value>
<localBehaviours:KeyBindingObservable >
<KeyBinding Key="Delete" Command="{Binding Path=DataContext.DeleteItemsCommand, Source={StaticResource GridColProxy}, Mode=OneWay, NotifyOnTargetUpdated=True}" />
</localBehaviours:KeyBindingObservable>
</Setter.Value>
</Setter>
</Style>
</StackPanel.Style>
<Grid >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0"
Text="{Binding SomeProperty}"
>
<TextBlock.Style>
<Style TargetType="TextBlock" >
<Style.Triggers>
<DataTrigger Binding="{Binding Path=MySpecialFlag, FallbackValue=false}" Value="True">
<Setter Property="localBehaviours:InputBindingsBehaviour.AttachedKeyBindings">
<Setter.Value>
<localBehaviours:KeyBindingObservable >
<KeyBinding Key="Delete" Command="{Binding Path=DataContext.DeleteItemsCommand, Source={StaticResource GridColProxy}, Mode=OneWay, NotifyOnTargetUpdated=True}" />
</localBehaviours:KeyBindingObservable>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
<Image Source="{Binding ...}"
Grid.Column="1"
/>
</Grid>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
<DataGridTemplateColumn.CellStyle>
<Style TargetType="{x:Type DataGridCell}" >
<Style.Triggers>
<!-- placing the keybinding here to apply to the grid cell doesn't have any effect... -->
<DataTrigger Binding="{Binding Path=MySpecialFlag, FallbackValue=false}" Value="True">
<Setter Property="localBehaviours:InputBindingsBehaviour.AttachedKeyBindings">
<Setter.Value>
<localBehaviours:KeyBindingObservable >
<KeyBinding Key="Delete" Command="{Binding Path=DataContext.DeleteItemsCommand, Source={StaticResource GridColProxy}, Mode=OneWay, NotifyOnTargetUpdated=True}" />
</localBehaviours:KeyBindingObservable>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</DataGridTemplateColumn.CellStyle>
</DataGridTemplateColumn>
</ResourceDictionary>
Notes:
ignore the localBehaviours:KeyBindingObservable, it is simply an attached property to assist with intercepting and inspecting keybindings before assigning them to the InputBindings property of the attached control. This works great, there is no issue here.
I have shown every place I have tried the keybindings, none of them have worked (been triggered). The DataTrigger bindings work correctly, so just ignore those.
CellEditingTemplate has been omitted for brevity
So the question I have is:
how can I force the CellTemplate items to receive (keyboard) focus, preferably with XAML? Or is there a way to apply the keybinding at cell level so that it works regardless of the template being shown?
If a XAML solution is not possible then a small amount of event triggered (PreviewKeyDown, etc) code in the code behind of the ResourceDictionary could be used.

WPF XAML - How to bind a DataTrigger to a ComboBox value

I currently have a ListView that takes in an item and displays a ComboBox and a Button.
I would like to dynamically show or hide the button based on the value of the ComboBox being equal to "BlahBlahBlah".
Currently the inside of my <GridView> looks like this:
<GridViewColumn Header="Property" Width="160">
<GridViewColumn.CellTemplate>
<DataTemplate>
<ComboBox x:Name="PropertyComboBox"
ItemsSource="{Binding Path=ArisingPropertyList, Mode=TwoWay}"
SelectedValue="{Binding ArisingProperty.PropertyName,
UpdateSourceTrigger=PropertyChanged}"
SelectedValuePath="PropertyName" Width="140" >
</ComboBox>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Width="30" >
<GridViewColumn.CellTemplate>
<DataTemplate>
<Button Content="...">
<Button.Style>
<Style TargetType="{x:Type Button}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=SelectedValue.PropertyName,
ElementName=PropertyComboBox}" Value="HideButton">
<Setter Property="Visibility" Value="BlahBlahBlah" />
</DataTrigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
Can someone point out where I'm going wrong? All I'm getting is:
System.Windows.Data Error: 4 : Cannot find source for binding with reference 'ElementName=PropertyComboBox'. BindingExpression:Path=SelectedValue.PropertyName; DataItem=null; target element is 'Button'; target property is 'NoTarget' (type 'Object')
You have already bounded SelectedValue property to your source class, so bind directly to that property instead of ComboBox. Issue is ComboBox and Button lies in different Visual trees so can't be bind using ElementName.
<DataTrigger Binding="{Binding Path=ArisingProperty.PropertyName}"
Value="HideButton">
<Setter Property="Visibility" Value="Collapsed" />
</DataTrigger>

Property 'Content' was not found in type 'FrameworkElement' using DataTrigger

I'm new to WPF.
I'm trying to display a ToolTip on a ListBox item only when the grouping is equal to "Search Results".
I'm getting an error that says :
"Property 'Content' was not found in type 'FrameworkElement'."
Can anyone tell me what's wrong with the code below?
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=code}">
<TextBlock.ToolTip>
<ToolTip>
<ToolTip.Triggers>
<DataTrigger Binding="{Binding Path=grouping}" Value="Search Results">
<Setter Property="Content" Value="{Binding Path=grouping}"/>
</DataTrigger>
</ToolTip.Triggers>
</ToolTip>
</TextBlock.ToolTip>
</TextBlock>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
It works ok without the trigger like the code below so it confuses me why it says that the property was not found.
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=code}">
<TextBlock.ToolTip>
<ToolTip Content="{Binding Path=grouping}" />
</TextBlock.ToolTip>
</TextBlock>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The Triggers collection of FrameworkElement is only for event triggers, not for DataTriggers or PropertyTriggers. Define a style for the ToolTip which contains the DataTrigger:
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=code}">
<TextBlock.ToolTip>
<ToolTip>
<Tooltip.Style>
<Style TargetType="ToolTip">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=grouping}" Value="Search Results">
<Setter Property="Content" Value="{Binding Path=grouping}"/>
</DataTrigger>
</Style.Triggers>
</Style>
</ToolTip.Style>
</ToolTip>
</TextBlock.ToolTip>
</TextBlock>
</DataTemplate>
</ListBox.ItemTemplate>
MSDN says:
Note that the collection of triggers established on an element only
supports EventTrigger, not property triggers (Trigger). If you require
property triggers, you must place these within a style or template and
then assign that style or template to the element either directly
through the Style property, or indirectly through an implicit style
reference.
That doesn't describe your problem directly, but read it as: Set Triggers in styles.
This article gets more specific: Dr. WPF Blog
There is also a Triggers collection on FrameworkElement, but it can
only contain event triggers… not property or data triggers.

Resources