展示模型

範例：執行範例 (檢視參考 PM) (C#)

以下是使用 表示模型 以 C# 開發的 執行範例 版本。

圖 3：專輯視窗。

我將從網域模型向外討論基本配置。由於網域不是此範例的重點，因此它非常無趣。它基本上只是一個資料集，其中一個單一表格保存專輯的資料。以下是設定幾個測試專輯的程式碼。我正在使用強類型資料集。

public static DsAlbum AlbumDataSet() {
  DsAlbum result = new DsAlbum();
  result.Albums.AddAlbumsRow(1, "HQ", "Roy Harper", false, null);
  result.Albums.AddAlbumsRow(2, "The Rough Dancer and Cyclical Night", "Astor Piazzola", false, null);
  result.Albums.AddAlbumsRow(3, "The Black Light", "Calexico", false, null);
  result.Albums.AddAlbumsRow(4, "Symphony No.5", "CBSO", true, "Sibelius" );
  result.AcceptChanges();
  return result;
}

表示模型 包裝此資料集，並提供屬性來取得資料。整個表格有一個 表示模型 的單一執行個體，對應於視窗的單一執行個體。表示模型 有資料集的欄位，而且也會追蹤目前選取的專輯。

class PmodAlbum...

  public PmodAlbum(DsAlbum albums) {
    this._data = albums; 
    _selectedAlbumNumber = 0;
  }
  private DsAlbum _data;
  private int _selectedAlbumNumber;

PmodAlbum 提供屬性來取得資料集中的資料。基本上，我提供每個表單需要顯示的資訊位元一個屬性。對於那些直接從資料集中提取的值，此屬性非常簡單。

class PmodAlbum...

  public String Title {
    get {return SelectedAlbum.Title;}
    set {SelectedAlbum.Title = value;}
  }
  public String Artist {
    get {return SelectedAlbum.Artist;}
    set {SelectedAlbum.Artist = value;}     
  }
  public bool IsClassical {
    get {return SelectedAlbum.IsClassical;}
    set {SelectedAlbum.IsClassical = value;}            
  }
  public String Composer {
    get {
      return (SelectedAlbum.IsComposerNull()) ? "" : SelectedAlbum.Composer;
    }
    set {
      if (IsClassical) SelectedAlbum.Composer = value;
    }                 
  }
  public DsAlbum.AlbumsRow SelectedAlbum {
    get {return Data.Albums[SelectedAlbumNumber];}
  }

視窗的標題是根據專輯標題。我透過另一個屬性提供此標題。

class PmodAlbum...

  public String FormTitle 
  {
    get {return "Album: " + Title;}
  }

我有一個屬性，用於查看是否應該啟用作曲者欄位。

class PmodAlbum...

  public bool IsComposerFieldEnabled {
    get {return IsClassical;}
  }

這只是一個呼叫 public IsClassical 屬性的呼叫。您可能會想知道為什麼表單不直接呼叫它 - 但這是 表示模型 提供的封裝的精髓。PmodAlbum 決定啟用該欄位的邏輯，這個事實僅基於一個屬性，表示模型 知道它，但檢視不知道。

僅當資料已變更時，套用與取消按鈕才應啟用。由於資料集會記錄此資訊，我可以透過檢查該資料集列的狀態來提供此資訊。

class PmodAlbum...

  public bool IsApplyEnabled {
    get {return HasRowChanged;}
  }
  public bool IsCancelEnabled {
    get {return HasRowChanged;}
  }
  public bool HasRowChanged {
    get {return SelectedAlbum.RowState == DataRowState.Modified;}
  }

檢視中的清單方塊會顯示專輯標題清單。PmodAlbum 會提供此清單。

class PmodAlbum...

  public String[] AlbumList {
    get {
      String[] result = new String[Data.Albums.Rows.Count];
      for (int i = 0; i < result.Length; i++)
        result[i] = Data.Albums[i].Title;
      return result;
    }
  }

因此，這涵蓋了 PmodAlbum 呈現給檢視的介面。接下來，我將探討如何在檢視與簡報模型之間進行同步。我已將同步方法放入檢視中，並使用粗略同步。首先，我有一個方法，可將檢視的狀態推入簡報模型中。

class FrmAlbum...

  private void SaveToPmod() {
    model.Artist = txtArtist.Text;
    model.Title = txtTitle.Text;
    model.IsClassical = chkClassical.Checked;
    model.Composer = txtComposer.Text;
  }

此方法非常簡單，只需將檢視的可變部分指定給簡報模型即可。載入方法稍微複雜一些。

class FrmAlbum...

  private void LoadFromPmod() {
    if (NotLoadingView) {
      _isLoadingView = true;
      lstAlbums.DataSource = model.AlbumList;
      lstAlbums.SelectedIndex = model.SelectedAlbumNumber;
      txtArtist.Text = model.Artist;
      txtTitle.Text = model.Title;
      this.Text = model.FormTitle;
      chkClassical.Checked = model.IsClassical;
      txtComposer.Enabled = model.IsComposerFieldEnabled;
      txtComposer.Text = model.Composer;
      btnApply.Enabled = model.IsApplyEnabled;
      btnCancel.Enabled = model.IsCancelEnabled;
      _isLoadingView = false;
    }
  }
  private bool _isLoadingView = false;
  private bool NotLoadingView {
    get {return !_isLoadingView;}
  }

private void SyncWithPmod() {
  if (NotLoadingView) {
    SaveToPmod();
    LoadFromPmod();
  }
}

此處的複雜性在於避免無限遞迴，因為同步會導致表單上的欄位更新，而這會觸發同步.... 我會使用旗標來防範此情況。

有了這些同步方法，下一步只需在控制項的事件處理常式中呼叫正確的同步位元即可。大部分時間都很容易，只要在資料變更時呼叫 SyncWithPmod 即可。

class FrmAlbum...

  private void txtTitle_TextChanged(object sender, System.EventArgs e){
    SyncWithPmod();
  }

有些案例比較複雜。當使用者按一下清單中的新項目時，我們需要導覽至新的專輯並顯示其資料。

class FrmAlbum...

  private void lstAlbums_SelectedIndexChanged(object sender, System.EventArgs e){
    if (NotLoadingView) {
      model.SelectedAlbumNumber = lstAlbums.SelectedIndex;  
      LoadFromPmod();
    }
  }

class PmodAlbum...

  public int SelectedAlbumNumber {
    get {return _selectedAlbumNumber;}
    set {
      if (_selectedAlbumNumber != value) {
        Cancel();
        _selectedAlbumNumber = value;
      }
    }
  }

請注意，如果您按一下清單，此方法會放棄所有變更。我已執行此種糟糕的可用性，以維持範例的簡潔性，表單至少應彈出確認方塊，以避免遺失變更。

套用與取消按鈕會委派要對簡報模型執行的動作。

class FrmAlbum...

  private void btnApply_Click(object sender, System.EventArgs e)    {
    model.Apply();
    LoadFromPmod();
  }
  private void btnCancel_Click(object sender, System.EventArgs e){
    model.Cancel();
    LoadFromPmod();
  }

class PmodAlbum...

  public void Apply ()    {
    SelectedAlbum.AcceptChanges();
  }
  public void Cancel() {
    SelectedAlbum.RejectChanges();
  }

因此，儘管我可以將大部分行為移至簡報模型，但檢視仍保留一些智慧。為了讓簡報模型的測試面向發揮更好的作用，最好能移轉更多內容。您當然可以透過將同步邏輯移至其中，將更多內容移至簡報模型，但代價是讓簡報模型更了解檢視。

範例：資料繫結表格範例 (C#)

當我第一次在 .NET 架構中檢視 表示模型 時，資料繫結似乎提供了絕佳的技術，讓 表示模型 能夠輕易運作。到目前為止，資料繫結的現行版本中的限制，阻礙了它進入我確信它最終會進入的地方。資料繫結可以發揮極佳作用的一個領域是唯讀資料，因此以下是一個範例，說明這一點，以及表格如何能融入 表示模型 設計。

圖 4：專輯清單，其中搖滾專輯以玉米色標示。

這只是一個專輯清單。額外的行為是，每張搖滾專輯的列都應該以玉米色標示。

我使用與其他範例略為不同的資料集。以下是某些測試資料的程式碼。

public static AlbumList AlbumGridDataSet() 
{
  AlbumList result = new AlbumList();
  result.Albums.AddAlbumsRow(1, "HQ", "Roy Harper", "Rock");
  result.Albums.AddAlbumsRow(2, "Lemonade and Buns", "Kila", "Celtic");
  result.Albums.AddAlbumsRow(3, "Stormcock", "Roy Harper", "Rock");
  result.Albums.AddAlbumsRow(4, "Zero Hour", "Astor Piazzola", "Tango");
  result.Albums.AddAlbumsRow(5, "The Rough Dancer and Cyclical Night", "Astor Piazzola", "Tango");
  result.Albums.AddAlbumsRow(6, "The Black Light", "Calexico", "Rock");
  result.Albums.AddAlbumsRow(7, "Spoke", "Calexico", "Rock");
  result.Albums.AddAlbumsRow(8, "Electrica", "Daniela Mercury", "Brazil");
  result.Albums.AddAlbumsRow(9, "Feijao com Arroz", "Daniela Mercury", "Brazil");     
  result.Albums.AddAlbumsRow(10, "Sol da Libertade", "Daniela Mercury", "Brazil");  
  Console.WriteLine(result);
  return result;
}

在這個案例中，表示模型會將其內部資料集顯示為一個屬性。這允許表單直接將資料繫結到資料集中的儲存格。

private AlbumList _dsAlbums;
internal AlbumList DsAlbums {
  get {return _dsAlbums;}
}

為了支援標示，表示模型提供了額外的索引方法，用於進入表格。

internal Color RowColor(int row) {
  return (Albums[row].genre.Equals("Rock")) ? Color.Cornsilk : Color.White;
}
private AlbumList.AlbumsDataTable Albums {
  get {return DsAlbums.Albums;}
}

這個方法類似於簡單範例中的方法，不同之處在於表格資料上的方法需要儲存格座標才能挑選出表格的各個部分。在這個案例中，我們只需要列號碼，但一般來說，我們可能需要列號碼和欄號碼。

從這裡開始，我可以使用 Visual Studio 附帶的標準資料繫結功能。我可以輕鬆地將表格儲存格繫結到資料集中的資料，以及繫結到 表示模型 上的資料。

讓顏色運作起來需要多一點步驟。這有點偏離範例的主旨，但整個事情變得複雜，是因為標準的 WinForms 表格控制項無法逐行反白顯示。一般來說，解決這個需求的方法是購買第三方控制項，但我太小氣了，不想這麼做。所以，對於好奇的人來說，以下是我的做法（這個點子大部分都是從 http://www.syncfusion.com/FAQ/WinForms/ 剽竊來的）。從現在開始，我假設你已經熟悉 WinForms 的內部結構。

基本上，我建立了一個 DataGridTextBoxColumn 的子類別，其中新增了顏色反白顯示的行為。你可以傳入一個處理行為的委派，來連結新的行為。

類別 ColorableDataGridTextBoxColumn...

  public ColorableDataGridTextBoxColumn (ColorGetter getcolorRowCol, DataGridTextBoxColumn original)
  {
    _delGetColor = getcolorRowCol;
    copyFrom(original);
  }
  public delegate Color ColorGetter(int row);
  private ColorGetter _delGetColor;

建構函式會採用原始的 DataGridTextBoxColumn 以及委派。我真正想做的是使用裝飾器模式來包裝原始的，但原始的，就像 WinForms 中的許多類別一樣，都是密封的。因此，我將原始類別的所有屬性複製到我的子類別中。如果有一些重要的屬性無法複製，因為你無法讀取或寫入它們，這個方法就不會奏效。目前看來，它似乎可以正常運作。

類別 ColorableDataGridTextBoxColumn...

  void copyFrom (DataGridTextBoxColumn original) {
    PropertyInfo[] props = original.GetType().GetProperties();
    foreach (PropertyInfo p in props) {
      if (p.CanWrite && p.CanRead)
        p.SetValue(this, p.GetValue(original, null), null) ;
    }
  }

幸運的是，繪製方法是虛擬的（否則我需要一個全新的資料格）。我可以使用委派來插入適當的背景顏色。

類別 ColorableDataGridTextBoxColumn...

  protected override void Paint(System.Drawing.Graphics g, System.Drawing.Rectangle bounds, 
    System.Windows.Forms.CurrencyManager source, int rowNum, 
    System.Drawing.Brush backBrush, System.Drawing.Brush foreBrush, 
    bool alignToRight)
  {
    base.Paint(g, bounds, source, rowNum, new SolidBrush(_delGetColor(rowNum)), foreBrush, alignToRight);
  }

為了放置這個新表格，我在表單上建立控制項後，在頁面載入中取代資料表的欄。

類別 FrmAlbums...

  private void FrmAlbums_Load(object sender, System.EventArgs e){
    bindData();
    replaceColumnStyles();
  }
  private void replaceColumnStyles() {
    ColorableDataGridTextBoxColumn.ReplaceColumnStyles(dgsAlbums, 
      new ColorableDataGridTextBoxColumn.ColorGetter(model.RowColor));
  }

類別 ColorableDataGridTextBoxColumn...

  public static void ReplaceColumnStyles(DataGridTableStyle grid, ColorGetter del) {
    for (int i = 0; i < grid.GridColumnStyles.Count; i++) {
      DataGridTextBoxColumn old = (DataGridTextBoxColumn) grid.GridColumnStyles[0];
      grid.GridColumnStyles.RemoveAt(0);
      grid.GridColumnStyles.Add(new ColorableDataGridTextBoxColumn(del, old));
    }
  }

它可以運作，但我承認它比我想要的還要混亂許多。如果我真正要這麼做，我會想要尋找第三方控制項。然而，我已經在生產系統中看過這種做法，而且運作得很好。