Navigation from Tab Item to another Tab item from a ViewModel programmatically

Question

Main window Xaml

<StackPanel>
        <TabControl x:Name="MainTabControl" SelectedIndex="{Binding selected}">            
            <TabItem Header="Entry Form" TabIndex="0">
                <views:EntryForm />
            </TabItem>            
            <TabItem Header="Result" TabIndex="1">
                <views:DistanceResults />
            </TabItem>   
        </TabControl>
    </StackPanel>

Entry Form XAML

    <Button
        Command="{Binding MeasureDistanceCommand}"                    
        Content="Measure Distances"
       Style="{StaticResource BtnGreen}" />

   private void MeasureDistance()
        {
            if (!Helper.TryParseLatitude(StartLatitude, out var latitude)) return;
            if (!Helper.TryParseLongitude(StartLongitude, out var longitude)) return;

            var Startlocation = new Location(latitude, longitude);

            //todo iterate through he list of the end points and measure there distance
            //todo pass the values to the result tab
            //todo navigate to the result tab



        }

I am using WPF C# MVVM - have a standard BaseViewModel I have a TabControl in the Main window and 2 Tab Items.

What I Trying to do is when the Measure Distance button on the EntryForm is clicked and the command in the EntryFormViewModel finishes preparing the data for the results view. I Want to programmatically make the DistanceResults TabItem active and pass it the data that it needs to display.

This is for a WPF Distance Measure app which is open-sourced and is being developed on my Twitch stream, but I have not been able to find a way to do what I mentioned above. the project is here

https://github.com/copperbeardy/GPSDistanceMeasure

any assistance and advice is appreciated

That's why frameworks like prism provide elements like EventAggregator. You throw an event from one ViewModel and listen it from the other and act when that event fired. If you don't want to use MVVM framework you can implement your own. Create a singleton class which defines an event fire it from your EntryViewModel and listen it in MainWindow (Or its viewmodel) then change the active tab. — Eldar, Nov 16 '19 at 18:05
When the button is clicked, it should set a property in the ViewModel. The tab selection should subscribe to the ViewModel's property and show itself accordingly. Always interact with your ViewModel programmatically. Don't interact with the UI programmatically. — CodingYoshi, Nov 16 '19 at 18:39

Mateus Avelar · Accepted Answer · 2019-11-17T10:26:06.153

I think that you can Bind the IsSelected property from Tabitem to a boolean to kinda force that selection, but, it should be done in the viewmodel that is datacontext for whole tabcontrol, and also take advantage from the event aggregator from prism to send the data to another VM.

Event Aggregator

The flow could be something like this:

When the results is ready, you can publish a event and send the results as a payload of that event.
Subscribe that event in the results viewmodel to set all data that should be shown.
Subscribe that same event in the viewmodel that is the tabcontrol's datacontrol and in the handler you can set a boolen like "IsResultsSelected" to true.

So, you'll be able to do two things at once, send the data and select the tab.

Ps.I guess you can also use the Composite Commands and have almost the same result. The difference between each other you can check here.

Edit: I've implemented it in your code and sent a PR...

Navigation from Tab Item to another Tab item from a ViewModel programmatically

1 Answers1