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

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

?文章來源地址http://www.zghlxwxcb.cn/news/detail-452987.html

三、DataGrid列的類型

???? 默認情況下，當(dāng)我們?yōu)镈ataGrid 控件設(shè)置ItemSource 屬性后，DataGrid 會根據(jù)數(shù)據(jù)類型自動生成相應(yīng)的列，數(shù)據(jù)表格中的每一行都綁定到數(shù)據(jù)源中的一個對象，數(shù)據(jù)表格中的每一列都綁定到數(shù)據(jù)對象的屬性。如果想要實現(xiàn)用戶界面中的DataGrid數(shù)據(jù)隨著數(shù)據(jù)源中添加或刪除數(shù)據(jù)時自動更新，DataGrid的綁定數(shù)據(jù)源必須實現(xiàn)接口INotifyCollectionChanged，例如 ObservableCollection<T>。

??????????? WPF推出也有十多年了，WPF中的DataGrid的列的類型還是四種。如下面表格中列出了DataGrid 支持的四種列及其數(shù)據(jù)類型。

?

???????? 在創(chuàng)建DataGrid 時可以通過AutoGenerateColumns 屬性設(shè)置列是否自動生成，從而加入自定義列。

???????? 自動生成列時，可以通過在AutoGeneratingColumn事件中進行處理，決定是否在將列添加到DataGrid之前自定義或取消列。 如果將用戶定義的列和自動生成的列同時添加到，DataGrid則首先添加用戶定義的列。若要重新排列列的顯示順序，可以設(shè)置 DisplayIndex 單個列的屬性。

??????? DataGridTemplateColumn如果內(nèi)置列類型不能滿足你的需求，請使用DataGridTemplateColumn來定義自定義列。DataGridTemplateColumn 提供 CellTemplate 和 CellEditingTemplate 屬性，使你可以為顯示模式和編輯模式指定內(nèi)容模板。 例如，可以為日期定義自定義列。 可以 CellTemplate 定義 TextBlock 以顯示日期，而 CellEditingTemplate 可以定義用于 DatePicker 編輯日期的控件。

????? 可以使用 Columns 集合在運行時以編程方式添加、插入、刪除和更改控件中的任何列。 IsAutoGenerated檢查 屬性以確定列是自動生成的還是用戶定義的。 更改時，將自動添加、刪除或重新生成自動生成的 ItemsSource 列。

?????? 如果DataGrid 中同時包含“自動生成列”與“用戶自定義列”，則首先創(chuàng)建“用戶自定義列”。

? ? ? 接下來通過做一個實際的應(yīng)用示例，使用省市縣區(qū)這個能非常方便找到的數(shù)據(jù)，做為示例數(shù)據(jù)庫的數(shù)據(jù)，來學(xué)習(xí)如何使用DataGrid。

四、DataGrid示例

1．在Visual Studio 2022中打開MainWindows文件，創(chuàng)建一個Grid樣式。如下圖。

?

??? 2． 在Visual studio 2022中的工具箱中，找到DataGrid控件，然后雙擊。把DataGrid控件添加窗體界面中。并設(shè)置DataGrid控件的位置是在Grid中的第二行，如下圖。

?

???? 3．DataGrid添加列的方式一。在Visual Studio 2022中打開MainWindow.xmal文件。先鼠標(biāo)左鍵選中，窗體界面中的DataGrid，然后單擊鼠標(biāo)右鍵，在彈出菜單中選擇“添加列”快捷菜單。如下圖。

?

????? 4.DataGrid添加列方式二。在Visual Studio 2022中先用鼠標(biāo)左鍵選中，窗體界面中的DataGrid，然后點擊Visual Studio 2022最右邊的“屬性”標(biāo)簽，然后Visual Studio 2022會彈出“屬性”窗口。在“屬性”窗口中展開列，用鼠標(biāo)左鍵點擊Columns那一行的按鈕。如下圖中的紅色2處，然后會彈出一個對話框“集合編輯器”，如下圖。

?

?5.在上圖3處，選擇相應(yīng)的列的類型，然后點擊“添加”按鈕，添加列。如下圖。

6. 根據(jù)我這個示例的實際情況，我根據(jù)需要我添加了4列DataGridTextColumn,和一列DataGridComboBoxColumn。添加完成之后，如下圖。?

???? 7. 通過Entity Framework ?Core 7 從數(shù)據(jù)庫（本地數(shù)據(jù)庫(EFCoreDemo))中的Area表中讀取縣區(qū)鎮(zhèn)的信息數(shù)據(jù)，從Province表中讀取省份信息，從City表中讀取城市信息，然后通過綁定的方式將縣區(qū)鎮(zhèn)的數(shù)據(jù)綁定到DataGrid中，讓W(xué)PF的Window中的DataGrid顯示縣區(qū)鎮(zhèn)的信息。具體代碼如下。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using WpfGridDemo.NET7.Entitys;
  

namespace WpfGridDemo.NET7
{

    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary> 
    public partial class MainWindow : Window
 
    {

        public MainWindow()
        {
            InitializeComponent();
 
        }

        GridDbContext db = new GridDbContext();
        protected List<City> GetCitys()
        {
 
            List<City> list = db.City.ToList<City>();
            return list;
       }
 
        protected List<Area> GetAreas()
        {
 
            List<Area> list = db.Area.ToList<Area>();  
            return list;
        }

        protected List<Province> GetProvinces()
        {
            List<Province> list = db.Province.ToList<Province>();

            return list;
        }

        private void BindGrid()
        {
            gridArea.ItemsSource = GetAreas();
       } 
        private void btnRefresh_Click(object sender, RoutedEventArgs e)
        {
            BindGrid();
        }
    }
}?

8.在Visual Studio 2022中按F5鍵，啟動WPF應(yīng)用程序，然后使用鼠標(biāo)左鍵點擊“刷新”按鈕。如下圖。從圖中來看，數(shù)據(jù)是綁定到了DataGrid，但是卻沒有在DataGrid中顯示出來。

9.這是由于我們沒有使用列自動生成，同時沒有將數(shù)據(jù)綁定到具體的列上。接下來我們來綁定數(shù)據(jù)。

        <DataGrid x:Name="gridArea" Grid.Row="1" d:ItemsSource="{d:SampleData ItemCount=5}" 
AutoGenerateColumns="False" HorizontalAlignment="Left" VerticalAlignment="Top">
            <DataGrid.Columns>
                <DataGridComboBoxColumn Header="城市" Width="120" />
                <DataGridTextColumn Header="縣區(qū)鎮(zhèn)" Width="*" Binding="{Binding Name}" ClipboardContentBinding="{x:Null}"/>

                <DataGridTextColumn Header="郵編" Width="100"  Binding="{Binding Code}" ClipboardContentBinding="{x:Null}"/> 

                <DataGridTextColumn Header="創(chuàng)建時間" Width="160" Binding="{Binding Created}" ClipboardContentBinding="{x:Null}"/>

                <DataGridTextColumn Header="更新時間" Width="160" Binding="{Binding Updated}" ClipboardContentBinding="{x:Null}"/>

            </DataGrid.Columns>
        </DataGrid>

10. 在Visual Studio 2022中按F5鍵，啟動WPF應(yīng)用程序，然后使用鼠標(biāo)左鍵點擊“刷新”按鈕。如下圖。

?

?

?

?

到了這里，關(guān)于WPF入門教程系列二十五——DataGrid使用示例(2)的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！