WPF入门教程系列二十一——DataGrid示例(一)

      前面咱们学习了ListView控件的使用示例，今天咱们来学习DataGrid的有关知识。提到DataGrid 无论是Asp.Net中的网页开发仍是WinForm应用程序开发都会频繁使用。经过它咱们能够灵活的在行与列间显示各类数据。本篇将学习WPF中的DataGrid 相关功能。

      首先，先介绍一下DataGrid中有哪些列的类型。

DataGrid列的类型

   默认状况下，当咱们为DataGrid 控件设置ItemSource 属性后，DataGrid 会根据数据类型自动生成相应的列，下表列出DataGrid 支持的四种列及其数据类型。

下表列出了 DataGrid 提供的四个列类型。

列类型	显示数据	数据类型
DataGridHyperlinkColumn	使用显示 URI 数据。	URI
DataGridComboBoxColumn	使用显示枚举数据与其余须要下拉框选择的数据。	Enum,String
DataGridTextColumn	使用显示文本	String
DataGridCheckBoxColumn	使用显示布尔数据	Bool

  在建立DataGrid 时能够经过AutoGenerateColumns 属性设置列是否自动生成，从而加入自定义列。若是DataGrid 中同时包含“自动生成列”与“用户自定义列”，则首先建立“用户自定义列”。以下图。

 

其次：咱们来作一个示例，学习如何使用DataGrid。

制作DataGrid示例的界面

1）按照上一篇文章中所写的步骤，使用Visual Studio 2013建立一个WindowGrid界面。以下图。

 

2）在Visual studio 2013中的工具箱中，找到DataGrid控件，而后双击。把DataGrid控件添加窗体界面中。以下图1，图2。注意，图2中的红框所标示的那个小框，就是DataGrid控件，是否是与WindowForm中的DataGrid有很大的不一样呀。

 

图1

 

图2

3）给DataGrid添加列。先鼠标左键选中，窗体界面中的小方块，而后点击Visual Studio 2013最右边的“属性”标签，而后Visual Studio 2013会弹出“属性”编辑窗口。以下图。

 

4) 在上图中使用鼠标左键点击Columns那一行的按钮。如上图中的红色框，而后会弹出一个对话框，以下图。

 

4）在上图中，选择相应的列的类型，而后点击“添加”按钮，添加列。以下图。

 

5) 根据我这个示例的实际状况，我根据须要我添加了5列DataGridTextColumn,和一列DataGridComboBoxColumn。添加完成以后，以下图。看起来与WindowForm中的DataGrid很像了吧。

 

6) 下面是所有完成以后的实际的XAML代码。

 

<Window x:Class="WpfApp1.WindowGrid"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="Grid示例" Height="400" Width="600">

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition Height="*"/>

            <RowDefinition Height="auto"/>

            <RowDefinition Height="22"/>

        </Grid.RowDefinitions>

        <DataGrid x:Name="gridCitys"  Grid.Row="0" HorizontalAlignment="Left" VerticalAlignment="Top" AutoGenerateColumns="False">

            <DataGrid.Columns>

 

                <DataGridTextColumn Binding="{Binding CityID}" ClipboardContentBinding="{x:Null}" Header="CityID"/>

                <DataGridTextColumn Binding="{Binding CityName}" ClipboardContentBinding="{x:Null}" Header="CityName"/>

                <DataGridTextColumn Binding="{Binding ZipCode}" ClipboardContentBinding="{x:Null}" Header="ZipCode"/>

                <DataGridComboBoxColumn x:Name="cboProvince" ClipboardContentBinding="{x:Null}" Header="ProvinceID" SelectedValuePath="ProvinceID" SelectedValueBinding="{Binding Path=ProvinceID,UpdateSourceTrigger=PropertyChanged}"  DisplayMemberPath="ProvinceName" SelectedItemBinding="{x:Null}" >

 

                </DataGridComboBoxColumn>

                <DataGridTextColumn Binding="{Binding DateCreated}" ClipboardContentBinding="{x:Null}" Header="DateCreated"/>

                <DataGridTextColumn Binding="{Binding DateUpdated}" ClipboardContentBinding="{x:Null}" Header="DateUpdated"/>

 

            </DataGrid.Columns>

        </DataGrid>

        <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Right" >

            <TextBlock Text="显示信息" TextAlignment="Center"  />

            <TextBox Name="txtMsg" IsReadOnly="True" Text="" Width="320" TextAlignment="Center" />           

           

        </StackPanel>

        <WrapPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right">

            <Button  HorizontalAlignment="Right"  Name="btnRefresh" Height="22" VerticalAlignment="Top" Width="65" Click="btnRefresh_Click">刷新</Button>

            <Button  HorizontalAlignment="Right"  Name="btnUpdate" Height="22" VerticalAlignment="Top" Width="65" Click="btnUpdate_Click"  >更新</Button>

        </WrapPanel>

    </Grid>

</Window>