Navigate to Views in order on one tab using prism

Question

I admit, I have been learning prism and some of their conception is not clear for me. I have met a some problem and I dont know how to solve it. I have to built creaotr of configuration which i divined on few view for instance: profile, after finish it, view with credit card, then views with address then Some configuration additional for something. Some of them are necesery like profile and address. We cant go to address if we dont have profile. Some of them are not nessecery like credit card.

My company want to do it using one common TabControl and one common tabItem. Inside of this tabItem I have to display every view. I have to change View after hit on button "Next" or "miss". Also I have PreviousStep. My question if how to store many View in some ORDER.

So far: I have class

GeneralBaseViewModel : BindableBase, INavigationAware

It is abstract class which is a common for every class.

I have GeneralHost.xaml which have only

mvvm:RegionManager.RegionName="MainTabControlRegion"

as telerik:RadTabControl (so it normal TabControl). It is class who have tabControl common for every view.

In menu which should open these tab with first view I implemented NavigateOn where I added

if (viewType == typeof(IConfiguration))
                {
                    this.RegionManager.RequestNavigate(RegionNames.MainRegion, typeof(GeneralHost).FullName);
                    this.RegionManager.RequestNavigate(RegionNames.MainTabControlRegion, viewType.FullName);
                    return;
                }

Inside of MainTabControlRegion I want to add View -> so I created MyProfileViewModel (it implement IConfiguration) and MyProfile which look like:

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:lang="clr-namespace:LanguageResources.Properties;assembly=LanguageResources"
              xmlns:mvvm="http://prismlibrary.com/"
              xmlns:mainRegionItems="clr-namespace:App.MainRegionItems"
            xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
            xmlns:converters="clr-namespace:Shared.Converters;assembly=Shared"
            xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
            xmlns:enumerators="clr-namespace:AppManager.Models.ComplexTypes.Enumerators;assembly=AppManager.Models"
            Style="{DynamicResource ControlDefaultStyle}"
      d:DataContext="{d:DesignInstance mainRegionItems:MyProfileViewModel, IsDesignTimeCreatable=True}"
      x:Class="App.MainRegionItems.ConfigurationOfProfile" mc:Ignorable="d" mvvm:ViewModelLocator.AutoWireViewModel="True" d:DesignHeight="800" d:DesignWidth="800" >
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Loaded">
            <i:InvokeCommandAction Command="{Binding LoadDataCommand}"/>
        </i:EventTrigger>
    </i:Interaction.Triggers>
    <telerik:RadBusyIndicator BusyContent="{x:Static lang:Resources.PleadeWait}" IsBusy="{Binding IsBusy}">
        <Grid Background="White" >
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"></ColumnDefinition>
                <ColumnDefinition Width="*"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="*"></RowDefinition>
            </Grid.RowDefinitions>

            <GroupBox Grid.Column="0" Grid.Row="0" Header="{x:Static lang:Resources.AddressSender}"
                        HorizontalAlignment="Left" VerticalAlignment="Top" Height="307" Width="400">
                <Grid>
                    <Grid.Resources>
                        <Style TargetType="{x:Type TextBox}">
                            <Setter Property="Margin" Value="5" />
                        </Style>
                    </Grid.Resources>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"></ColumnDefinition>
                        <ColumnDefinition Width="*"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition></RowDefinition>
                        <RowDefinition></RowDefinition>
                        <RowDefinition></RowDefinition>
                        <RowDefinition></RowDefinition>
                        <RowDefinition></RowDefinition>
                        <RowDefinition></RowDefinition>
                        <RowDefinition></RowDefinition>
                        <RowDefinition></RowDefinition>
                    </Grid.RowDefinitions>
                    <Label Grid.Row="0" Grid.Column="0" Content="{x:Static lang:Resources.Name}" />
                    <TextBox Grid.Row="0" Grid.Column="1" Text="{Binding ModifiedInstance.DefaultSendingAddress.CompanyName,ValidatesOnDataErrors=True, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"  />
                    <Label Grid.Row="1" Grid.Column="0" 
                                   Content="{x:Static lang:Resources.AdditionalName}" />
                    <TextBox Grid.Row="1" Grid.Column="1"
                                     Text="{Binding ModifiedInstance.DefaultSendingAddress.AdditionalName,ValidatesOnDataErrors=True,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
                </Grid>
            </GroupBox>
            <Menu Grid.Column="1"  Grid.Row="1" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="10" Height="23" >
                <MenuItem Style="{DynamicResource MenuItemStyle}" Command="{Binding SaveDataCommand}"
                              Header="{x:Static lang:Resources.SaveData}">
                    <MenuItem.Icon>
                        <Image Source="/App;component/Icons/Zapisz.ico" Height="25" />
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Style="{DynamicResource MenuItemStyle}" Command="{Binding NextStepCommand}"
                              Header="{x:Static lang:Resources.NextStep}">
                    <MenuItem.Icon>
                        <Image Source="/App;component/Icons/Zapisz.ico" Height="25" />
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Style="{DynamicResource MenuItemStyle}" Command="{Binding PreviousStepCommand}"
                              Header="{x:Static lang:Resources.PreviousStep}">
                    <MenuItem.Icon>
                        <Image Source="/App;component/Icons/Zapisz.ico" Height="25" />
                    </MenuItem.Icon>
                </MenuItem>
            </Menu>
        </Grid>
    </telerik:RadBusyIndicator>
</UserControl>

My VM:

public class ConfigurationOfProfileViewModel : GeneralBaseViewModel, IConfiguration
    {
        /// <summary>
        /// The report title.
        /// </summary>
        protected override string GeneralDetailTitle => "Configuration";

        public override void OnNavigatedTo(NavigationContext navigationContext)
        {
            this.GetConfigurationData();
        }

        /// <summary>
        /// The get report data.
        /// </summary>
        public void GetConfigurationData()
        {
            this.LoadingOn();
            this.SetHeaderTitle();
            this.LoadData();
            this.LoadingOff();
        }

        public int indexOrder = 0;

        private ICommand saveDataCommand;
        public ICommand SaveDataCommand => saveDataCommand ?? (saveDataCommand = new DelegateCommand(SaveData));

        private ICommand loadDataCommand;
        public ICommand LoadDataCommand => loadDataCommand ?? (loadDataCommand = new DelegateCommand(LoadData));

        private ICommand nextStepCommand;
        public ICommand NextStepCommand => nextStepCommand ?? (nextStepCommand = new DelegateCommand(NextStep));

        private ICommand previousStepCommand;
        public ICommand PreviousStepCommand => previousStepCommand ?? (previousStepCommand = new DelegateCommand(LoadData)); 

        private Profile modifiedInstance;
        public Profile ModifiedInstance
        {
            get
            {
                return this.modifiedInstance;
            }
            private set
            {
                this.SetProperty(ref this.modifiedInstance, value);
                this.OnPropertyChanged(() => this.ModifiedInstance);
            }
        }

        private void LoadData()
        {
            var repProfile = new ProfileRepository();
            Task<Profile> taskProfile = repProfile.GetPodmiot();
            this.ModifiedInstance = taskProfile.Result;

            if (this.ModifiedInstance == null)
            {
                this.ModifiedInstance = new Profile();
            }
            if (this.ModifiedInstance.ProfileData == null)
            {
                this.ModifiedInstance.ProfileData = new Address();
            }
            this.OnPropertyChanged(() => this.ModifiedInstance);
        }

        public async void SaveData()
        {
            this.LoadingOn();

            try
            {
                var repProfile = new ProfileRepository();
                var taskProfiles = repProfile.GetAll();
                var profiles = taskProfiles.Result;
                if (profiles.Any())
                {
                    await repProfile.Modify(this.ModifiedInstance);
                }
                else
                {
                    await repProfile.Add(this.ModifiedInstance, this.currentlyLoggedUser);
                }
                UserMessageBox.ShowError(Resources.Save, Resources.SaveSucceed, MessageBoxType.Information);
                this.LoadingOff();

            }
            catch (Exception e)
            {
                throw e;
            }

        }

        public async void NextStep()
        {
            try
            {
                this.SaveData();

            }
            catch (Exception ex)
            {
                UserMessageBox.ShowError(Resources.SaveFailed, ex.Message);
            }
        }
    }

I created also other view like CreditCardConfiguration and VM (implement IConfiguration), SenderAddress, ReceiverAddress and so on. Every VM have properties indexOrder (int).

My question is how to prepare NextStepCommand which should change content of MainTabControlRegion. Views have to be available in specific order. If I finished profile which have indexOrder= 0 I can go to next View with indexOrder=1. Now after execute NextStepCommand I saved profile only. How to reload content of RegionNames.MainTabControlRegion ? And how to implement ordering of these views?

Thank you for every help in advantage.

Answer 1

Just navigate to the next view using IRegionManager.RequestNavigate in your NextStep method. You automatically get a previous functionality if you do this. You should read up on the navigation feature of Prism in the docs http://prismlibrary.readthedocs.io/en/latest/WPF/08-Navigation/#view-based-navigation