1、ListView。
ListView繼承自簡單的沒有特色的ListBox，並使用View屬性進行擴展。增加了對基於列顯示的支持，並增加了快速切換視圖或顯示模式的能力，而不需要重新綁定數據以及重新構建列表。其中View屬性是是一個擴展點，用於創建內容豐富的列表，如果沒有設置View屬性，ListView控件的行為就類似於功能較少的祖先ListBox控件的行為。ListView目前只提供了GridView視圖，用於創建多列是非常有用的。GridView類繼承自ViewBase類，表示具有多列的列表視圖，通過為GridView.Columns集合添加GridViewColumn對象可定義這些列。
GridView和GridViewColumn都提供了一些有用的方法，可使用這些方法定制列表的顯示外觀。為創建最簡單、最直觀的列表，只需要為每個GridViewColumn對象設置兩個屬性：Header屬性和DisplayMemberBinding，Header屬性提供放在頂部的文本，而DIsplayMemberBinding屬性包含一個綁定，該綁定從每個數據項提取希望顯示的信息。
1.1)、通過ListView顯示數據。
xaml代碼：
<ListView Name="listView1">
<!--通過listView視圖-->
<ListView.View>
<!--通過設置提供的GridView視圖-->
<GridView>
<GridView.Columns>
<!--設置Header屬性和DisplayMemberBinding屬性-->
<GridViewColumn Header="產品編號" DisplayMemberBinding="{Binding Path=ProId}"></GridViewColumn>
<GridViewColumn Header="產品名字" DisplayMemberBinding="{Binding Path=ProName}"></GridViewColumn>
<GridViewColumn Header="產品價格" DisplayMemberBinding="{Binding Path=ProPrice, StringFormat={}{0:C}}"></GridViewColumn>
<GridViewColumn Header="產品描述" DisplayMemberBinding="{Binding Path=ProDescribe}"></GridViewColumn>
<GridViewColumn Header="產品圖片路徑" DisplayMemberBinding="{Binding Path=ProImagePath}"></GridViewColumn>
</GridView.Columns>
</GridView>
</ListView.View>
</ListView>
后台代碼：
public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); this.Loaded += MainWindow_Loaded; } Bll.ProductBll productBll = App.ProductBll; void MainWindow_Loaded(object sender, RoutedEventArgs e) { this.listView1.ItemsSource = productBll.GetCollectionProduct2(); } }
效果圖：
1.2)、改變列的尺寸。
可為GridViewColumn設置width屬性來改變列的寬度。這種設置只是確定了列的初始寬度，不會組織用戶通過單機列標題邊緣來修改列寬。如果希望完全禁止修改列的尺寸，唯一的選擇就是為GridViewColumn的標題提供新模板。
<GridViewColumn Width="80" Header="產品編號" DisplayMemberBinding="{Binding Path=ProId}"></GridViewColumn>
1.3)、單元格模板。
在為單元格中顯示數據，GridViewColumn.DisplayMemberBinding屬性並不是唯一的選擇，而另一個選擇是使用CellTemplate屬性，該屬性使用的是是數據模板。注意：如果同時為GridViewColumn設置了DisplatyMemberBinding和CellTemplate屬性，那么默認會使用DisplayMemberBinding屬性為單元格設置內容並完全忽略模板。
<!--不使用DisplayMemberBinding屬性，使用CellTemplate屬性，效果是一樣的。-->
<GridViewColumn Header="產品名字">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=ProName}"></TextBlock>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
1.4)、單元格中顯示圖片。
xaml代碼：
<GridViewColumn Header="產品圖片">
<GridViewColumn.CellTemplate>
<DataTemplate>
<Image Width="50" Height="50">
<Image.Source>
<Binding Path="ProImagePath">
<Binding.Converter>
<local:ImagePathConverter></local:ImagePathConverter>
</Binding.Converter>
</Binding>
</Image.Source>
</Image>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
效果圖：
1.5)、自定義列標題。
如果不希望保持灰色的列標題方框，可以通過通過以下幾種方式設置他們。
a)、通過HeaderTemplate模板進行設置，這個數據模板可以綁定到在GridViewColumn.Header屬性中指定的任何對象。
<GridViewColumn Width="70" DisplayMemberBinding="{Binding Path=ProId}"> <GridViewColumn.Header> <Border CornerRadius="3" Background="Salmon"> <TextBlock>產品名稱</TextBlock> </Border> <!--如果直接在HeadTemplate中定義數據模板是行不通的--> <!--<DataTemplate> <TextBlock>產品名稱</TextBlock> </DataTemplate>--> </GridViewColumn.Header> </GridViewColumn>
效果圖：
b)、如果重新格式化特定的標題，可使用GridViewColumn.HeaderContainerStyle屬性提供的樣式。如果希望以相同的方式重新格式化所有的列標題，就需要改用GridView.ColumnHeaderContainerStyle屬性。
c)、如果希望完全改變標題的外觀，可以通過設置GridViewColumn.HeaderTemplaterSelector或GridViewColumnTemplaterSelector屬性，使用模板選擇器為特定的標題設置正確的模板。
3、DataGrid控件。
DataGrid控件是用來顯示數據的控件，從對象集合獲取信息並在具有行和單元格的網格中顯示信息。每行和單獨的對象相對應，並且在每列和對象的某個屬性相對應。
3.1)、為DataGrid控件添加數據。
xaml代碼：
<Grid>
<DataGrid Name="dataGrid1"></DataGrid>
</Grid>
后台代碼：
public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); this.Loaded += MainWindow_Loaded; } Bll.ProductBll productBll = App.ProductBll; void MainWindow_Loaded(object sender, RoutedEventArgs e) { this.dataGrid1.ItemsSource = productBll.GetCollectionProduct2(); } }
效果圖：
3.2)、DataGridView控件的基本屬性。
| DataGrid控件的基本顯示屬性 | |
| 名稱 | 說明 |
| RowBackground | DataGrid中的行的背景顏色。 |
| AlternationRowBackground | 交替行背景色。 |
| ColumnHeaderHeight | 標題列的高度。 |
| RowHeaderWidth | 具有行標題頭的寬度。 |
| ColumnWidth | 每列的寬度。 |
| RowHeight | 每行的高度。 |
| GridLinesVisibility | 確定是否顯示網格線。 |
| VerticalGridLinesBrush | 用於繪制列之間的網格線的畫刷。 |
| HorizontalGrdiLinesBrush | 用於繪制行之間網格線的畫刷。 |
| HeadersVisibility | 確定顯示哪個題頭的DataGridHeaders。 |
| HorizontalScrollBarVisibility | 是否顯示水平滾動條。 |
| VerticalScrollBarVisibility | 是否顯示垂直滾動條。 |
| CanUserResizeColumns | 阻止用戶通過拖動邊緣來改變大小。 |
| CanUserReorderColumns | 阻止用戶從一個位置拖動到另外一個位置。 |
| AutoGenerateColumns | 關閉自動生成列功能。 |
3.3)、定義列。
使用自動生成的列，可快速創建顯示所有數據的DataGrid控件，但放棄了一些控制能力。例如，不能控制列的順序，每列的寬度，以及如何格式化列中的值以及列中的標題。DataGrid控件支持以下幾種類型的列。
a)、DataGridTextColumn。這種類對於大部分數據類型是標准選擇。
b)、DataGridCheckBoxColumn。這種列用於顯示復選框。
c)、DataGridHyperlinkColumn。這種列顯示可單機的列。
d)、DataGridComboBox。這種列用於顯示下拉框的ComboBox。
e)、DataGridTemplateColumn。這種列功能非常強大。
3.3.1)、DataGridTextColumn。
有兩個常用屬性：Visibility屬性和DisplayIndex。其中Visibility屬性來動態地顯示和隱藏列，DisplayIndex用於來設置列的位置。
DataGridTextColumn普通寫法：
<DataGrid Name="dataGrid1" CanUserResizeColumns="False" CanUserReorderColumns="False" AutoGenerateColumns="False"> <DataGrid.Columns> <!--設置Header屬性和Binding屬性。--> <DataGridTextColumn Header="商品價格" Binding="{Binding Path=ProPrice,StringFormat={}{0:C}}"> </DataGridTextColumn> </DataGrid>
效果圖：
DataGridTextColumn的其他用法：
<DataGrid Name="dataGrid1" CanUserResizeColumns="False" CanUserReorderColumns="False" AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTextColumn Header="商品編號" Binding="{Binding Path=ProId}"></DataGridTextColumn>
<DataGridTextColumn Header="商品名稱" Binding="{Binding Path=ProName}"></DataGridTextColumn>
<DataGridTextColumn>
<!--設置Header屬性。-->
<DataGridTextColumn.Header>
<!--設置圓角-->
<Border CornerRadius="5" Background="Blue">
<TextBlock Foreground="BlueViolet">商品價格</TextBlock>
</Border>
</DataGridTextColumn.Header>
<!--設置Binding屬性。-->
<DataGridTextColumn.Binding>
<Binding Path="ProPrice" StringFormat="{}{0:C}"></Binding>
</DataGridTextColumn.Binding>
</DataGridTextColumn>
</DataGrid.Columns>
</DataGrid>
效果圖：
3.3.2)、DataGridCheckBoxColumn。
與DataGridTextColumn一樣，使用Binding屬性提取數據。是用於設置內部CheckBox元素的IsChecked屬性的true或者false值。
<DataGridCheckBoxColumn Header="選中狀態" Binding="{Binding Path=ProIsDrag}"> </DataGridCheckBoxColumn>
效果圖：
3.3.3)、DataGridHyperlinkColumn。
3.3.4)、DataGridComboBoxColumn。
3.3.4)、DataGridTemplateColumn。]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]有待完善！！！！！！！！！！！！！
3.4)、設置列的格式和樣式。
可通過ElementStyle屬性創建應用於DataGrid單元格內部的元素的樣式。對於簡單的DataGridTextColumn，該元素是TextBlock，對於DataGridCheckBoxColumn，單元格內部的元素是復選框。對於DataGridTemplateColumn，單元格內部的元素是在數據模板中創的任何元素。
xaml代碼：
<!--設置換行樣式，要設置列的寬度。--> <DataGridTextColumn Header="商品描述" Binding="{Binding Path=ProDescribe}" Width="60"> <DataGridTextColumn.ElementStyle> <!--設置樣式。--> <Style TargetType="TextBlock"> <!--設置TextBlock元素的TextWrapping屬性。--> <Setter Property="TextBlock.TextWrapping" Value="Wrap"></Setter> </Style> </DataGridTextColumn.ElementStyle> </DataGridTextColumn>
效果圖：
其中，ElementStyle提供了設置特定列中所有單元格的格式的方法。然而在某些情況下，可能希望為每一列中的每個單元格應用格式化設置。完成該工作的最簡單的方式是為DataGrid.RowStyle屬性設置樣式，DataGrid控件還提供了少部分用於設置網絡其他部分(如列標題頭和行標題頭)格式的額外屬性。
| 基於樣式的DataGrid屬性 | |
| 屬性 | 樣式的適用范圍 |
| ColumnHeaderStyle | 樣式的適用范圍 |
| RowHeaderStyle | 位於網格頂部的列標題的TextBlock。 |
| RowStyle | 用於普通行(在列種沒有遇到通過列的ElementStyle屬性確定制過的行為)的TextBlock。 |
| DragIndicatorStyle | 當用戶正在將列標題頭拖動到新位置時用於列標題頭的TextBlock。 |
3.5)、設置行的格式(e.Row.Background)。
很多情況下，標識包含特定數據的行更有用，例如，可強調價格較高的產品和到期的貨運，可通過處理DataGrid.LoadingRow事件已編程的方式應用此類格式。這個時候需要使用DataGridTemplate和自定義值轉換器。
每當一行的數據出現在屏幕上時，都會立即為該行為引發LoadingRow事件，這種方式的優點是應用程序不必永遠格式化整個網絡；相反，只為當前可見的行為引發LoadingRow事件，但也有缺點，當用戶在網格中滾動時，會連續引發LoadingRow事件。因此在LoadingRow方法中不能放置耗時的代碼。
后台代碼：
public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); this.Loaded += MainWindow_Loaded; } Bll.ProductBll productBll = App.ProductBll; void MainWindow_Loaded(object sender, RoutedEventArgs e) { this.dataGrid1.ItemsSource = productBll.GetCollectionProduct2(); } //突出背景。 private SolidColorBrush highLightBrush = new SolidColorBrush(Colors.Orange); //默認背景。 private SolidColorBrush defaultlBrush = new SolidColorBrush(Colors.White); /// <summary> /// LoadingRow事件。 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void dataGrid1_LoadingRow(object sender, DataGridRowEventArgs e) { try { //將行對象轉換成Product對象。 Models.Product product = (Models.Product)e.Row.DataContext; //如果價錢大於5就為每一行設置背景色為橘黃色。 if (product.ProPrice > 5) { e.Row.Background = highLightBrush; } else { //設置行背景色為白色。 e.Row.Background = defaultlBrush; } } catch (Exception) { } } }
效果圖：
3.6)、顯示行細節(RowDetailsTemplate)。
可通過設置RowDetailsVisibilityMode屬性來配置行細節區域的顯示行為。默認情況下是VisibleWhenSelected，如果設置成Visible就會立即可看到。
xaml代碼：
<Grid> <DataGrid Name="dataGrid1" LoadingRow="dataGrid1_LoadingRow"> <!--RowDetailsTemplate模板 --> <DataGrid.RowDetailsTemplate> <DataTemplate> <Border Margin="10" Padding="10" BorderBrush="SteelBlue" BorderThickness="3" CornerRadius="5"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> <ColumnDefinition Width="2*"></ColumnDefinition> </Grid.ColumnDefinitions> <TextBlock Grid.Column="0" Text="{Binding Path=ProId}"></TextBlock> <TextBlock Grid.Column="1" Text="{Binding Path=ProName}"></TextBlock> <TextBlock Grid.Column="2" Text="{Binding Path=ProPrice, StringFormat={}{0:C}}"></TextBlock> <Image Grid.Column="3" Width="50" Height="50" VerticalAlignment="Top"> <Image.Source> <Binding Path="ProImagePath"> <Binding.Converter> <local:ImagePathConverter></local:ImagePathConverter> </Binding.Converter> </Binding> </Image.Source> </Image> </Grid> </Border> </DataTemplate> </DataGrid.RowDetailsTemplate> </DataGrid>
后台代碼不變，效果圖：
3.7)、凍結列。
用FrozenColumnCount屬性表示。如果設置FrozenColumnCount 屬性 = 1，就說明是第1列被凍結了。
<!--設置DataGrid的第1列為凍結。-->
<DataGrid Name="dataGrid1" LoadingRow="dataGrid1_LoadingRow" RowDetailsVisibilityMode="VisibleWhenSelected" FrozenColumnCount="1">
效果圖：
3.8)、選擇。
與普通的列表控件類似，DataGrid控件允許用戶選擇單個項，當選擇一項時，可以響應SelectionChanged事件。為找到當前選擇的數據對象，可使用SelectedItem屬性。如果希望用戶能夠選擇多行，可將SelectionMode屬性設置為Extended(默認是Single)，為了選擇多行，用戶必須按下shift或Ctrl鍵，可從SelectedItems屬性中檢索選項的集合。
xaml代碼：
<Grid> <!--DataGrid 的SelectionChanged事件。--> <DataGrid Name="dataGrid1" SelectionChanged="dataGrid1_SelectionChanged"> </DataGrid> </Grid>
后台代碼：
public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); this.Loaded += MainWindow_Loaded; } Bll.ProductBll productBll = App.ProductBll; void MainWindow_Loaded(object sender, RoutedEventArgs e) { this.dataGrid1.ItemsSource = productBll.GetCollectionProduct2(); } //事件代理函數。 private void dataGrid1_SelectionChanged(object sender, SelectionChangedEventArgs e) { //轉換成Product對象。 Models.Product product = (Models.Product)this.dataGrid1.SelectedItem; //彈出信息。 MessageBox.Show(product.ProName); } }
效果圖：
3.9)、排序。
可通過設置列的SortMemberPath屬性從綁定的數據對象中選擇不同的屬性，可以通過設置CanUserSortColumns屬性設置為false來禁用排序。
3.10)、編輯。
DataGrid控件最方便之處在於支持編輯，當用戶雙擊DataGrid單元格時，該單元格會切換到編輯模式，但可以通過以下幾種方式進行控制：
a)、DataGrid.IsReadOnly屬性設置為 True 時，用戶不能編輯。
b)、DataGridColumn.IsReadOnly屬性設置為true時，用戶不能編輯。
c)、只讀屬性。如果數據對象具有沒有屬性設置器的屬性，DataGrid控件足夠智能，它能夠注意到該細節，並且進制編輯列。