I have a custom class (NewBlockLabelInfo) with an observable collection of another custom class (DoorControllerLabelInfo) I've successfully databound the NewBlockLabelInfo class to the treeview, and everything displays fine.
I have a lot of textboxs that are data bound to certain properties, and updating these reflects in the treeview.
I'd like to databind one set of textboxs for the properties, to the selected item in the treeview IF the selected item is a child of the specified treeviewitem (Observable Collection, Door Controllers)
The Data Context is specified at the window level.
I've looked long and hard for a way to do this, let alone the best way.
Heres the WPF XAML for the TreeView
<TreeView Margin="12,150,582,16" Name="treeView1">
<TreeViewItem Header="{Binding Path=BlockName}" Style="{StaticResource BlockItem}" IsExpanded="True">
<TreeViewItem Style="{StaticResource PhoneNoItem}" Header="{Binding Path=TelephoneNumber}"/>
<TreeViewItem Style="{StaticResource DataNoItem}" Header="{Binding Path=DataNumber}"/>
<TreeViewItem Style="{StaticResource CompanyItem}" Header="{Binding Path=CompanyName}"/>
<TreeViewItem Style="{StaticResource ConnectedItem}" Header="{Binding Path=ConnectedDC}" />
<TreeViewItem IsExpanded="True" Header="Door Controllers" Foreground="#FF585858" ItemsSource="{Binding Path=DoorControllers, UpdateSourceTrigger=PropertyChanged}" Name="DCTreeViewItem" Selected="DCTreeViewItem_Selected">
<TreeViewItem.ItemTemplate>
<HierarchicalDataTemplate>
<TreeViewItem Header="{Binding Path=DCName}" Style="{StaticResource DCItem}" IsExpanded="True" Selected="DCTreeViewItem_Selected" >
<TreeViewItem Header="{Binding Path=Address}" Style="{StaticResource AddressItem}" />
<TreeViewItem Header="{Binding Path=Channel1}" Style="{StaticResource Door1Item}" />
<TreeViewItem Header="{Binding Path=Channel2}" Style="{StaticResource Door2Item}" />
</TreeViewItem>
</HierarchicalDataTemplate>
</TreeViewItem.ItemTemplate>
</TreeViewItem>
<TreeViewItem IsExpanded="True" Header="Flats" Foreground="#FF585858" ItemsSource="{Binding Path=FlatNames, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}">
<TreeViewItem.ItemTemplate>
<DataTemplate>
<TreeViewItem Header="{Binding}" Style="{StaticResource FlatsItem}" IsExpanded="True">
</TreeViewItem>
</DataTemplate>
</TreeViewItem.ItemTemplate>
</TreeViewItem>
</TreeViewItem>
</TreeView>
How can I bind a textbox to a selected item property (or to the databound class property) of a TreeViewItem only if it is a child of Door Controllers TreeViewItem
Thank you in advance
Oliver
You would likely be best served with defining a DataTemplate selector, and creating several datatemplates. The selector can evaluate all kinds of logical rules, and return the template that you want.
Here is a pretty good getting started tutorial on DataTemplateSelectors.
EDIT
After rereading your question here is what I have got.
Do your model classes have navigation properties to get to parent objects? If so, you can use triggers (or more preferable if you are using MVVM) properties on the ViewModel to enable/disable/alter visibility based on what the parent object is rather than the parent TreeViewItem. It is a bit more difficult to access the visual tree the way you are describing.
I solved this myself by adding an event handler on click for each of the child TreeViewItems I am concerned with. With this I could then get the DataContext from it, and set it to be the DataContext of the TextBoxs, and create my own bindings.
Since DataContext retrieval is done by reference, and not by value this works.
Here is the event handler for when one of the child nodes are clicked than I am concerned with: (Forgive the temporary naming)
private void DCTreeViewItem_Selected(object sender, RoutedEventArgs e)
{
TreeViewItem currentItem = (TreeViewItem)e.OriginalSource;
textBox5.DataContext = ((DoorControllerLabelInfo)currentItem.DataContext);
Binding b = new Binding("DCName");
b.Mode = BindingMode.TwoWay;
b.UpdateSourceTrigger = UpdateSourceTrigger.PropertyChanged;
BindingOperations.SetBinding(textBox5, TextBox.TextProperty, b);
}
From this, I set the path, binding mode, and update source trigger in the XAML so that only the Data Context need to be updated.
Thanks
Oliver
Related
I am new to WPF. I wan to create a Dropdown List which will contain CheckBox items in to it as show in image. Is it Possible?
This is not the perfect solution to your question, but maybe it helps you anyway.
(You don't have to use <Canvas> but i like it because it's more comfortable to place elements)
<Canvas>
<ListBox Canvas.Left="280" Canvas.Top="40" Width="170">
<ListBoxItem>
<TreeView>
<TreeViewItem Header="Outboard">
<TreeViewItem Header="Generic">
<CheckBox>Bronze</CheckBox>
<CheckBox>Clear</CheckBox>
</TreeViewItem>
<TreeViewItem Header="Guardian">
<CheckBox>Clear</CheckBox>
<CheckBox>UltraWhite</CheckBox>
</TreeViewItem>
</TreeViewItem>
</TreeView>
</ListBoxItem>
</ListBox>
</Canvas>
Sry can't post a picture yet because i don't have enough Reputations.
So i uploaded it.
http://imageshack.us/scaled/thumb/849/examplezt.png
I used a Listbox instead of a Combobox and you only can check the latest items.
I tried to implement treeview with 4 levels using WPF/C#.Net 4.0.It loads all 4 levels but can't select 4th level and when selecting 3rd level it select group with 4th level.
Continent->Country->District->Artifacts is one structure but there is another one Continent->Products->Artifacts
Resource DataTemplates->
<DataTemplate x:Key="DistrictTemplates">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=ArtifactName}" />
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="CountryTemplate">
<TreeViewItem ItemsSource="{Binding Path=District}"
ItemTemplate=" {StaticResource DistrictTemplates}"
Header="{Binding Path=Code}">
</TreeViewItem>
</DataTemplate>
TreeView code->
<TreeView Name="treeExplorer" MouseDoubleClick="TreeView_MouseDoubleClick" SelectedItemChanged="treeExplorer_SelectedItemChanged">
<TreeViewItem Name="tviDefinition" IsExpanded="True" Header="Continent">
<TreeViewItem ItemsSource="{Binding Path=Country}" ItemTemplate="{StaticResource CountryTemplate}" Header="Country" />
</TreeViewItem>
</TreeView>
there are some other treeItems as well.I can't use inline template inside the TreeView.Resources and also im confused if can use this HierarchicalDataTemplate sine i cant call Country.Districts.ArtifactName and got two hierarchies but I can call Country.Districts() and then Districts has code property and using code i can find Artifacts.And im using datatemplates inside usercontrol.resources
How would I be able to do this?
Here's something I've written that goes 4 levels deep. It's a TreeView which shows HL7 message structure. For a quick background HL7 is a field separated message. You have a message. Each message has a Segment. Each Segment has at least one field. A field could have multiple components. A component can have subcomponents. This tree displays the HL7 message structure, where each level is a part of the HL7 message format.
For example, if there is PID segment in the message the tree would like this:
PID
...PID.1
...PID.2
......PID.2.1
......PID.2.2
......PID.2.3
......PID.2.4
.........PID.2.4.1
.........PID.2.4.2
etc...
Here is the XAML:
<TreeView x:Name="hl7Structure" ItemsSource="{Binding Path=MessageSegments}" IsEnabled="True">
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type MyNamespace:MessageSegment}" ItemsSource="{Binding Path=Fields}">
<TextBox x:Name="segmentName" BorderBrush="Transparent" BorderThickness="0" Text="{Binding Path=Name}" FocusVisualStyle="{x:Null}" />
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type MyNamespace:MessageField}" ItemsSource="{Binding Path=Components}">
<TextBlock x:Name="fieldName" Text="{Binding Path=Name}" ToolTip="{Binding Path=Info}" />
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type MyNamespace:MessageComponent}" ItemsSource="{Binding Path=Subcomponents}">
<TextBlock x:Name="componentName" Text="{Binding Path=Name}" ToolTip="{Binding Path=Info}" />
</HierarchicalDataTemplate>
<DataTemplate DataType="{x:Type MyNamespace:MessageSubcomponent}">
<TextBlock x:Name="subComponentName" Text="{Binding Path=Name}" ToolTip="{Binding Path=Info}" />
</DataTemplate>
</TreeView.Resources>
</TreeView>
Now the explanation of how it works. I have a base object that each HL7 message piece inherits. The ItemsSource of the TreeView is bound to that collection. Since there are 4 levels, where 3 show hierarchy and one that does not, there are 3 HierarchicalDataTemplates and 1 DataTemplate.
Think of it this way...The HL7 Message Segment, Field, and Components are tree nodes because they have children. The HL7 subcomponent is a leaf, because it has none. Each tree node gets a HierarchicalDataTemplate, but each leaf just gets a DataTemplate.
Each of HierarchicalDataTemplates know what object type to display by using the DataType property. Here is where I tell the control, the child type it's displaying. This allows me to use the base type collection and then display all the child types at their appropriate node levels.
Hope this helps.
Finally I managed to solve this.Thanks Josh and everyone.
Resource DataTemplates->
<DataTemplate x:Key="DistrictTemplates">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=ArtifactName}" />
</StackPanel>
</DataTemplate>
<HierarchicalDataTemplate x:Key="CountryTemplate" DataType="Continent.Countries" ItemsSource="{Binding Path=District}" ItemTemplate="{StaticResource DistrictTemplates}">
<TextBlock Text="{Binding Path=Code}"/>
</HierarchicalDataTemplate>
TreeView code->
<TreeView Name="treeExplorer" MouseDoubleClick="TreeView_MouseDoubleClick" SelectedItemChanged="treeExplorer_SelectedItemChanged">
<TreeViewItem Name="tviDefinition" IsExpanded="True" Header="Continent">
<TreeViewItem ItemsSource="{Binding Path=Country}" ItemTemplate="{StaticResource CountryTemplate}" Header="Countries" />
</TreeViewItem>
</TreeView>
I have dynamically create usercontrol, this usercontrol i want bind into DataTemplate.
EX:
usercontrol:
GridWidget propWidget = new GridWidget(GridWidgetDefinition);
DataTemplate:
<DataTemplate x:Key="GroupBoxTemplate">
<GroupBox Header="{Binding Name}">
<control:GridWidget/>
</GroupBox>
</DataTemplate>
How to bind propWidget usercontrol into inside Groupbox?
For this specific problem you can bind Content property of your group box with the control. Something like this,
<DataTemplate x:Key="GroupBoxTemplate">
<GroupBox Header="{Binding Name}" Content="{Binding Control}" />
</DataTemplate>
Not sure if this the best way to solve it.
I have a TreeView whose contents (nested TreeViewItems) are generated from a dataset via databinding, which all seems to work fine. The issue I'm running into is that when I try and manipulate the contents of the TreeViewItem headers in code, the Header property returns the DataRowView that the TreeViewItem was generated from and not, as I was expecting, the control generated by the template.
Here's an example of the template I'm using to generate the TreeViewItems:
<DataTemplate x:Key="seasonTreeViewItemTemplate">
<TreeViewItem>
<TreeViewItem.Header>
<CheckBox Content="{Binding Path=Row.SeasonID}" Tag="{Binding}" ToolTip="{Binding Path=Row.Title}" IsEnabled="{StaticResource seasonPermitted}" Checked="CheckBox_Checked" Unchecked="CheckBox_Unchecked" />
</TreeViewItem.Header>
<TreeViewItem Header="Championships" ItemTemplate="{StaticResource championshipTreeViewItemTemplate}">
<TreeViewItem.ItemsSource>
<Binding Path="Row" ConverterParameter="FK_Championship_Season">
<Binding.Converter>
<local:RowChildrenConverter />
</Binding.Converter>
</Binding>
</TreeViewItem.ItemsSource>
</TreeViewItem>
</TreeViewItem>
</DataTemplate>
Can anyone point out where I'm going wrong and advise me how to access the header checkboxes (ideally without delving into the VisualTree if possible)?
Thanks,
James
Well, after some searching I have found an adequate solution to the problem.
Using the following code, you can find named items in the template:
if (treeViewItem != null)
{
//Get the header content presenter.
ContentPresenter header = treeViewItem.Template.FindName("PART_Header", treeViewItem) as ContentPresenter;
if (header != null)
{
//Find a CheckBox called "checkBoxName"
CheckBox cb = treeViewItem.HeaderTemplate.FindName("checkBoxName", header) as CheckBox;
}
}
Also, for the benefit of anyone else who may not be too clued up on databinding treeviews: The template I posted in my question is not the right way to go about binding a treeview. Use a HierarchicalDataTemplate for each level of the tree. The direct content of the HierarchicalDataTemplate will specify the header content of each subtree and setting the ItemsSource and ItemTemplate properties will allow you to bind and format the subtrees children, for example:
<HierarchicalDataTemplate x:Key="templateName" ItemsSource="{Binding Path=someCollection}" ItemTemplate="{StaticResource someOtherTemplate}">
<TextBlock Text="{Binding Path=SomeProperty}" />
</HierarchicalDataTemplate>
I hope someone else will find this information useful.
I'm pretty new to Xaml and need some advise.
A TreeView should be bound to a hierarchical object structure. The TreeView should have a context menu, which is specific for each object type.
I've tried the following:
<TreeView>
<TreeView.Resources>
<DataTemplate x:Key="RoomTemplate">
<TreeViewItem Header="{Binding Name}">
<TreeViewItem.ContextMenu>
<ContextMenu>
<MenuItem Header="Open" />
<MenuItem Header="Remove" />
</ContextMenu>
</TreeViewItem.ContextMenu>
</TreeViewItem>
</DataTemplate>
</TreeView.Resources>
<TreeViewItem Header="{Binding Name}" Name="tviRoot" IsExpanded="True" >
<TreeViewItem Header="Rooms"
ItemsSource="{Binding Rooms}"
ItemTemplate="{StaticResource RoomTemplate}">
<TreeViewItem.ContextMenu>
<ContextMenu>
<MenuItem Header="Add room"></MenuItem>
</ContextMenu>
</TreeViewItem.ContextMenu>
</TreeViewItem>
</TreeViewItem>
But with this markup the behavior is as intended, but the child items (the rooms) are indented too much.
Anyway all the bining samples I could find use TextBlock instead of TreeViewItem in the DataTemplate, but wonder how to integrate the ContextMenu there.
You would not normally create a DataTemplate containing a TreeViewItem, because the binding infrastructure will be creating the TreeViewItem for you -- all your DataTemplate needs to do is specify what should be displayed as the content of the TreeViewItem. That's why the samples you've found use TextBlocks instead of TreeViewItems in the DataTemplate.
I suspect the use of TreeViewItem rather than TextBlock causes the excessive indenting because you have a (manually created) TreeViewItem in your DataTemplate (which incurs one level of indent) inside another (automatic) TreeViewItem (which incurs another level of indent). Therefore, using a TextBlock instead of a TreeViewItem should cure this. Integrating the ContextMenu shouldn't be an issue because TextBlock has a ContextMenu property too.
So you should be able to just change your DataTemplate as follows:
<DataTemplate x:Key="RoomTemplate">
<TextBlock Text="{Binding Name}">
<TextBlock.ContextMenu>
<ContextMenu>
<MenuItem Header="Open" />
<MenuItem Header="Remove" />
</ContextMenu>
</TextBlock.ContextMenu>
</TextBlock>
</DataTemplate>
Incidentally for TreeViews it is common to use a HierarchicalDataTemplate rather than a plain DataTemplate because this allows for multiple levels of items via the HierarchicalDataTemplate.ItemsSource property. This may not be required in your scenario though.