UIとUX
※他サイト参照
Model(共通)
class Employee
{
public string Name { get; set; }
public string Company { get; set; }
}
MVC
Controller
class HomeController : Controller
{
public ActionResult DisplayEmployee()
{
var model = new Employee
{
Name = "Andy",
Company = "Apple"
};
return View(model);
}
}
View
<h2>Employee</h2>
<fieldset>
<legend>Fields</legend>
<div class="display-label">Name</div>
<div class="display-field">
<%: Model.Name %>
</div>
<div class="display-label">Company</div>
<div class="display-field">
<%: Model.Company %>
</div>
</fieldset>
MVP
Presenter
interface IEmployeeView
{
string Name { get; set; }
string Company { get; set; }
}
class Presenter
{
private IEmployeeView view;
public Presenter(IEmployeeView view)
{
this.view = view;
}
public void Initialize()
{
var model = new Employee
{
Name = "Andy",
Company = "Apple"
};
this.UpdateViewFromModel(model);
}
private void UpdateViewFromModel(Employee e)
{
this.view.Name = e.Name;
this.view.Company = e.Company;
}
}
View
class View : IEmployeeView
{
private Presenter presenter;
public View()
{
this.presenter = new Presenter(this);
this.presenter.Initialize();
}
public string Name
{
get{ return this.txtName.Text; }
set{ this.txtName.Text = value; }
}
public string Company
{
get { return this.txtCompany.Text; }
set { this.txtCompany.Text = value; }
}
}
MVVM
ViewModel
class ViewModel : INotifyPropertyChanged
{
private string name;
private string company;
public ViewModel()
{
var model = new Employee
{
Name = "Andy",
Company = "Apple"
};
this.Name = model.Name;
this.Company = model.Company;
}
public event PropertyChangedEventHandler PropertyChanged;
public void OnPropertyChanged(string name)
{
var handler = this.PropertyChanged;
if (handler != null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs(name));
}
}
public string Name
{
get
{
return this.name;
}
set
{
if (this.name != value)
{
this.name = value;
this.OnPropertyChanged(name);
}
}
}
public string Company
{
// 省略
}
}
View
<Window.DataContext>
<vm:ViewModel />
</Window.DataContext>
<StackPanel Orientation="Vertical">
<TextBlock>Name :</TextBlock>
<TextBox Text="{Binding Path=Name, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<TextBlock>Company :</TextBlock>
<TextBox Text="{Binding Path=Company, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
</StackPanel>
ASP.NET vs ASP.NET MVC(他サイト参照)
グラフ表現一覧
※他サイトを参照