I am trying to add a content control inside a treeview, but when I add treeview items inside content control they are aligned further away from other treeview items.
<TreeView>
<TreeViewItem Header="XXX-1"></TreeViewItem>
<TreeViewItem Header="XXX-2"></TreeViewItem>
<ContentControl>
<TreeViewItem Header="YYY-1"></TreeViewItem>
</ContentControl>
<TreeViewItem Header="XXX-3"></TreeViewItem>
</TreeView>
The above code results in a treeview like below.
XXX-1
XXX-2
YYY-1
XXX-3
I think ContentControl adds another TreeViewItem by itself. How can I align the TreeViewItems together?
I would start with Rachel's answer but remove the ContentControl. You can accomplish this with two DataTemplates and an ItemTemplateSelector assigned to the TreeViewItem's ItemTemplateSelector property.
Define your complex and simple types into two DataTemplates. Then write a class which inherits from DataTemplateSelector that determines if the complex or simple type should be used in the TreeViewItem. You then set the TreeViewItem's ItemTemplateSelector to the DataTemplateSelector object you just created. Here's is an example: http://msdn.microsoft.com/en-us/library/system.windows.controls.itemscontrol.itemtemplateselector.aspx.
Here is another link that shows you how to select a DataTemplate based on a condition: http://msdn.microsoft.com/en-us/library/ms742521.aspx. Search for the header Choosing a DataTemplate Based on Properties of the Data Object.
It does nest the ContentControl in a TreeViewItem (see Snoop screenshot below)
Snoop also tells me that the extra margin is for the +/- Expander, so you'll probably have to overwrite the template to get rid of that margin if you want to keep your TreeViewItems nested.
Of course, if you're simply trying to place a ContentControl inside your TreeViewItem, the tags should be the other way around.
<TreeViewItem Header="YYY-1">
<ContentControl />
</TreeViewItem>
Related
I have a couple specific user controls to Show some Content, e.g. simple like Image, WebControl but also two complex specific custom controls drawing on a canvas.
Now I thought using the DataTemplateSelector to handle the different UserControls. I actully used this http://tech.pro/tutorial/807/wpf-tutorial-how-to-use-a-datatemplateselector as a reference.
I changed the code so the form loads the UserControls dynamically (according to the file extension) in the following collection:
ObservableCollection<string> _pathCollection = new ObservableCollection<string>();
The only difference to the reference is now I want to navigate back and forward to the next control by showing one control only at the time. Which control should I use instead of ListView?
<Grid>
<ListView ScrollViewer.CanContentScroll="False"
ItemsSource="{Binding ElementName=This, Path=PathCollection}"
ItemTemplateSelector="{StaticResource imgStringTemplateSelector}">
</ListView>
</Grid>
How do I need to bind it to the template (equal to ItemTemplateSelector above)? WPF is still very new to me and I am learning.
Use a ContentControl. Bind your current item to the Content-property and the DataTemplateSelector to the ContentTemplateSelector-property.
<ContentControl Content="{Binding Path=CurrentItem, Mode=OneWay}", ContentTemplateSelector="{StaticResource imgStringTemplateSelector}" />
Your CurrentItem should be a DependencyProperty or a INotifyPropertyChanged-property of your DataContext. When you change your CurrentItem, the ContentControl will update the template automatically with help of your TemplateSelector.
I have a tab content template set to my tab control:
<TabControl SelectedIndex="0"
ItemsSource="{Binding Tabs}"
ItemTemplate="{StaticResource AppTabItemTemplate}"
ContentTemplate="{StaticResource AppTabContentTemplate}" />
The thing is that most of the times the current template is wanted, but there are times when I want to display another template instead. The item source provides this data whether it should show one or another, but how can I do an "if" in XAML and use an alternative UI when the other layout is wanted?
Should this logic be part of the template or the containing XAML that includes this tab control? The information that is used to make the decision between UIs is in the item source.
Use a DataTemplateSelector.
You will need to define your selection logic in a class that derives DataTemplateSelector, create a resource for your selector in XAML and then use it by assigning the resource to the ItemTemplateSelector property of your tab control.
I've used the ItemsPanelTemplate on other controls such as the ListBox, so I figured doing the same thing for the TabControl would be simple.
Apparently, I'm missing something and the TabControl is completely ignoring what I place in the ItemsPanelTemplate.
I have xaml that looks kinda of like this:
<TabControl TabStripPlacement="Right" ItemsSource="{Binding Components}">
<TabControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</TabControl.ItemsPanel>
</TabControl>
I've tried replacing WrapPanel with UniformGrid to see if there was a difference and it behaves the same. I do have a ControlTemplate for TabItem, but I tried removing it and it made no difference so I don't think that's effecting my problem.
You're probably looking to overwrite the Template, not the ItemsPanel
You can overwrite TabControl.ItemTemplate (or TabItem.Template) to alter the appearance of the Tabs along the top, TabControl.ContentTemplate to alter the template used for the content of the Tab, or TabControl.Template to alter the overall template of the TabControl.
I wasn't even aware that TabControl's had an ItemsPanel. I've only ever used that with an ItemsControl, where the ItemsPanel affects what kind of control contains the items in the collection. If the TabControl has that property, I expect it's only because it inherited it from some base class
So I have editted the TreeViewItem template, (so that I could get rid of the checkbox).
I was just wondering how I can apply this template to my treeview...The Treeview is databound.
is it something like:
<TreeView>
<TreeView.ItemTemplate>
....
...
?
Thanks!
Use the ItemContainerStyle of the TreeView. Or apply it implicitly by having it defined in the resources with only the TargetType set (this could be superior as the ItemContainerStyle may only affect the root items).
I want to create a WPF control similar to the example below. Check out the link and look at the navigation control on the left.
Can this be done in a treeview? If so, any idea how I would start?
If not a treeview, then how could I achieve the same thing?
Navigation example
The parent node has a different style to the child node and in some cases a parent will have child nodes and some won't. I'm not sure how to style a control that will give me the same look. Any advice would be greatly appreciated.
Thanks,
Since you can style different nodes of a treeview as you like, the answer is yes, you can. You have to bind a treeview to an IEnumerable<A>, where every object of type A will have an IEnumerable<B> (which can be empty).
You can then apply one style to every element of type A, and another style to every element of type B. In XAML, in TreeView.Resources, put two HierarchicalDataTemplates with DataType attributes. For example, if you have an IEnumerable of Categories, and each Category has a property Items which is an IEnumerable of Items, you may write:
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type core:Category}">
<!--Content here-->
<HierarchicalDataTemplate.ItemsSource>
<Binding Path="ContextAssociations"/>
</HierarchicalDataTemplate.ItemsSource>
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type core:Item}">
<!--Content here-->
</HierarchicalDataTemplate>
</TreeView.Resources>