A2.01 Navigation aware components (Wpf Custom User Controls and Navigation bar) (Wpf) - chempkovsky/CS2WPF-and-CS2XAMARIN GitHub Wiki

According to the requirements formulated by "A1 Navigation aware components (requirements)"-article we must start with "Book".

We describe all the steps for the Book. The same steps need to be done for the other Views.

  • right click "\Literature\LitBook"-folder of ModelServicesPrismModule-project and run "Wpf Forms Wizard"
  • On the first page of the dialog the destination folder is shown. The destination folder is the folder in which the generated file will be saved.
  • Click “Next”-button
  • On the second page of the dialog the developer should select existing DbContext file. Select:
    • Dm02Context (project)
    • LitDbContext (context)
  • Click “Next”-button
  • On the third page of the dialog the developer should select the View. Select:
    • “LitBookView“.

picture

  • Click “Next”-button
  • On the fourth page of the dialog click "Batch processing":

picture

  • To generate Navigation aware components with "Add/Update/Delete"-form implemented as a navigation aware page the developer runs:

    • 01820-Redit.json ("Add/Update/Delete"-page)
    • 01920-Rlist.json (tabular page)

  • To generate Navigation aware components with "Add/Update/Delete"-form implemented as a dialog the developer runs:

    • 02020-Rdlist.json (tabular page)

  • Under ModelServicesPrismModule-project

    • open the file "Literature/LitBook/ViewModels/LitBookViewReditViewModel.cs" and follow the instruction at the beginning of the file
    • open the file "Literature/LitBook/ViewModels/LitBookViewRlistViewModel.cs" and follow the instruction at the beginning of the file
    • open the file "Literature/LitBook/ViewModels/LitBookViewRdlistViewModel.cs" and follow the instruction at the beginning of the file

  • Under ModelServicesPrismModule-project add the following lines of code into RegisterTypes()-method of the ModelServicesPrismModuleModule.cs

  • Under ModelServicesPrismModule-project the RegisterTypes()-method of the ModelServicesPrismModuleModule.cs becomes as follows

        public void RegisterTypes(IContainerRegistry containerRegistry)
        {
            ...
            // According to requirements of the "LitBookViewReditViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            ViewModelLocationProvider.Register<LitBookViewReditUserControl, LitBookViewReditViewModel>();
            // According to requirements of the "LitBookViewReditViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.RegisterForNavigation<LitBookViewReditUserControl, LitBookViewReditViewModel>("LitBookViewReditUserControl");
            // According to requirements of the "LitBookViewReditViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.Register<UserControl, LitBookViewReditUserControl>("LitBookViewReditUserControl");
            // According to requirements of the "LitBookViewRlistViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            ViewModelLocationProvider.Register<LitBookViewRlistUserControl, LitBookViewRlistViewModel>();
            // According to requirements of the "LitBookViewRlistViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.RegisterForNavigation<LitBookViewRlistUserControl, LitBookViewRlistViewModel>("LitBookViewRlistUserControl");
            // According to requirements of the "LitBookViewRlistViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.Register<UserControl, LitBookViewRlistUserControl>("LitBookViewRlistUserControl");
            // According to requirements of the "LitBookViewRdlistViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            ViewModelLocationProvider.Register<LitBookViewRdlistUserControl, LitBookViewRdlistViewModel>();
            // According to requirements of the "LitBookViewRdlistViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.RegisterForNavigation<LitBookViewRdlistUserControl, LitBookViewRdlistViewModel>("LitBookViewRdlistUserControl");
            // According to requirements of the "LitBookViewRdlistViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.Register<UserControl, LitBookViewRdlistUserControl>("LitBookViewRdlistUserControl");
            ...
        }
  • Open "ViewModels\MainWindowViewModel.cs"-file of the PrismDemoApp-project
  • Modify _MainMenu variable as shown
IEnumerable<IWebServiceFilterMenuInterface> _MainMenu = new ObservableCollection<IWebServiceFilterMenuInterface>()
{
  new WebServiceFilterMenuViewModel() { Id = "000", Caption="Home", IconName="Home",  IconColor="Primary", Data="HomeUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="LitGenre Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitGenreViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="LitEdition Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitEditionViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Country Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitCountryViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Language Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitLanguageViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Dialect Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitDialectViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Publisher Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitPublisherViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Manuscript Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitManuscriptViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},

  new WebServiceFilterMenuViewModel() { Id = "001", Caption = "Book Rlist", IconName = "TableRefresh",  IconColor = "Primary", Data = "LitBookViewRlistUserControl", Command = RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption = "Book Rdlist", IconName = "TableRefresh",  IconColor = "Primary", Data = "LitBookViewRdlistUserControl", Command = RoutedCommandExt.MainMenuCommand},

};

  • rebuild

    • ModelInterfacesClassLibrary
    • ModelServicesPrismModule
    • PrismDemoApp

  • run Dm04WebApp

  • run PrismDemoApp

  • click "Book Rlist"-navigation menu item

    • select any row and right click it to open context menu
    • select "Update"

picture

  • Update form wiill be shown

picture

Navigation aware components for Manuscript

After accomplishing all the steps above for Manuscript _MainMenu variable will be as follows

IEnumerable<IWebServiceFilterMenuInterface> _MainMenu = new ObservableCollection<IWebServiceFilterMenuInterface>()
{
  new WebServiceFilterMenuViewModel() { Id = "000", Caption="Home", IconName="Home",  IconColor="Primary", Data="HomeUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="LitGenre Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitGenreViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="LitEdition Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitEditionViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Country Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitCountryViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Language Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitLanguageViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Dialect Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitDialectViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Publisher Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitPublisherViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption="Manuscript Lform", IconName="TableRefresh",  IconColor="Primary", Data="LitManuscriptViewLformUserControl", Command=RoutedCommandExt.MainMenuCommand},

  new WebServiceFilterMenuViewModel() { Id = "001", Caption = "Book Rlist", IconName = "TableRefresh",  IconColor = "Primary", Data = "LitBookViewRlistUserControl", Command = RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption = "Book Rdlist", IconName = "TableRefresh",  IconColor = "Primary", Data = "LitBookViewRdlistUserControl", Command = RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption = "Manuscript Rlist", IconName = "TableRefresh",  IconColor = "Primary", Data = "LitManuscriptViewRlistUserControl", Command = RoutedCommandExt.MainMenuCommand},
  new WebServiceFilterMenuViewModel() { Id = "001", Caption = "Manuscript Rdlist", IconName = "TableRefresh",  IconColor = "Primary", Data = "LitManuscriptViewRdlistUserControl", Command = RoutedCommandExt.MainMenuCommand},

};

  • rebuild

    • ModelInterfacesClassLibrary
    • ModelServicesPrismModule
    • PrismDemoApp

  • run Dm04WebApp

  • run PrismDemoApp

  • click "Manuscript Rlist"-navigation menu item

    • select any row and right click it to open context menu
    • select "LitBookView: Manuscript"-menu items

picture

  • All "detail" Books will be shown for the selected manuscript

picture

  • Navigate to "Add New Item"-form

picture

  • "Add New Item"-form will be shown with "Manusctipt"-related controls populated with data. All "Manusctipt"-related controls will be read-only.

picture