How do I bind a selected treeView Item within a user control to a tabControl in the MainWindow in WPF XAML?

Question

I have a treeView in a userControl:

        <TreeView x:Name="treeData"
            Background="#282828" BorderThickness="0" Padding="0,5,0,0"
                  SelectedValuePath="Uid">
            <TreeViewItem Header="Data1" x:Name="tData1" Uid="tabData1">
                <TreeViewItem Header="Data1-1" x:Name="tP1" Uid="Data1"/>
                <TreeViewItem Header="Data1-2" x:Name="tP2" Uid="Data1"/>
            </TreeViewItem>
            <TreeViewItem Header="Data2" x:Name="tData2" Uid="tabData2"/>
            <TreeViewItem Header="Data3" x:Name="tData3" Uid="tabData3"/>
            <TreeViewItem Header="Data4" x:Name="tData4" Uid="tabData4"/>
            <TreeViewItem Header="Data5" x:Name="tData5" Uid="tabData5"/>
            <TreeViewItem Header="Data6" x:Name="tData6" Uid="tabData6"/>
            <TreeViewItem Header="Data7" x:Name="tData7" Uid="tabData7"/>
        </TreeView>

and a TabControl in the MainWindow:

                    <TabControl Grid.Column="1">
                        <TabItem Header="tabPs"
                        </TabItem>
                        <TabItem Header="tabPln"
                        </TabItem>
                        <TabItem Header="tabLn"
                        </TabItem>
                        <TabItem Header="tabAx"
                        </TabItem>
                        <TabItem Header="tabSp"
                        </TabItem>
                        <TabItem Header="tabPL">
                        </TabItem>
                        <TabItem Header="tabPk">
                        </TabItem>
                        <TabItem Header="tabAP"/>
                        </TabItem>
                    </TabControl>

I need to be able to have the correct tabItem selected when the user clicks on an Item in the UserControl TreeView Item. Is there a way to bind the selection of the treeView within the UserControl to select a tab on the MainWindow?

I'd previously asked a similar question here: WPF C# Bind multiple treeViewItems isSelected to tabItem isSelected but it is aimed at a userControl that has the tabControl as opposed to the TreeView and I'm struggling to see how to bind it when the TreeView is in the UserControl and the tabControl is in the MainWindow

The user control is within the MainWindow within a grid:

        <views:TreeViewCntrl Grid.Column="1" x:Name="treeViewGeo">
        </views:TreeViewCntrl>

Is the `UserControl` located inside the `MainWindow`? – mm8 Sep 06 '22 at 13:43 — mm8, Sep 06 '22 at 13:43
Yeah it is, I've updated the question to show – Andy_ Sep 06 '22 at 14:36 — Andy_, Sep 06 '22 at 14:36

score 0 · Answer 1 · answered Sep 06 '22 at 14:50

0

Make the treeData field internal or expose it using a public property of the UserControl:

<TreeView x:Name="treeData" x:FieldModifier="internal" ... />

You could then handle the SelectedItemChanged event for the TreeView of the ´UserControl` in the window:

treeViewGeo.treeData.SelectedItemChanged += (ss, ee) => 
{
    var selectedTreeViewItem = ee.NewValue as TreeViewItem;
    ... 
};

answered Sep 06 '22 at 14:50

mm8

163,881
10
57
88

Is it possible to do this within xaml to keep the code behind clean? – Andy_ Sep 06 '22 at 14:54
Do what exactly? XAML is a *markup* language. Somewhere you need to define the "connection" between the `TreeView` and the `TabControl`. – mm8 Sep 06 '22 at 14:57
Select the tab page based on the tree View selection. Similar to the answer here https://stackoverflow.com/questions/73562468/wpf-c-sharp-bind-tab-selection-to-treeview-selection which shows the binding between selected tree node and the tab page when the tabControl is in the User control, difference here being that with my setup the tree View is in the user control and tab control is in main window. But am being achieved in xaml and not using code behind – Andy_ Sep 07 '22 at 23:38
Based on what logic , i.e. how, do you connect a tree node and a tab page? – mm8 Sep 09 '22 at 08:03

How do I bind a selected treeView Item within a user control to a tabControl in the MainWindow in WPF XAML?

1 Answers1