We Keep Coding

How to use MVVM with EF (with a pretty complex database in SQLite)?

I'm trying to have an MVVM architecture while Models are EF Models too.
In Code :
Model:
public class NotaireDBContext : DbContext
{
public DbSet<Paquet> Paquets { get; set; }
public DbSet<Personne> Personnes { get; set; }
public DbSet<Contrat> Contrats { get; set; }
protected override void OnConfiguring(DbContextOptionsBuilder options) => options.UseSqlite(#"Data Source=db/Notaire.db");
}
public class Paquet
{
public int PaquetId { get; set; }
public string Numero { get; set; }
public DateTime Date { get; set; }
public string Volume { get; set; }
public string Page { get; set; }
public string Etat { get; set; }
public List<Contrat> Contrats { get; } = new List<Contrat>();
}
public class Personne
{
public int PersonneId { get; set; }
public string Nom { get; set; }
public string Prenom { get; set; }
public string Nom_pere { get; set; }
public PieceIdentite Piece_identite { get; set; }
public string Num_piece { get; set; }
public string Lieu_naissance { get; set; }
public string Date_naissance { get; set; }
public string Commune { get; set; }
public string Numero_acte { get; set; }
public string Laiv_carte { get; set; } //??????????????
public string Adresse { get; set; }
public string Nationalite { get; set; }
public string Fonction { get; set; }
}
public class Contrat
{
public int ContratId { get; set; }
public string Numero { get; set; }
public DateTime Date { get; set; }
public List<Personne> Partie_1 { get; set; }
public List<Personne> Partie_2 { get; set; }
public int PaquetId { get; set; }
public Paquet Paquet { get; set; }
}
Views :
PaquetsView.xaml (this is a view of all paquets)
<ScrollViewer Background="#EBEEF5" HorizontalScrollBarVisibility="Disabled"
FlowDirection="RightToLeft">
<ItemsControl x:Name="PaquetsControl" Padding="4">
<ItemsControl.ItemContainerStyle>
<Style>
<Setter Property="FrameworkElement.Margin" Value="5"/>
</Style>
</ItemsControl.ItemContainerStyle>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<controls:PaquetControl/>
</DataTemplate>
</ItemsControl.ItemTemplate>
<!--<controls:PaquetControl/>
<controls:PaquetControl/>-->
</ItemsControl>
</ScrollViewer>
I bind it's ItemsSource like this in PaquetsView.xaml.cs :
public partial class PaquetsView : UserControl
{
private NotaireDBContext db = new NotaireDBContext();
public PaquetsView()
{
InitializeComponent();
PaquetsControl.ItemsSource = (from p in db.Paquets select p).ToList();
}
}
The DataTemplate of PaquetView.xaml -> ItemsControl stand in another xaml file (PaquetControl.xaml), which is a UserControl consisting of TextBlocks and Buttons with Menu (and menu item), that show the data held in on Paquet, and should be able to edit/delete said Paquet.
A portion of it :
...
<Button x:Name="MoreButton" Style="{DynamicResource MoreButtonTemplate}"
Grid.Column="2" Click="MoreButtonClicked" Margin="0,-4,-4,0">
<Button.ContextMenu>
<ContextMenu Background="White" FlowDirection="RightToLeft">
<MenuItem Header="Edit" Click="EditMenuItemClick"/>
<MenuItem Header="Archive" Click="ArchiveMenuItemClick"/>
<MenuItem Header="حذف" Click="DeleteMenuItemClick"/>
</ContextMenu>
</Button.ContextMenu>
</Button>
...
<TextBlock Grid.Column="0" Text="{Binding Path=Numero}" FontSize="22" Foreground="Black"/>
...
<TextBlock Grid.Row="1" Text="{Binding Path=Date, StringFormat=yyyy/MM/dd}"
Foreground="Black" FontSize="16"/>
...
<!--other TextBlock binded-->
Now I would like to know how can I make it CRUD with updates of the view.
Summarize, I have an SQLite DB (code first) for data persistence, I can get that data with DBContext, but now I'm seeing that it's better to use MVVM rather than create DBContext each time.

This is a very large topic and I doubt that it will fit the format adopted here.
Therefore, I will briefly outline only the main points.
It is customary to implement WPF using the MVVM pattern.
It is a strict 3-tier architecture: View (WPF) -> ViewModel -> Model.
The Model is responsible for working with "real" data - this is the so-called Business Logic.
View is responsible for creating the GUI.
The peculiarity of WPF is that the UI elements themselves request the data they need through the bindings.
Bindings are created (mostly) to the DataContext.
Therefore, it is necessary to put some special custom type there, which is responsible for the links between the View and the Model.
This type is called ViewModel.
In a typical implementation, the Model basically receives / returns data via methods.
And bindings need properties.
Therefore, one of the main functions of the ViewModel is to provide all the data necessary for the View in its properties.
When an application works with a database, it is customary in Sharpe to implement this in the Repository (Data) pattern.
From the MVVM point of view, such a Repository is part of the Model.
But, for a simpler understanding, to facilitate software maintenance, the Repository is usually implemented in a separate layer.
As a result, we get a four-tier architecture: View -> ViewModel -> Model -> Repository.
According to the rules and principles of OOP, SOLID in a layered architecture, each layer "knows" (has information) only about the underlying layer.
And all non-public information must be encapsulated inside the layer.
EF entities reflect database data, they are mutable, and can have corresponding attributes.
When changing the source, these types can change.
Let's say you, at some point, want to use a set of XML files instead of a database.
And they need entities of a different type.
Therefore, such entities are the internal implementation of the Repository.
And to exchange data with the Model, the Repository must be either Model types or generic DTO types.
At the next level, the ViewModel must also receive data from the Model.
But Model types cannot be used here, since they can be implicitly associated with Business Logic and there is a possibility of creating parasitic connections leading to unpredictable bugs.
At this level (ViewMode-> Model), exclusively DTO types are used for data exchange.
They are preferably immutable.
The next level of exchange of View with ViewModel.
First, the GUI often needs mutable properties. And to auto-update the property view, the type MUST implement INotifyPropertyChanged.
Secondly, to call actions from the GUI, the ViewModel must provide COMMANDS in its properties - this is the ICommand implementation.
For my answers here, I am using the BaseInpc and RelayCommand classes.
Thirdly, in types for View, additional properties are often needed to ensure the logic of the GUI operation: a selected element, an expanded element, instead of the Id of the record, an element reflecting it, etc.
For these reasons, at the ViewModel level, you already need your own types with an implementation other than DTO.
As a result of the above, we can get four different implementations for the type reflecting some record in the database.
The area of ​​use of each type will be in one or two layers.
In order not to get confused in all this, it is better to do each layer in a separate project.
Types used only within the layer are implemented in this project.
The types used by several layers (for example, DTO) are implemented in separate libraries (maybe for simple tasks and one common library).
To maintain abstraction, it is desirable to do all implementations through the preliminary declaration of interfaces.
And transfer information between layers through these interfaces.

Xamarin Forms MVVM with an actual model

I'm fairly new to Xamarin and stumbled across MVVM and really like it as an architectural pattern. However, I found that most HowTo's and tutorials out there only address the VVM (i.e. View-ViewModel) side of things, probably for simplicity sake!?
I would like to know how the communication between a ModelView and its associated models takes place using the INotifyPropertyChanged paradigm and other things.
If I understand correctly, I personally would put stuff like data handling, data storage (collections), db connections and stuff like that into a model. At least this is how I would've been doing it in the good old MVC days. Following questions arouse in my mind:
Where do I create the model(s) and how do I assign them to ViewModels?
How do I properly connect Model and ViewModel such that property updates are propagated and can be handled correctly?
Would you set the model as a member of the ViewModel?
In my current example, I would like to implement a SensorModel which provides several sensory data which layers above can subscribe to. I would like to send updates whenever new sensor data is available to the layers above; i.e. a ViewModel, for instance.
I'd basically had something like this in mind:
class Sensor
{
int _id { get; set; }
string _name { get; set; }
}
class SensorModel
{
private List<Sensor> _sensors { get; set; }
public void addSensor(Sensor s) ...
public void removeSensor(Sensor s) ...
}
Does anybody have links to actual/complete MVVM examples, including the connection between Model and ViewModel?
Any help appreciated.

Use Lastest stable Xamarin Forms
MODELS
In the Project, create a Models folder
To store data, i usually use SQLite or a temp store:
class DataStore
{
public static List<SensorModel> SensorStore { get; set; }
}
Create the SensorModel model
class SensorModel
{
internal int Id { get; set; }
internal string Sensor { get; set; }
}
VIEWMODELS
In the Project, create a ViewModels folder
Create a SensorVM viewmodel
class SensorVM : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public System.Windows.Input.ICommand StartCommand { get; set; }
public string SensorName { get; set; }
public SensorVM()
{
DataStore.SensorStore = new List<SensorModel>();
StartCommand = new Xamarin.Forms.Command(StartSubmit);
}
private void StartSubmit(object paramter)
{
var sensor = new SensorModel()
{
Id = 1,
Sensor = SensorName
};
AddSensor(sensor);
}
public void AddSensor(SensorModel sensor)
{
//do something
DataStore.SensorStore.Add(sensor);
}
}
VIEWS
In the Project, create a Views folder
Create a Sensor.xaml view
<ContentPage.Content>
<StackLayout Spacing="10" Orientation="Vertical">
<Entry Text="{Binding SensorName}" />
<Button Command="{Binding StartCommand}" Text="Start" />
</StackLayout>
</ContentPage.Content>
In the code behind:
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class Sensor : ContentPage
{
SensorVM vm;
public Sensor()
{
InitializeComponent();
BindingContext = vm = new SensorVM();
}
}
Hope that helps.

I would like to know how the communication between a ModelView and its
associated models takes place using the INotifyPropertyChanged
paradigm and other things.
I think the best way to create a communication in MVVM is Messaging Center.
https://learn.microsoft.com/pt-br/xamarin/xamarin-forms/app-fundamentals/messaging-center
It's not coupled from device (sensor) code to view models ...
Your messages, in this model, active events that could acess your viewmodels as well as other structures.
A sample of this
In your view use :
public void MessegingCenterInit()
{
#region Bluetooth
MessagingCenter.Subscribe<string, string>("App", "Status_name", (sender, arg) =>
{
App.PVM.Name = $"{arg}";//using INotifyPropertyChanged and view model
viewmodelMethod();//using only a viewmodel
});
#endregion
}
in your model use:
public string Name
{
get { return name; }
set
{
name = value;
App.PVM.Add_patient.AddCanExecuteChanged();//PVM is a viewmodel
//The view model need to have INotifyPropertyChanged as a interface
}
}
In specific code you have (into a generic method or event):
string new_name = John;
MessagingCenter.Send<string,string>("App","Status_name",new_name);
There are several ways to do it, its a simple one, you can try use objects as sender with less information.
Regards

Xamarin itself gives a really good example with their default Master-Detail Solution.
Just create a new Xamarin.Forms App and select the Master-Detail Layout.
It includes several Views, ViewModels (with the BaseVIewModel) and some MockUp Data Classes.
For a start just have a look around there :)

In almost all cases there is no communication between the Model and ViewModel, and very rarely there is communication between the Model and View. If you need to communicate between Model and ViewModel it is extremely likely that you are doing something wrong.
To explain, your model usually describes some entity, like that you have the class Cat:
public class Cat
{
public string Color {get; set;}
}
It is generally used in ViewModel either as the field or as a Collection like:
public class CatsViewModel
{
public List<Cat> Cats {get; set;}
}
The cat shouldn't be able to update by itself, if it is updated it is done either by bindings with the view or somewhere from ViewModel.
So you have some architectural problems in your app, I think.

Databinding with unnamed textboxes and listbox

I have been taught lately when using WPF and databinding it is good practice to not name any of the fields but only to associate them with the properties in the other classes. My problem right now is how do I add the data from 3 textboxes (the user enters), save the binded information to the model which then posts the account information into the listbox on the side. I need to add the data to my model. My code from main.xaml is below:
<ListBox ItemsSource="{Binding Path=Files}" SelectedItem="{BindingPath=CurrentItem}" />
<TextBox Text="{Binding Path=bankaccount}"/>
<TextBox Text="{Binding Path=accountnumber}"/>
<TextBox Text="{Binding Path=accounttype}"/>
<Button Content="Save Data To Listbox" Click="Save_Click"/>
Now I will show my FileModel class which holds all of my properties which will be from the textboxes
private short _BankAccount;
private long _AccountNumber;
private char _AccountType;
public short bankaccount{ get { return _BankAccount;} set {_BankAccount= value; Notify("bankaccount"); } }
public long accountnumber{ get { return _AccountNumber;} set {_AccountNumber= value; Notify("accountnumber"); } }
public char accounttype{ get { return _AccountType;} set{_AccountType= value; Notify("accounttype"); } }
I use a class called ProgramModel As my middle point between the Mainpage and my FileModel page and here is that code:
public class ProgramModel : INotifyPropertyChanged
{
public ObservableCollection<FileModel> Files { get; set; }
private FileModel _currentItem;
public FileModel CurrentItem { get { return _currentItem; } set { _currentItem = value; Notify("CurrentItem"); } }
public ProgramModel()
{
Files = new ObservableCollection<FileModel>();
}
And to finish it off I have my mainpage:
internal partial class MainWindow
{
public ProgramModel Model { get; set; }
private ViewSettings _viewSettings = new ViewSettings();
public MainWindow()
{
InitializeComponent();
this.DataContext = Model = new ProgramModel();
}
private void Save_Click(object sender, RoutedEventArgs e)
{
FileModel filemodel = new FileModel();
Model.Files.Add(new FileModel( filemodel.bankaccount, filemodel.accountnumber, filemodel.accounttype));
}
I feel like I am adding to the Files Collection incorrectly from the save button event. If you guys can help me out that would be great! All 3 textboxes and the listbox are on the Main page. Let me know if you have any questions. Also, this is a learning experience so let me know if I posted too much code or not enough. Thanks!

You read the values from a new FileModel instance instead of from what is bound to the view. Code should be this:
Model.Files.Add(new FileModel
(
Model.CurrentItem.bankaccount,
Model.CurrentItem.accountnumber,
Model.CurrentItem.accounttype
));
Make sure CurrentItem is actually initialized with an instance, don't see that in your code. Also, you could use a command here and have all the relevant logic in your bound view model without the need for the event.
Also, right now you bind the current item to the selected item in the ListBox, this will modify an existing instance instead. Not sure if this is intended. If you want those fields to be for input of new instances don't bind the ListBox to it.

I'm not going to answer your question directly because implementing proper data binding will take a bit of code to do so.
Using proper data binding, it is possible to have almost no code behind on your view.cs! (Specially if you start using frameworks)
Please take a look on A Simple MVVM Example for you to follow good practice.
By following this example, you will see that you can also use data binding on buttons and other controls.
Your View Model which is ProgramModel : INotifyPropertyChanged should handle all the work (data processing).
Your model should not handle the UI update notifications thus,
public short bankaccount{ get { return _BankAccount;} set {_BankAccount= value; Notify("bankaccount"); } }
will be moved to the ProgramModel (View Model).
Save_Click method will also be converted into an ICommand and be binded to the button in view like <Button Content="Save Data To Listbox" Command="{Binding SaveExec}"/>
The point is, if you are studying data binding, you should implement it right. Hope you understand...
In the end, it is possible for your Main.cs to only be..
internal partial class MainWindow
{
public MainWindow()
{
InitializeComponent();
this.DataContext = new ProgramModel();
}
}

Just a small change and it should work . Change Your bindings as shown below for the TextBoxes.
<TextBox Text="{Binding Path=CurrentItem.bankaccount}"/>
<TextBox Text="{Binding Path=CurrentItem.accountnumber}"/>
<TextBox Text="{Binding Path=CurrentItem.accounttype}"/>

How to bind data from View to UserControl with SoapBox

I have my SoapBox.Document 'Register'
[Export(SoapBox.Core.ExtensionPoints.Workbench.Documents, typeof(IDocument))]
[Export(CompositionPoints.Workbench.Documents.Register, typeof(Register))]
[Document(Name = DOC_NAME)]
class Register : AbstractDocument
{
public Receipt actualReceipt;
private const string DOC_NAME = "Register";
public Register()
{
Name = DOC_NAME;
Title = "Recipe Document Title";
SomeProperty = "Hello from the recipe document!";
}
}
In this Document I want to user UserControls witch are kind of a own "View"
Like a ListView for all ReceiptPositions
So now I got my Model Receipt and ReceiptPosition
Model Receipt
class Receipt
{
public int Id { get; set; }
public string Receiptnumber { get; set; }
public IList<ReceiptPositions> ReceiptPositions { get; set; }
and Model ReceiptPosition
class ReceiptPosition
{
public int Id { get; set; }
//public Receipt Receipt { get; set; } using for Database
public int Position { get; set; }
public string Article { get; set; }
}
So now I want to add a UserControl witch displays a List of all articles in ReceiptPositions.
But how do I bind the data so that when a new ReceiptPosition gets added to the IList in Receipt the UserControl get 'refreshed' automatically?
Here is a visual example of whatI need..
Host with Data and two PLugins wich each show the same Data but in a different way.

You can use an ItemsControl for this purpose.
xaml:
<ItemsControl ItemsSource="{Binding MyReceipt.ReceiptPositions}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<!-- Where you put your view -->
<TextBox Text="{Binding Article}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<!-- Can be whatever Panel type you want -->
<StackPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
cs:
private Receipt _myReceipt;
public Receipt MyReceipt { get { return _myReceipt; } set { _myReceipt = value; OnPropertyChanged("MyReceipt"); } }
public MainWindow()
{
InitializeComponent();
DataContext = this;
MyReceipt = new Receipt { ReceiptPositions = new ObservableCollection<ReceiptPosition>() };
MyReceipt.ReceiptPositions.Add(new ReceiptPosition { Article = "Foo" });
MyReceipt.ReceiptPositions.Add(new ReceiptPosition { Article = "Bar" });
MyReceipt.ReceiptPositions.Add(new ReceiptPosition { Article = "Baz" });
MyReceipt.ReceiptPositions[0].Article = "Frabazamataz";
}
Explanation:
The ItemsControl allows you to bind a list to its ItemsSource Property to use as the DataContext to each view created by the DataTemplate.
The Observable Collection gives PropertyChange notifications automatically with each item added, removed, or changed.
This allows you to have a very flexible list of items based solely on your data.

Death's answer is correct, i.e. you use DataTemplates. If your views and data templates are in a MEF plugin then you need to import both the plugins and the data templates that map the view models to the views. In the other question you posted about this it was obvious that you're trying to export your plugin user controls...personally I think this is a bit misguided. If your main application is using MVVM then your plugins should as well. In this case your plugins should export an IPlugin class and also specify a DataTemplate that maps it to a view. As I indicated on the other page, the data template must be imported as well so that you can add it to the global resources.
I've created a project that shows this in action using the classes you provided in your uother question, you can download it here. The main points to look at are the data templates in the plugin project and the two places where things are imported in the main project.
Note that in my demo I'm requiring each plugin to explicitly specify a DataTemplate for its view and view model, but you may not want to do this so I've also added a chunk of commented-out code at the bottom of App.xaml.cs that shows how to avoid that (to make it work I had to add the view type to the IPlugData class, but that's only needed for this one example). If you choose to create the DataTemplates manually then the plugins don't need to specify the data templates and they also don't need the custom ResourceDictionary that holds them.
If you have an questions feel free to post back here in the comments.

Binding on Elements of an ObservableCollection only change when Page is reloaded

I am programming a Windows 8.1 App using C#/XAML as well as the MVVM-Light Toolkit.
In my program there is a Schedule that consists of 3 components:
a GridView with 5 elements for Monday, Tuesday, ....
a ListView with x elements each showing the start- and end-time of
the current period. x depends on the number of period the user chose
for his schedule to have.
a GridView with 5*x elements that represent the places for the events
set by the user.
These 3 components are again inside a FlipView to enable multiple Schedules.
I enabled this in code via the following objects:
public class Schedule
{
public int WeekNumber { get; set; }
public ScheduleComponentSettings ScheduleComponentSettings { get; set; }
public ScheduleComponents ScheduleComponents { get; set; }
}
public class ScheduleComponents
{
public ObservableCollection<WeekDay> WeekDayItems { get; set; }
public ObservableCollection<FreePeriod> FreePeriodItems { get; set; }
public ObservableCollection<PeriodTime> PeriodTimesItems { get; set; }
public ObservableCollection<LessonTime> LessonTimesItems { get; set; }
}
In my ViewModel I have an ObservableCollection of the Schedule class:
public ObservableCollection<Schedule> ScheduleComponentsList
{
get
{
return _ScheduleComponentsList;
}
set
{
if (_ScheduleComponentsList == value)
{
return;
}
RaisePropertyChanging(ScheduleWeekListPropertyName);
_ScheduleComponentsList = value;
RaisePropertyChanged(ScheduleWeekListPropertyName);
}
}
The FlipView and its elements bind to that as follows (this is ofc. shortened to show only the ItemsSources):
<FlipView
ItemsSource="{Binding Main.ScheduleComponentsList, Source={StaticResource Locator}}"
<FlipView.ItemTemplate>
<DataTemplate>
<GridView
ItemsSource="{Binding ScheduleComponents.WeekDayItems}"/>
<ListView
ItemsSource="{Binding ScheduleComponents.PeriodTimesItems}"/>
<GridView
ItemsSource="{Binding ScheduleComponents.FreePeriodItems}"/>
</DataTemplate>
</FlipView.ItemTemplate>
</FlipView>
Now here is the problem:
When I change a property on an element inside the FreePeriodItems or even when I replace the collection completely, the View only updates when I reload the entire Page. Same for all the other properties I update in one on the ScheduleComponents.
This does not occur however when I change the ScheduleComponentList itself. When I add items to it for example they are automatically being updated in the view.
Now I am sitting on the problem for ages now.

This does not occur however when I change the ScheduleComponentList itself. When I add items to it for example they are automatically being updated in the view.
That's exactly how ObservableCollection<T> works. It raises events only when the list itself changes, when you add or remove elements:
Represents a dynamic data collection that provides notifications when items get added, removed, or when the whole list is refreshed.
from ObservableCollection Class
To make it work implement INotifyPropertyChanged on your WeekDay, FreePeriod, PeriodTime and LessonTime. When it's done you'll get event not only when collection changes but also when any of the items that already are part of collection is modified.