WPF MVVM Mastering 2: Implement a login window

What we need to do a kind of thing? Directly on the map:

It looks simple, but to finish the login window, the entry of MVVM basically completed. (Why the login screen to choose the sex so strange? Simply because RadioButton Binding is a problem)

Many tutorials are a small example, people just getting started with the time do not know how to use in the project. I am here to speak briefly from the perspective of a development project.

First of all, the window is just one of many a project window. For simplicity, we put the project file as follows:

We created a new ViewModel folder, which is divided by file View folder, then each folder which contains the Model class and ViewModel classes. Meanwhile, there is a folder ViewModel Common folder, store some of the need to share ViewModel class. Of course, if readers have a better idea, absolutely no need to do it according to this model.

Project started, we do not hurry to write code, but look at what View which contains data. I have listed a table:

Chinese name	Types of	English name
username	string	UserName
password	string	Password
gender	int	Gender
Window initialization	View->ViewModel	WndInit
Event Log	View->ViewModel	LoginClick
Close behavior	ViewModel->View	ToClose
Open a new window	ViewModel->View	OpenWnd

The first three are obvious, the back four possible we do not think is a data. But in the MVVM pattern, narrow data, events, actions have become an element that can be bound, it can be said to be data.

We mentioned earlier, when the View and ViewModel change state, are broadcast in a similar way to do it. They do not pass objects, but only pass a name. So, in order to allow programmers and artists to act separately, in terms of naming, we should start fixed.

Now, we can begin to develop the Model layer. Model layer codes as follows:

namespace LoginDemo.ViewModel.Login
{
/// <summary>
/// login window Model
/// </summary>
public class LoginModel
{
/// <summary>
/// 用户名
/// </summary>
public string UserName { get; set; }

/// <summary>
/// 密码
/// </summary>
public string Password { get; set; }

/// <summary>
/// 性别
/// </summary>
public int Gender { get; set; }
}
}

Model层的代码就是这样，非常单纯，也没有什么新的知识。虽然我们后面会实现各种交互的逻辑，但Model层的代码已经不会改变了。