Guidance for View-ViewModel
parent
e56a7f33a0
commit
92e975916d
@ -1,3 +1,10 @@
|
||||
# prism-knowledgebase
|
||||
# KnowledgeBase for Prism Guidance
|
||||
|
||||
KnowledgeBase for Prism Pattern
|
||||
* [Official Site](https://prismlibrary.com/)
|
||||
* Existing Mitech-wpf use `Prism 4.x`. The only official legacy reference is based on [Prism 6](https://prismlibrary.com/docs/wpf/legacy/Introduction.html)
|
||||
* Its using `MEF Ioc (Dependency Injection)`. The `MEF DI` was removed from Prism 7.x and above. Only `Unity Dependency Injection` supported form Prism 7.x onward
|
||||
* The latest Prism Library is `8.1`
|
||||
* Prism 8 support NET 5 and dotnet Framework. Prism 6.x and below only DotNet Framework 4.8 and below
|
||||
|
||||
## Tutorials
|
||||
- [View-ViewModel](./view-viewmodel.md)
|
||||
@ -0,0 +1,197 @@
|
||||
# Adding New View-ViewModel for Package Info
|
||||
|
||||
1. Create XAML view code
|
||||
```xml
|
||||
<UserControl x:Class="MitechLib.Modules.PackagePage.Views.CarrierInfoView"
|
||||
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:local="clr-namespace:MitechLib.Modules.PackagePage.Views"
|
||||
mc:Ignorable="d"
|
||||
d:DesignHeight="450"
|
||||
d:DesignWidth="800">
|
||||
<UserControl.Resources>
|
||||
<Style TargetType="TextBlock"
|
||||
BasedOn="{StaticResource MiTStaticTxtStyle}" />
|
||||
|
||||
</UserControl.Resources>
|
||||
<Grid>
|
||||
<DockPanel>
|
||||
|
||||
<Grid>
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition />
|
||||
<ColumnDefinition />
|
||||
</Grid.ColumnDefinitions>
|
||||
<!-- Labels -->
|
||||
<UniformGrid Grid.Column="0"
|
||||
Columns="1"
|
||||
Width="300"
|
||||
VerticalAlignment="Top">
|
||||
<UniformGrid.Background>
|
||||
<SolidColorBrush d:Color="AliceBlue" />
|
||||
</UniformGrid.Background>
|
||||
|
||||
<TextBlock Text="Pitch X (mm)" />
|
||||
<TextBlock Text="Pitch Y (mm)" />
|
||||
<TextBlock Text="1st Pocket X (mm)" />
|
||||
<TextBlock Text="1st Pocket Y (mm)" />
|
||||
<TextBlock Text="Number of Pocket X" />
|
||||
<TextBlock Text="Number of Pocket Y" />
|
||||
</UniformGrid>
|
||||
<!-- Values -->
|
||||
<UniformGrid Grid.Column="1"
|
||||
Columns="1"
|
||||
VerticalAlignment="Top">
|
||||
<TextBox Text="2.2" />
|
||||
<TextBox Text="2.2" />
|
||||
<TextBox Text="2.2" />
|
||||
<TextBox Text="2.2" />
|
||||
<TextBox Text="2.2" />
|
||||
<TextBox Text="2.2" />
|
||||
</UniformGrid>
|
||||
</Grid>
|
||||
<UniformGrid DockPanel.Dock="Right"
|
||||
VerticalAlignment="Bottom"
|
||||
HorizontalAlignment="Right"
|
||||
Columns="1">
|
||||
<Button Content="Undo" />
|
||||
<Button Content="Save" />
|
||||
<Button Content="Exit" />
|
||||
</UniformGrid>
|
||||
</DockPanel>
|
||||
</Grid>
|
||||
</UserControl>
|
||||
```
|
||||
|
||||
2. Create C# ViewModel Class
|
||||
```cs
|
||||
|
||||
using MitechLib.Infrastructure.Data;
|
||||
|
||||
namespace MitechLib.Modules.PackagePage.ViewModels
|
||||
{
|
||||
public class CarrierInfoViewModel : ViewModelBase
|
||||
{
|
||||
private string _labelPitchX;
|
||||
|
||||
public string LabelPitchX
|
||||
{
|
||||
get { return _labelPitchX; }
|
||||
set { _labelPitchX = value; }
|
||||
}
|
||||
|
||||
public CarrierInfoViewModel()
|
||||
{
|
||||
LabelPitchX = "Pitch X (mm)";
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
3. Decorate the MEF `[Export] / [Import]` attributes
|
||||
```cs
|
||||
using MitechLib.Infrastructure.Data;
|
||||
using System.ComponentModel.Composition;
|
||||
|
||||
namespace MitechLib.Modules.PackagePage.ViewModels
|
||||
{
|
||||
[Export]
|
||||
public class CarrierInfoViewModel : ViewModelBase
|
||||
{
|
||||
private string _labelPitchX;
|
||||
|
||||
public string LabelPitchX
|
||||
{
|
||||
get { return _labelPitchX; }
|
||||
set { _labelPitchX = value; }
|
||||
}
|
||||
|
||||
public CarrierInfoViewModel()
|
||||
{
|
||||
LabelPitchX = "Pitch X-- (mm)";
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```cs
|
||||
using Microsoft.Practices.Prism.Regions;
|
||||
using System.ComponentModel.Composition;
|
||||
using System.Windows.Controls;
|
||||
|
||||
namespace MitechLib.Modules.PackagePage.Views
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for CarrierInfoView.xaml
|
||||
/// </summary>
|
||||
[ViewSortHint("02")]
|
||||
[PartCreationPolicy(CreationPolicy.Shared)]
|
||||
[Export]
|
||||
public partial class CarrierInfoView : UserControl
|
||||
{
|
||||
public CarrierInfoView()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
4. Setup DataContext Binding
|
||||
```cs
|
||||
using Microsoft.Practices.Prism.Regions;
|
||||
using MitechLib.Modules.PackagePage.ViewModels;
|
||||
using System.ComponentModel.Composition;
|
||||
using System.Diagnostics.CodeAnalysis;
|
||||
using System.Windows.Controls;
|
||||
|
||||
namespace MitechLib.Modules.PackagePage.Views
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for CarrierInfoView.xaml
|
||||
/// </summary>
|
||||
[ViewSortHint("02")]
|
||||
[PartCreationPolicy(CreationPolicy.Shared)]
|
||||
[Export]
|
||||
public partial class CarrierInfoView : UserControl
|
||||
{
|
||||
public CarrierInfoView()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
[Import]
|
||||
[SuppressMessage("Microsoft.Design", "CA1044:PropertiesShouldNotBeWriteOnly",
|
||||
Justification = "Needs to be a property to be composed by MEF")]
|
||||
public CarrierInfoViewModel ViewModel
|
||||
{
|
||||
set
|
||||
{
|
||||
this.DataContext = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
```xml
|
||||
...
|
||||
<TextBlock Text="{Binding LabelPitchX}" />
|
||||
..
|
||||
```
|
||||
|
||||
5. Integration with Mitech view registration by updating the `ModuleViewNames.cs` related dictionary with `MitechLib.InfrastructureModules`
|
||||
```cs
|
||||
|
||||
|
||||
public static readonly Dictionary<string, string> DeviceInfoRegion = new Dictionary<string, string>
|
||||
{
|
||||
{"CassetteInfoView", "MitechLib.Modules.PackagePage.Views.CassetteInfoView"},
|
||||
{"VisionSettingView", "MitechLib.Modules.PackagePage.Views.VisionSettingView"},
|
||||
//
|
||||
{"CarrierInfoView", "MitechLib.Modules.PackagePage.Views.CarrierInfoView"}
|
||||
};
|
||||
|
||||
```
|
||||
Loading…
Reference in New Issue