In my application I have a two TreeView objects that are bound to the same data.
I made a user control for the Tree which is called TreeView and looks like this:
<UserControl x:Class="MyApp.Views.TreeControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:model="clr-namespace:MyApp.Model"
xmlns:viewModel="clr-namespace:MyApp.ViewModels"
xmlns:views="clr-namespace:MyApp.Views"
xmlns:converters="clr-namespace:MyApp.Converters">
<UserControl.Resources>
<converters:EnumToPicConverter x:Key="Converter"></converters:EnumToPicConverter>
<!--Control colors.-->
<Style x:Key="MyTreeViewItemStyle" TargetType="TreeViewItem">
<Setter Property="IsExpanded" Value="{Binding Path=(model:TreeNode.IsExpanded), Mode=TwoWay}" />
</Style>
<HierarchicalDataTemplate DataType="{x:Type model:TreeNode}" ItemsSource="{Binding ChildListNodes}">
<HierarchicalDataTemplate.Triggers>
<DataTrigger Binding="{Binding IsEqual}" Value="false">
<Setter Property="TreeViewItem.Background" Value="Blue"></Setter>
</DataTrigger>
</HierarchicalDataTemplate.Triggers>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Path=EntityType,Converter={StaticResource Converter}}" />
<TextBlock Margin="5,0" Text="{Binding ItemName, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}"/>
</StackPanel>
</HierarchicalDataTemplate>
</UserControl.Resources>
<TreeView ItemsSource="{Binding RootNode}" ItemContainerStyle="{StaticResource MyTreeViewItemStyle}" />
Now, In my main window, I use it in the following way:
<Window x:Class="MyApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:model="clr-namespace:MyApp.Model"
xmlns:viewModel="clr-namespace:MyApp.ViewModels"
xmlns:views="clr-namespace:MyApp.Views"
xmlns:converters="clr-namespace:MyApp.Converters"
Title="MainWindow" Height="350" Width="525">
<Window.DataContext>
<viewModel:TreeViewModel/>
</Window.DataContext>
<DockPanel>
<Grid DockPanel.Dock="Top" Name="LoadRow">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
</Grid.ColumnDefinitions>
<views:DbChooser Path="{Binding Path1}" ReloadCommand="{Binding LoadFileACommand}" Grid.Column="0"/>
<views:DbChooser Path="{Binding Path2}" ReloadCommand="{Binding LoadFileBCommand}" Grid.Column="1"/>
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
</Grid.ColumnDefinitions>
<views:TreeControl Grid.Column="0" ItemName="{Binding Name1}"/>
<views:TreeControl Grid.Column="1" ItemName="{Binding Name2}"/>
</Grid>
</DockPanel>
Problem is that:
The DataContext is "viewModel:TreeViewModel" , but I want to bind each treeViewItem's Textblock content to a different property of "model:TreeNode" (which is the type of class of the TreeNodeItem holds..)
And in the main window it says "Cannot resolve property "Name1" in data context of type 'MyApp.ViewModels.TreeViewModel' .
I tried various different options and read few posts here in StackOverFlow but couldn't find a solution..
Thanks for any help.
edit, few clarifications:
1. TreeControl just wraps WPF TreeView (you can see the code is pasted..)
2. The DataContext of The MainWindow is TreeViewModel, it is a class that holds the Root Node of the tree (of type TreeNode) and few other properties I use. The Property that I want to "send" to the TreeControl is a property of type TreeNode, which is the type of the TreeViewItems
Another edit:
In other words, what I want to accomplish is that:
To "tell" to the first TreeControl " Please put in the text block of each TreeNodeItem the content of the the property 'Name1' "
And to "tell" the second TreeControl "Please put in the text block of each TreeNodeItem the content of the property 'Name2' "
I do not try to answer but perhaps give you some hints to debug.
You can use "DataContextChanged" event on most xaml tag to make sure you get the DataContext you expect.
If you have the expected DataContext but got warning in xaml. You could use:
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
and set:
<AnyTagThatHasDataContext d:DataContext="{d:DesignInstance Type=youDataContextObject}">
That will help to design your window/UserControl
Related
I have a UserControl, and I need to change its appearance when 'IsEnabled' is false. I know this is pretty basic WPF styling, but I can't seem to put the pieces together. I assume that I need to create a Style, and add a trigger for "Property="IsEnabled" Value="False". But where do I put the Style definition? (<UserControl.Resources>?) How do I apply it? ... in the UserControl or in the Parent window? Does my trigger need to be inside a Setter element? Does the style need to be applied to the UserControl or to its children? I don't know what other questions I need to ask!
If you feel this is a duplicate of another question, please direct me to it.
If you know of a good, simple tutorial on WPF styling that would answer my questions, I would be very grateful to hear of it.
My code looks like this:
<UserControl x:Class="UserControls.UCDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:UserControls"
mc:Ignorable="d"
d:DesignHeight="240" d:DesignWidth="200">
<UserControl.Resources>
</UserControl.Resources>
<Grid Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="5*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Background="{Binding BG}" >
<Ellipse Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5" Fill="DeepSkyBlue" />
</Grid>
<Grid Grid.Row="1" Background="Tomato" />
</Grid>
<uc:UCDemo x:Name="Demo" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="300,100,0,0" Width="80" Height="100" Style="{StaticResource uc:DemoStyle}"
Visibility="{Binding LightVisible, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Converter={StaticResource BooleanToVisibilityConverter}}" />
Thank you for your help!
It depends on how exactly the appearance should change when IsEnabled is false.
A simple Style with a Trigger could be assigned directly to the UserControl's Style property. The one below just sets the Opacity to 0.5.
<UserControl ...>
<UserControl.Style>
<Style TargetType="UserControl">
<Style.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Opacity" Value="0.5"/>
</Trigger>
</Style.Triggers>
</Style>
</UserControl.Style>
<Grid Background="Transparent">
...
</Grid>
</UserControl>
I'm not sure I get what your question is. However in order to change the IsEnabled property of a control, depending on an other controls is:
Let's suppose that the control which its IsEnabled must be changed, is A and the control which A is depends on, is B.
First, choose a name for B: x:Name = "AccessCheckBox".
Then Write a binding like this for control B:
< ... IsEnabled = {Binding ElementName = "AccessCheckBox", Path="IsChecked".../>
Done. I hope I got what you mean.
First of, I am coming back to WPF after several years of leaving it behind, I knew a little of it before and develop a few windows but now I am beyond rusty.
I am trying to build a DataGrid with filter headers, now I understand that there isn't a ready made control for that and needs to be created, which I have started using a Template.
My template consists of a Label control to the left which contains the title of the header, and a DatePick control to the right which I will use as part of my filtering process. I am trying to get Label.Content property inside my template to pick the DataGridTextColumn.Header property value of template parent.
I have tried RelativeSource, TemplatedParent and everything else there is, I also couldn't find any post on here that described a similar issue to mine nor a solution. Any help would be greatly appreciated. Thanks.
My code
<UserControl x:Class="CustomControls.ReportsListingControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="100" d:DesignWidth="600">
<UserControl.Resources>
<Style x:Key="ColumnHeaderStyle1" TargetType="{x:Type DataGridColumnHeader}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="DataGridColumnHeader">
<Grid Width="200" Height="35">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Width="50"
Content="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGridTextColumn}}, Path=Header}" />
<DatePicker Grid.Column="1"
HorizontalAlignment="Right"
VerticalAlignment="Center"
Width="30"
BorderThickness="0" Text="" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
<Grid>
<DataGrid Name="DataGrid1" >
<DataGrid.Columns>
<DataGridTextColumn HeaderStyle="{StaticResource ColumnHeaderStyle1}" Header="The Text I want displayed in my template label" />
</DataGrid.Columns>
</DataGrid>
</Grid>
Bind to the DataContext itself:
<Label ... Content="{Binding}" />
The DataContext of a DataGridColumnHeader is the Header object itself, i.e. the string in your case.
I would like to bind a property from a nested UserControl to my MainWindow.
I'm already using a similar structure for other things but this is a bit different:
-MainWindow
--Ribbon
---RibbonButton <-- the button I would like to disable
--/Ribbon
--UserControl1 - not directly the control I want bind to
---UserControl2 - nested user control, sitting inside the above one
----TextBox <-- Bind the RibbonButton to the Text property. Disable the button when TextBox empty
---/UserControl2
--/UserControl
-/MainWindow
So, the usual combination of Elementname and Path doesn't work here obviously. Is DataContext the way to go here? The UserControls are in separate files and so is the MainWindow. Or should I do this in code-behind?
Some of the code I'm having there:
MainWindow
<RibbonWindow.Resources>
<BooleanToVisibilityConverter x:Key="BoolToVis"/>
</RibbonWindow.Resources>
...
<RibbonGroup Header="Import">
<RibbonButton x:Name="mplImpFromForum" Label="From forum" FontSize="12" LargeImageSource="Icons/General/Icon8_download_72px.png" Click="mplImpFromForum_Click"/>
<RibbonButton x:Name="mplImpManual" Label="Manual import" SmallImageSource="Icons/General/Icon8_whole_hand_32px.png"}>
<RibbonButton.Style>
<Style>
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=frmLogin, Path=}"
// here lies my problem
</Style.Triggers>
</Style>
</RibbonButton.Style>
</RibbonButton>
</RibbonGroup>
</RibbonTab>
</Ribbon>
<Viewbox Grid.Row="1" Panel.ZIndex="1" MaxHeight="200" MaxWidth="200">
<local:frmLogin x:Name="frmLogin" Loaded="frmLogin_Loaded" Grid.Row="1"/>
</Viewbox>
<local:frmMPLMain x:Name="frmMPLMain" Grid.Row="1"/> // "Source UserControl, "parent
to the real target.
The first nested UserControl
<UserControl x:Class="Fever_Tool_WPF.frmMPLMain"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:Fever_Tool_WPF"
mc:Ignorable="d"
x:Name="MPLRoot"
d:DesignHeight="500" d:DesignWidth="1000">
...
<local:frmMPLImp x:Name="frmMPLImp" Grid.Column="2" Grid.ColumnSpan="4" Grid.RowSpan="6"/>
// The second UserControl, this one contains the TextBox I want to take as a source
<DataGrid HeadersVisibility="None" Grid.RowSpan="3" Grid.ColumnSpan="2"></DataGrid>
</Grid>
The second UserControl
<UserControl x:Class="Fever_Tool_WPF.frmMPLImp"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:Fever_Tool_WPF"
mc:Ignorable="d"
d:DesignHeight="500" d:DesignWidth="1000">
<UserControl.Resources>
<Style x:Key="uiMPLImpBaseStyle" TargetType="{x:Type FrameworkElement}">
<Setter Property="Margin" Value="5"/>
</Style>
</UserControl.Resources>
...
<TextBox x:Name="txtMPLImport" Style="{StaticResource uiMPLImpBaseStyle}" Grid.Row="2" Grid.ColumnSpan="4"/>
// This is the textbox I would like to check.
...
</Grid>
I'm just not getting it: I've a ribbon-menu where some tabs/groups/buttons are defined in xaml and some tabs/groups/buttons are defined during runtime (user loads a certain "command set"). To realise this I put the ribbonTab which is defined in xaml and a collection container inside a compositeCollection.
MainWindow.xaml
<RibbonWindow x:Class="test_ribbonButtonBinding.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility /2006"
xmlns:local="clr-namespace:test_ribbonButtonBinding"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525" DataContext=" {StaticResource svm}">
<RibbonWindow.Resources>
<CollectionViewSource x:Key="tabs" Source="{Binding ribbon}"/>
</RibbonWindow.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Ribbon x:Name="RibbonMenu" Grid.Column="0" Grid.Row="0">
<Ribbon.ItemsSource>
<CompositeCollection>
<RibbonTab Header="Testtab" >
<RibbonGroup x:Name="Testgroup" Header="Testgroup">
<RibbonButton LargeImageSource="Icons/question.png" Label="TestAddCommand" Command="{Binding cmdTestAddCommand}" />
<RibbonButton LargeImageSource="Icons/question.png" Label="TestReadCommand" Command="{Binding cmdTestReadCommand}" CommandParameter="{Binding SelectedItem, ElementName=lstSequence}"/>
</RibbonGroup>
</RibbonTab>
<CollectionContainer Collection="{Binding Source={StaticResource tabs}}"/>
</CompositeCollection>
</Ribbon.ItemsSource>
</Ribbon>
<ListView x:Name="lstSequence" ItemsSource="{Binding sequence}" Grid.Row="1" Grid.Column="0" SelectionMode="Extended"/>
</Grid>
</RibbonWindow>
Problem now arises for the CommandParameter of the already defined buttons:
System.Windows.Data Error: 4 : Cannot find source for binding with reference 'ElementName=lstSequence'. BindingExpression:Path=SelectedItem; DataItem=null; target element is 'RibbonButton' (Name=''); target property is 'CommandParameter' (type 'Object')
This might be simple but I just can't wrap my head around it: how do I bind the commandparameter to the selectedItems in the ListView. It's obviously the wrong dataContext.
What further confuses me: if I leave out the composite collection (so all tabs are just defined inside the xaml) the command binds correctly to the element inside the viewmodel and the commandparameter binds correctly to the elements in the window (how does this work anyway, should BOTH bind to the viewmodel as it is specified in the DataContext of the window???)
Any help appreciated.
Resu
EDIT:
Finally setting a setter property in the listview solved the problem
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="IsSelected" Value="{Binding IsSelected}"/>
</Style>
</ListBox.ItemContainerStyle>
But I'm still wondering why my method doesn't work anypody else an explanaition for this?
Two options (untested):
1) use parent element to pass value via RelativeSource:
<Grid Tag={Binding SelectedItem, ElementName=lstSequence}>
...
<!-- hopefully there are no other grids on the way -->
<RibbonButton CommandParameter="{Binding Tag, RelativeSource={RelativewSource FindAncestor, AncestorType=Grid}}"
Command="{Binding cmdTestReadCommand}" .../>
...
<ListView x:Name="lstSequence" ... />
</Grid>
2) do not use parameter at all
<ListView SelectedItem={Binding SelectedItem, Mode=OneWayToSource} ... />
view model:
public whatevertype SelectedItem { get; set; }
inside command execute delegate
var parameter = SelectedItem;
I have a small application to help myself learn WPF and MVVM etc. I have been using the example by Josh Smith found here to construct my own application. I have got the application adding TabItems, but the embedded DataGrid which is bound to an ObservableCollection<ResourceViewModel> is not showing any data, see the image below:
The DataGrid is the section surrounded in blue. The UserControl also seems to be showing the in the tab itself for some reason, but that is not the problem I am asking about here. The UserControl contains a DataGrid which is bound as follows
<DataGrid ItemsSource="{Binding Resources}"
dataAccess:DataGridTextSearch.SearchValue="{Binding ElementName=searchBox,
Path=Text, UpdateSourceTrigger=PropertyChanged}"
AlternatingRowBackground="Gainsboro"
AlternationCount="2"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
...</DataGrid>
The Resources property is defined in the ViewModels namespace as
internal class ResourceDataViewModel : WorkspaceViewModel
{
readonly ResourceDataRepository resourceRepository;
public ObservableCollection<ResourceViewModel> Resources { get; private set; }
...
}
Where the ResourceViewmodel holds the information for each row of the DataGrid. I can confirm that the Resource property is populated. When I use the same model outside of MVVM and populate Resource in the same way it works. Can someone provide me with and idea of why this could be happening?
I have attempted to set the explicit path for the binding
ItemsSource="{Binding Path=(viewModels:Resources)}"
but this also does not work. Thanks for your time.
Edit. To address comments. I set the DataContext in the App.xaml.cs file by
protected override void OnStartup(StartupEventArgs e)
{
base.OnStartup(e);
MainWindow window = new MainWindow();
// Create the ViewModel to which
// the main window binds.
MainWindowViewModel mainWindowViewModel = new MainWindowViewModel();
// When the ViewModel asks to be closed,
// close the window.
EventHandler handler = null;
handler = delegate
{
mainWindowViewModel.RequestClose -= handler;
window.Close();
};
mainWindowViewModel.RequestClose += handler;
// Allow all controls in the window to
// bind to the ViewModel by setting the
// DataContext, which propagates down
// the element tree.
window.DataContext = mainWindowViewModel;
window.Show();
}
The XAML of the MainWindow:
<Window x:Class="ResourceStudio.Views.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:viewModels="clr-namespace:ResourceStudio.ViewModels"
xmlns:views="clr-namespace:ResourceStudio.Views"
Title="MainWindow" Height="629.4" Width="814.4">
<Window.Resources>
<ResourceDictionary Source="MainWindowResources.xaml" />
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="284*"/>
<ColumnDefinition Width="567*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="48"/>
<RowDefinition Height="*"/>
<RowDefinition Height="24"/>
</Grid.RowDefinitions>
<DockPanel KeyboardNavigation.TabNavigation="None"
Background="#FFBEC8D8"
Grid.ColumnSpan="2"
Margin="0,0,0.4,0">
<Menu DockPanel.Dock="Top"
Background="#FFF9F9F9"
BorderBrush="Black"
KeyboardNavigation.TabNavigation="Cycle">
<MenuItem Header="_File">
<MenuItem Header="Load _Resource..."
Height="Auto"
Command="{Binding LoadResourceCommand}"/>
<MenuItem Header="_Add Language..."
Height="Auto"/>
<Separator/>
<MenuItem Header="Close _Workspace"
Height="Auto"
Command="{Binding CloseCommand}"/>
<MenuItem Header="E_xit"
Height="Auto" Command="{Binding CloseCommand}" />
</MenuItem>
<MenuItem Header="_Edit">
</MenuItem>
</Menu>
<ToolBarTray DockPanel.Dock="Top" MaxHeight="24" Background="#FFF9F9F9">
<ToolBar Background="#FFF9F9F9">
<Button ToolBar.OverflowMode="Never">One</Button>
<Button>Two</Button>
<Button>Three</Button>
</ToolBar>
</ToolBarTray>
</DockPanel>
<Grid Grid.Row="1" Grid.ColumnSpan="2" Margin="0,0,0.4,23.6" Grid.RowSpan="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TabControl ItemsSource="{Binding Path=Workspaces}"
Grid.Column="2"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
TabStripPlacement="Top"
Height="Auto"
Width="Auto">
</TabControl>
</Grid>
<StatusBar Grid.Row="2" Grid.ColumnSpan="2" Margin="0,0.4,0.4,-0.4">
<StatusBarItem DockPanel.Dock="Left" Background="#FF007ACC" Margin="0,2,0,0">
<TextBlock Text="Ready" Margin="5,0,0,0"/>
</StatusBarItem>
</StatusBar>
</Grid>
</Window>
Where the MainWindowResources.xaml is:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:viewModels="clr-namespace:ResourceStudio.ViewModels"
xmlns:views="clr-namespace:ResourceStudio.Views"
>
<!--This template applies a ResourceControl view to an instance of the
ResourceDataViewModel class shown in the main window.-->
<DataTemplate DataType="{x:Type viewModels:ResourceDataViewModel}">
<views:ResourceControl/>
</DataTemplate>
<!--This template explains how to render the 'Workspace'
content area in the main window.-->
<DataTemplate x:Key="WorkspacesTemplate">
<TabControl
IsSynchronizedWithCurrentItem="True"
ItemsSource="{Binding}"
Margin="4"/>
</DataTemplate>
</ResourceDictionary>
The full code for the ResourceControl.xaml is:
<UserControl x:Class="ResourceStudio.Views.ResourceControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:viewModels="clr-namespace:ResourceStudio.ViewModels"
xmlns:dataAccess="clr-namespace:ResourceStudio.DataAccess"
mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="300" Name="control">
<DockPanel DataContext="{Binding ElementName=control}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBox Text="M" DockPanel.Dock="Top" Name="searchBox" />
<Grid DockPanel.Dock="Top">
<Border BorderBrush="#FF007ACC" BorderThickness="2" HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
<DataGrid ItemsSource="{Binding Path=(viewModels:Resources)}"
dataAccess:DataGridTextSearch.SearchValue="{Binding ElementName=searchBox, Path=Text, UpdateSourceTrigger=PropertyChanged}"
AlternatingRowBackground="Gainsboro" AlternationCount="2" HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
<DataGrid.Resources>
<dataAccess:SearchValueConverter x:Key="searchValueConverter"/>
<Style TargetType="{x:Type DataGridCell}">
<Setter Property="dataAccess:DataGridTextSearch.IsTextMatch">
<Setter.Value>
<MultiBinding Converter="{StaticResource searchValueConverter}">
<Binding RelativeSource="{RelativeSource Self}" Path="Content.Text" />
<Binding RelativeSource="{RelativeSource Self}" Path="(dataAccess:DataGridTextSearch.SearchValue)" />
</MultiBinding>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="dataAccess:DataGridTextSearch.IsTextMatch" Value="True">
<Setter Property="Background" Value="Orange" />
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.Resources>
<DataGrid.CellStyle>
<Style TargetType="DataGridCell" BasedOn="{StaticResource {x:Type DataGridCell}}">
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="#FF007ACC"/>
<Setter Property="Foreground" Value="White"/>
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.CellStyle>
</DataGrid>
</Border>
</Grid>
</DockPanel>
</UserControl>
The TextBox is bound to the DataGrid. When the user types into that TextBox the DataGrid filters and highlights the cells which contains the required text. This however, is not the problem and this code works, it is just the binding to the DataGrid I am interested in. Thanks again for tour time.
Edit2: According to #dkozl's comments I have removed the DataContext="{Binding ElementName=control}" from the DockPanel declaration, so we now have
<DockPanel HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
...
and in the MainWindowResource.xaml I now have
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:viewModels="clr-namespace:ResourceStudio.ViewModels"
xmlns:views="clr-namespace:ResourceStudio.Views"
>
<!--This template applies a ResourceControl view to an instance of the
ResourceDataViewModel class shown in the main window.-->
<DataTemplate DataType="{x:Type viewModels:ResourceDataViewModel}">
<views:ResourceControl DataContext="{Binding}"/>
</DataTemplate>
<!--This template explains how to render the 'Workspace'
content area in the main window.-->
<DataTemplate x:Key="WorkspacesTemplate">
<TabControl
IsSynchronizedWithCurrentItem="True"
ItemsSource="{Binding}"
Margin="4"/>
</DataTemplate>
</ResourceDictionary>
This has not worked. That is my DataGrid in the ResourceControl is not being populated. Thanks again for your time it is most appreciated...
Your UserControl DockPanel.DataContext is bound to ResourceControl control and not to ResourceDataViewModel class. What you need to do instead is to bind DataContext of ResourceControl in your DataTemplate. To achive that first remove DataContext="{Binding ElementName=control}" from ResourceControl.DockPanel and then bind ResourceControl.DataContext to your object by <views:ResourceControl DataContext={Binding}"/>. Also you need to change DataGrid items binding from ItemsSource="{Binding Path=(viewModels:Resources)}" to ItemsSource="{Binding Path=Resources}".
Not part of the original question but same template applies to tab header and tab content because DataTemplate is type specific and in this case tab header content and tab content is the same thing. To solve the issue remove DataTemplate for viewModels:ResourceDataViewModel type and put this directly into your main TabControl:
<TabControl.ContentTemplate>
<DataTemplate>
<views:ResourceControl DataContext={Binding}"/>
</DataTemplate>
</TabControl.ContentTemplate>