16.01 Wpf Custom user controls for the First View (Wpf) - chempkovsky/CS2WPF-and-CS2XAMARIN GitHub Wiki

  • Preparation steps to first run Dm04WebApp
    • Set up default constructor of LitDbContext
        public LitDbContext() : base("name=LitConnection") { }

- Set up connection strings in the Web.config

    <add name="DefaultConnection"
    connectionString="Data Source=SVR2016SQL2017;Initial Catalog=AspNetDm04WebAppSecurity;Persist Security Info=True;User ID=sa;Password=YOUR_PASSWORD"
    providerName="System.Data.SqlClient" />
    <add name="LitConnection"
    connectionString="Data Source=SVR2016SQL2017;Initial Catalog=LitStorageDm04WebApp;Persist Security Info=True;User ID=sa;Password=YOUR_PASSWORD"
    providerName="System.Data.SqlClient" />

- Db Migration is not used for this demo app. Instead the following code have been executed in the small console app to create  Data Base on the SQL server

        Database.SetInitializer(new DropCreateDatabaseAlways<LitDbContext>());
        LitDbContext db = new LitDbContext();
        db.LitGenreDbSet.FirstOrDefault();
        MessageBox.Show("The database was successfully created.", "Done", 
            MessageBoxButton.OK, MessageBoxImage.Information);
        Database.SetInitializer(new CreateDatabaseIfNotExists<LitDbContext>());

  • To Generate C# classes for the first View

    • Run Visual Studio and Open “WpfDemo” solution
    • Under ModelInterfacesClassLibrary-project create folder
      • Literature/LitGenre
    • Right Click the folder
      • Literature/LitGenre
    • And select “Wpf Forms Wizard” menu item to open the Wizard dialog

  • Note:

    • 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.

picture

- Click “Next”-button
  • On the second page of the dialog the developer should select existing DbContext file. Select:
    • Dm02Context (project)
    • LitDbContext (context)

picture

- Click “Next”-button
  • On the third page of the dialog the developer should select the View. Select:
    • “LitGenreView“.
  • In the left panel select “UI List Properties” node and check Shown for both:
    • GenreId
    • GenreName

picture

  • In the left panel of the same page of the dialog select “UI Form Properties” node and check Shown for both properties. Set “InputType” as it is shown on the slide.

picture

- Click “Next”-button
  • On the fourth page click “batch processing”-button. “Batch actions” dialog will be shown.
    • Select “01100-Intefaces.json”
    • Click “Start”-button

picture

- Close both dialogs
  • Under ModelServicesPrismModule-project create folder
    • Literature/LitGenre
    • Right Click the folder
      • Literature/LitGenre
    • And select “Wpf Forms Wizard” menu item to open the Wizard dialog
    • Repeat all the steps until the “Batch Actions” dialog box appears.
    • Note:
      • The developer should not define again
        • “UI List Properties”
        • “UI Form Properties”
      • All settings were saved during the first batch.
  • In “Batch actions” dialog
    • Select “01400-ApiService.json”
      • Click “Start”-button
    • Select “01420-SForm.json”
      • Click “Start”-button
    • Select “01500-Eform.json”
      • Click “Start”-button
    • Select “01600-Lform.json”
      • Click “Start”-button
    • Close both dialogs
  • Note #1:
    • Sform is a search form for the given View
    • Eform is an Edit form for the given View
    • Lform is a wrapper for the two forms above.
  • Note #2:
    • Sform and Eform are the basic forms with all the user interface logic for the given View.
    • Other forms are wrappers for these two.
  • Under ModelServicesPrismModule-project
    • open the file "Literature/LitGenre/LitGenreViewService.cs" and follow the instruction at the beginning of the file:
/*
    In the file of IModule-class of the project for the current service the following lines of code must be inserted:
        public void RegisterTypes(IContainerRegistry containerRegistry)
        {
            ...
            containerRegistry.Register<ILitGenreViewService, LitGenreViewService>();
            ...
        }
*/
  • Under ModelServicesPrismModule-project
    • open the file "Literature/LitGenre/ViewModels/LitGenreViewSformViewModel.cs" and follow the instruction at the beginning of the file
    • open the file "Literature/LitGenre/ViewModels/LitGenreViewSdlgViewModel.cs" and follow the instruction at the beginning of the file
    • open the file "Literature/LitGenre/ViewModels/LitGenreViewEformViewModel.cs" and follow the instruction at the beginning of the file
    • open the file "Literature/LitGenre/ViewModels/LitGenreViewEformViewModel.cs" and follow the instruction at the beginning of the file
    • open the file "Literature/LitGenre/ViewModels/LitGenreViewLformViewModel.cs" and follow the instruction at the beginning of the file
    • open the file "Literature/LitGenre/ViewModels/LitGenreViewLformViewModel.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
            // temporaty declaration for test only
            containerRegistry.RegisterForNavigation<LitGenreViewLformUserControl, LitGenreViewLformViewModel>("LitGenreViewLformUserControl");
  • Under ModelServicesPrismModule-project the RegisterTypes()-method of the ModelServicesPrismModuleModule.cs becomes as follows
        public void RegisterTypes(IContainerRegistry containerRegistry)
        {
            containerRegistry.Register<ILitGenreViewService, LitGenreViewService>();
            // According to requirements of the "LitGenreViewSformViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            ViewModelLocationProvider.Register<LitGenreViewSformUserControl, LitGenreViewSformViewModel>();
            // According to requirements of the "LitGenreViewSformViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.Register<UserControl, LitGenreViewSformUserControl>("LitGenreViewSformUserControl");
            // According to requirements of the "LitGenreViewSdlgViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.RegisterDialog<LitGenreViewSdlgUserControl, LitGenreViewSdlgViewModel>("LitGenreViewSdlgViewModel");
            // According to requirements of the "LitGenreViewEformViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            ViewModelLocationProvider.Register<LitGenreViewEformUserControl, LitGenreViewEformViewModel>();
            // According to requirements of the "LitGenreViewEformViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.Register<UserControl, LitGenreViewEformUserControl>("LitGenreViewEformUserControl");
            // According to requirements of the "LitGenreViewEdlgViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.RegisterDialog<LitGenreViewEdlgUserControl, LitGenreViewEdlgViewModel>("LitGenreViewEdlgViewModel");
            // According to requirements of the "LitGenreViewLformViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            ViewModelLocationProvider.Register<LitGenreViewLformUserControl, LitGenreViewLformViewModel>();
            // According to requirements of the "LitGenreViewLformViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.Register<UserControl, LitGenreViewLformUserControl>("LitGenreViewLformUserControl");
            // According to requirements of the "LitGenreViewLdlgViewModel.cs"-file of "ModelServicesPrismModule"-project. 
            containerRegistry.RegisterDialog<LitGenreViewLdlgUserControl, LitGenreViewLdlgViewModel>("LitGenreViewLdlgViewModel");


            // temporaty declaration for test only
            containerRegistry.RegisterForNavigation<LitGenreViewLformUserControl, LitGenreViewLformViewModel>("LitGenreViewLformUserControl");
        }
  • 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},
};
  • rebuild
    • ModelInterfacesClassLibrary
    • ModelServicesPrismModule
    • PrismDemoApp
  • run Dm04WebApp
  • run PrismDemoApp
  • In the app click "LitGenre Lform"-menu item and add a pair of records

picture