Jak dodać szczegóły wiersza do formantu DataGrid
W przypadku korzystania z kontrolki DataGrid możesz dostosować prezentację danych, dodając sekcję szczegółów wiersza. Dodanie sekcji szczegółów wiersza umożliwia grupowanie niektórych danych w szablonie, który jest opcjonalnie widoczny lub zwinięty. Na przykład można dodać szczegóły wiersza do elementu DataGrid , który przedstawia tylko podsumowanie danych dla każdego wiersza w DataGridobiekcie , ale przedstawia więcej pól danych, gdy użytkownik wybierze wiersz. Szablon można zdefiniować dla sekcji szczegółów wiersza we RowDetailsTemplate właściwości . Poniższa ilustracja przedstawia przykład sekcji szczegółów wiersza.
Szablon szczegółów wiersza definiuje się jako wbudowany kod XAML lub zasób. Obie metody przedstawiono w poniższych procedurach. Szablon danych, który jest dodawany jako zasób, może być używany w całym projekcie bez ponownego tworzenia szablonu. Szablon danych dodawany jako wbudowany kod XAML jest dostępny tylko z kontrolki, w której jest zdefiniowany.
Aby wyświetlić szczegóły wiersza przy użyciu wbudowanego kodu XAML
Utwórz obiekt DataGrid , który wyświetla dane ze źródła danych.
W elemecie DataGrid dodaj RowDetailsTemplate element .
Utwórz element DataTemplate definiujący wygląd sekcji szczegółów wiersza.
Poniższy kod XAML przedstawia instrukcje DataGrid i sposób definiowania wbudowanego kodu RowDetailsTemplate . Spowoduje to DataGrid wyświetlenie trzech wartości w każdym wierszu i trzech kolejnych wartości po wybraniu wiersza.
<Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525" Loaded="Window_Loaded"> <Grid> <DataGrid Name="dataGrid1" IsReadOnly="True" AutoGenerateColumns="False" > <DataGrid.Columns> <DataGridTextColumn Header="Company Name" Binding="{Binding CompanyName}"></DataGridTextColumn> <DataGridTextColumn Header="Contact First Name" Binding="{Binding FirstName}"></DataGridTextColumn> <DataGridTextColumn Header="Contact Last Name" Binding="{Binding LastName}"></DataGridTextColumn> </DataGrid.Columns> <DataGrid.RowDetailsTemplate> <DataTemplate> <Border BorderThickness="0" Background="BlanchedAlmond" Padding="10"> <StackPanel Orientation="Vertical"> <StackPanel Orientation="Horizontal"> <TextBlock FontSize="12" Text="Email: " VerticalAlignment="Center" /> <TextBlock FontSize="16" Foreground="MidnightBlue" Text="{Binding EmailAddress}" VerticalAlignment="Center" /> </StackPanel> <StackPanel Orientation="Horizontal"> <TextBlock FontSize="12" Text="Phone: " VerticalAlignment="Center" /> <TextBlock FontSize="16" Foreground="MidnightBlue" Text="{Binding Phone}" VerticalAlignment="Center" /> </StackPanel> <StackPanel Orientation="Horizontal"> <TextBlock FontSize="12" Text="Sales Person: " VerticalAlignment="Center" /> <TextBlock FontSize="16" Foreground="MidnightBlue" Text="{Binding SalesPerson}" VerticalAlignment="Center" /> </StackPanel> </StackPanel> </Border> </DataTemplate> </DataGrid.RowDetailsTemplate> </DataGrid> </Grid> </Window>
Poniższy kod przedstawia zapytanie używane do wybierania danych wyświetlanych w obiekcie DataGrid. W tym przykładzie zapytanie wybiera dane z jednostki zawierającej informacje o kliencie.
private void Window_Loaded(object sender, RoutedEventArgs e) { AdventureWorksLT2008Entities advenWorksEntities = new AdventureWorksLT2008Entities(); ObjectQuery<Customer> customers = advenWorksEntities.Customers; var query = from customer in customers orderby customer.CompanyName select new { customer.LastName, customer.FirstName, customer.CompanyName, customer.Title, customer.EmailAddress, customer.Phone, customer.SalesPerson }; dataGrid1.ItemsSource = query.ToList(); }
Dim advenWorksEntities As AdventureWorksLT2008Entities = New AdventureWorksLT2008Entities Private Sub Window_Loaded(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles MyBase.Loaded Dim customers As ObjectQuery(Of Customer) = advenWorksEntities.Customers Dim query = _ From customer In customers _ Order By customer.CompanyName _ Select _ customer.LastName, _ customer.FirstName, _ customer.CompanyName, _ customer.Title, _ customer.EmailAddress, _ customer.Phone, _ customer.SalesPerson dataGrid1.ItemsSource = query.ToList() End Sub
Aby wyświetlić szczegóły wiersza przy użyciu zasobu
Utwórz obiekt DataGrid , który wyświetla dane ze źródła danych.
Resources Dodaj element do elementu głównego, takiego jak Window kontrolka lub Page kontrolka, lub dodaj Resources element do Application klasy w pliku App.xaml (lub Application.xaml).
W elemecie resources utwórz element DataTemplate definiujący wygląd sekcji szczegółów wiersza.
Poniższy kod XAML przedstawia RowDetailsTemplate zdefiniowany w Application klasie .
<Application.Resources> <DataTemplate x:Key="CustomerDetail"> <Border BorderThickness="0" Background="BlanchedAlmond" Padding="10"> <StackPanel Orientation="Vertical"> <StackPanel Orientation="Horizontal"> <TextBlock FontSize="12" Text="Email: " VerticalAlignment="Center" /> <TextBlock FontSize="16" Foreground="MidnightBlue" Text="{Binding EmailAddress}" VerticalAlignment="Center" /> </StackPanel> <StackPanel Orientation="Horizontal"> <TextBlock FontSize="12" Text="Phone: " VerticalAlignment="Center" /> <TextBlock FontSize="16" Foreground="MidnightBlue" Text="{Binding Phone}" VerticalAlignment="Center" /> </StackPanel> <StackPanel Orientation="Horizontal"> <TextBlock FontSize="12" Text="Sales Person: " VerticalAlignment="Center" /> <TextBlock FontSize="16" Foreground="MidnightBlue" Text="{Binding SalesPerson}" VerticalAlignment="Center" /> </StackPanel> </StackPanel> </Border> </DataTemplate> </Application.Resources>
W elemecie DataTemplateustaw dyrektywę x:Key na wartość, która jednoznacznie identyfikuje szablon danych.
W elemecie DataGrid ustaw RowDetailsTemplate właściwość na zasób zdefiniowany w poprzednich krokach. Przypisz zasób jako zasób statyczny.
Poniższy kod XAML przedstawia właściwość ustawioną RowDetailsTemplate na zasób z poprzedniego przykładu.
<DataGrid Name="dataGrid1" IsReadOnly="True" AutoGenerateColumns="False" RowDetailsTemplate="{StaticResource CustomerDetail}" > <DataGrid.Columns> <DataGridTextColumn Header="Company Name" Binding="{Binding CompanyName}"></DataGridTextColumn> <DataGridTextColumn Header="Contact First Name" Binding="{Binding FirstName}"></DataGridTextColumn> <DataGridTextColumn Header="Contact Last Name" Binding="{Binding LastName}"></DataGridTextColumn> </DataGrid.Columns> </DataGrid>
Aby ustawić widoczność i uniemożliwić przewijanie poziome w celu uzyskania szczegółów wiersza
W razie potrzeby ustaw RowDetailsVisibilityMode właściwość na DataGridRowDetailsVisibilityMode wartość.
Domyślnie wartość jest ustawiona na VisibleWhenSelectedwartość . Można go ustawić Visible tak, aby wyświetlić szczegóły wszystkich wierszy lub Collapsed ukryć szczegóły dla wszystkich wierszy.
W razie potrzeby ustaw AreRowDetailsFrozen właściwość , aby uniemożliwić
true
przewijanie w poziomie sekcji szczegółów wiersza.
.NET Desktop feedback
Opinia
https://aka.ms/ContentUserFeedback.
Dostępne już wkrótce: W 2024 r. będziemy stopniowo wycofywać zgłoszenia z serwisu GitHub jako mechanizm przesyłania opinii na temat zawartości i zastępować go nowym systemem opinii. Aby uzyskać więcej informacji, sprawdź:Prześlij i wyświetl opinię dla