WPF入門教程系列二十四——DataGrid使用示例(1)

DotNet菜園發表於2023-05-14

WPF入門教程系列二——Application介紹

WPF入門教程系列三——Application介紹(續)

WPF入門教程系列四——Dispatcher介紹

WPF入門教程系列五——Window 介紹

WPF入門教程系列十一——依賴屬性（一）

WPF入門教程系列十五——WPF中的資料繫結(一)

 

        WPF技術的主要特點是資料驅動UI，所以在使用WPF技術開發的過程中是以資料為核心的，WPF提供了資料繫結機制，當資料發生變化時，WPF會自動發出通知去更新UI。

       今天我們來學習.NET 7中的WPF裡面的DataGrid的有關知識。資料表格DataGrid是一個使用非常廣泛的控制元件，不管是在Asp.Net中的網頁開發還是WinForm(WPF)應用程式開發都會頻繁使用。透過資料表格DataGrid可以靈活、方便、有效的顯示各種資料。自己翻看之前寫的DataGrid的示例，這個示例寫的有些簡單，沒有使用Command指令，沒有使用MVVM模式，現在看來有些欠缺。準備將這個DataGrid示例進行完善一下，並在示例中應用Command指令與MVVM模式。

       WPF控制元件DataGrid 提供了一種靈活的方法，用於在行和列中顯示資料集合。 DataGrid包括用於託管自定義內容的內建列型別和模板列。內建行型別包括一個下拉詳細資訊部分，可用於在單元格值下方顯示其他內容。

一、建立專案

1. 在Visual Studio 2022啟動介面中選擇“建立新專案”，如下圖。

 

2. Visual Studio 2022彈出的“建立新專案”的對話方塊中做如下選擇。如下圖。

  • 在最左邊的下拉框中，選擇 “C# ，如下圖中1處
  • 在中間的下拉框中，選擇 “所有平臺”，如下圖2處。
  • 在最右邊的下拉框中，選擇“桌面”，如下圖3處。
  • 在下圖中4處，選擇“WPF應用程式”模板，點選“下一步”按鈕。

    

4.在彈出的“配置新專案”的對話方塊中，如下圖，在“專案名稱”輸入框中，輸入“WpfGridDemo.NET7”。然後使用滑鼠點選“下一步”按鈕。

 

5. 在彈出的“其他資訊”的對話方塊，如下圖。在“框架”下拉框中，選擇“NET 7.0(標準期限支援)”。其他值選擇預設值即可。然後使用滑鼠點選“建立”按鈕。

 

二、建立實體

       首先進行準備工作，先建立實體，我們使用的是省市縣區的示例資料，這個資料網上比較豐富，可以方便找到。

1. 在Visual Studio 2022的“解決方案資源管理器”中，使用滑鼠右鍵單擊“WpfGridDemo.NET7”專案，在彈出選單中選擇“新增-->新建資料夾”。如下圖。

 

2. 在Visual Studio 2022的“解決方案資源管理器”中，將“新資料夾”改名為 “Entitys”，然後使用滑鼠右鍵單擊“Entitys”資料夾，在彈出選單中選擇“新增--> 類”。 在“新增新項”對話方塊中將類命名為 Area，然後選擇“新增”。

3. 在Visual Studio 2022的“解決方案資源管理器”中，使用滑鼠雙擊開啟剛才建立的Area.cs檔案，新增如下程式碼：

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
 
namespace WpfGridDemo.NET7.Entitys
{
    public class Area
    {
        public int Id { get; set; }

        [StringLength(10)]
        public string Code { get; set; }     

        [StringLength(30)]
       public string Name { get; set; }

 
        [StringLength(10)]

        public string CityCode { get; set; }
        public DateTime Created { get; set; }
        public DateTime Updated { get; set; }

    }
}

 

 4.重得執行第2，3步，在Visual Studio 2022建立City與Province類，這兩個類的程式碼如下：

 

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
 
namespace WpfGridDemo.NET7.Entitys
{
    public class City
    {
        public int Id { get; set; }
        [StringLength(10)]
        public string Code { get; set; }
 
        [StringLength(30)]
        public string Name { get; set; }
 
        [StringLength(10)]
        public string ProvinceCode { get; set; }
    }
}
 


 

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
 
namespace WpfGridDemo.NET7.Entitys
{
    public class Province
    {
        public int Id { get; set; }
        [StringLength(10)]
        public string Code { get; set; }
 
        [StringLength(30)]
        public string Name { get; set; }

    }

}

5  使用NuGet下載最新版的Entity Framework Core 7。在解決方案資源管理器中——>在專案WpfGridDemo.NET7中的依賴項上滑鼠右鍵單擊——>彈出一個選單，選中“管理NuGet程式包”，如下圖。

 

6. 在開啟的NuGet包管理介面的中選擇“瀏覽”標籤頁，在搜尋框中輸入“Entity”，找到最新版本Entity Framework Core,點選安裝。如下圖。

 7.  Visual Studio 2022 開始安裝 EntityFrameworkCore 7.0.3，會彈出安裝確認介面，點選“OK”按鈕。如下圖。

Microsoft.EntityFrameworkCore

Microsoft.EntityFrameworkCore.SqlServer

8.安裝完成之後，如下圖。

9. 在Visual Studio 2022的解決方案資源管理器中，使用滑鼠右鍵點選“WpfGridDemo.NET7”專案，在彈出選單中選擇“新增-->類”，在彈出的“新增新項”對話方塊中，選擇新增 “GridDbContext”類，並在中定義實體對應的DbSet，以應用Code First 資料遷移。新增以下程式碼

using Microsoft.EntityFrameworkCore;
using System.Collections.Generic;
using System.Data;
using System.Reflection;
using WpfGridDemo.NET7.Entitys;

 
namespace WpfGridDemo.NET7
{
    public class GridDbContext : DbContext
    {
        public GridDbContext(DbContextOptions<GridDbContext> options)
 
               : base(options)
        {
 
        }

        public DbSet<Area> Area { get; set; }
        public DbSet<City> City { get; set; }
        public DbSet<Province> Province { get; set; }
 
    }
}

10.在Visual Studio 2017中的資源管理器中找到appsettings.json檔案，用滑鼠雙擊開啟，在檔案中新增一個連線字串,程式碼如下。

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
    <appSettings>
        <add></add>
    </appSettings>
    <connectionStrings>

        <add name="GridDbContext" connectionString="Server=.;Database=EFCoreDemo;Trusted_Connection=True;
Encrypt=False;TrustServerCertificate=True;MultipleActiveResultSets=true" />

    </connectionStrings>
</configuration>
11.從Visual Studio 2022的選單中選擇“工具->NuGet包管理器器—>程式包管理器控制檯”選單。

  12. 在PMC中，預設專案選擇EntityframeworkCore對應的專案後。輸入以下命令：Add-Migration AddEntityCitys，建立遷移。

  13. 在上面的命令執行完畢之後，建立成功後，會在Migrations資料夾下建立時間_AddEntityCitys格式的類檔案，這些程式碼是基於DbContext指定的模型。

  14.在程式包管理器控制檯，輸入Update-Database，回車執行遷移。執行成功後，以上三個步驟，我在前面的文章中已經多次寫過了，這裡就簡單寫一下。

 15. 在SQL Server Management Studio中檢視資料庫，Province、Area、City三個表建立成功。至於具體的資料，請在網上查詢。

 

 

 

相關文章