Before you tell me that this question has been answered, please allow me to explain. I have read many answers regarding this but none of them (that I've read) solve my problem.
My project is a WPF project which uses C#, XAML and MVVM Light within Visual Studio 2010.
What I have is a ListBox. Each element of the ListBox is a canvas (rather than the default StackPanel). Each Canvas contains one 'Node' - basically a Thumb control with a style attached, and a Path control. The Path uses a MultiBinding on a list of Nodes in the view model to generate some lines between Nodes. When you drag one Node around (using DragDelta), the lines are updated.
A visual might help out:
As you can see, some lines are above nodes and some are below. Typically it seems that the lines that come from a node are below that node, but what I want is for all lines to be below all nodes.
I think the ListBox's ItemTemplate is the main thing here:
<ListBox.ItemTemplate>
<DataTemplate>
<Canvas>
<Path Stroke="Black" Canvas.ZIndex="1">
<Path.Data>
<MultiBinding Converter="{StaticResource NodeToPathDataConverter}">
<Binding Path="NodeListViewModel.NodeList" Source="{StaticResource Locator}" />
<Binding />
</MultiBinding>
</Path.Data>
</Path>
<Thumb Name="myThumb" Template="{StaticResource NodeVisualTemplate}" Canvas.ZIndex="2">
<i:Interaction.Triggers>
<i:EventTrigger EventName="DragDelta">
<cmd:EventToCommand Command="{Binding NodeListViewModel.DragDeltaCommand, Source={StaticResource Locator}}" PassEventArgsToCommand="True"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</Thumb>
</Canvas>
</DataTemplate>
</ListBox.ItemTemplate>
As you can see, I have tried using Canvas.ZIndex in the controls, but that just seems to set their z order in relation to each other, not related to the other nodes and/or lines.
Is there a way to tell is to put all Nodes above all Paths? Thanks.