---
lang: ja-jp
breaks: true
---
# WinUI 3 で `DataGrid` ※`WindowsCommunityToolkit` を使用する 2022-07-26

> WinUI 3のデータグリッドを試してみる（１）
> https://devlog.grapecity.co.jp/winui-3-datagrid-1/

## 実行結果


## csproj

<Project Sdk="Microsoft.NET.Sdk">
・・・
	<ItemGroup>
		<PackageReference Include="CommunityToolkit.WinUI.UI.Controls" Version="7.1.2" />
		<PackageReference Include="Microsoft.WindowsAppSDK" Version="1.2.220727.1-experimental1" />
		<PackageReference Include="Microsoft.Windows.SDK.BuildTools" Version="10.0.25182-preview" />
	</ItemGroup>
・・・
</Project>

## MainWindow.xaml

<Window
    x:Class="App25.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App25"
    xmlns:helpers="using:App25.helpers"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    xmlns:viewModels="clr-namespace:App25.viewModels"
    xmlns:controls="using:CommunityToolkit.WinUI.UI.Controls"
    >
    <Grid
        Background="{ThemeResource AcrylicBackgroundFillColorDefaultBrush}"
        >
・・・
        <controls:DataGrid 
            BorderThickness="1"
            IsReadOnly="True"
            ItemsSource="{x:Bind ViewModel.PackagesList, Mode=OneWay}"
            AutoGenerateColumns="true"
            >
        </controls:DataGrid>
・・・   
    </Grid>
</Window>

## MainWindow.xaml.cs

namespace App25;

public sealed partial class MainWindow : Window
{
    private MainWindowViewModel ViewModel { get; init; }

    public MainWindow()
    {
        this.InitializeComponent();

        ViewModel = new MainWindowViewModel();
    }
}

## MainWindowViewModel.cs

internal sealed class MainWindowViewModel:
    INotifyPropertyChanged
{

    public async Task UpdateNugetPackagesListAsync()
    {
・・・
        PackagesList = new(
            packages.Select(
                (n, i) => new GithubPackagesModel(
                    row          : i + 1,
                    id           : n.Id           ,
                    name         : n.Name         ,
                    package_type : n.Package_type ,
                    version_count: n.Version_count,
                    visibility   : n.Visibility   ,
                    url          : n.Url          ,
                    created_at   : n.Created_at   ,
                    updated_at   : n.Updated_at   ,
                    html_url     : n.Html_url     
                    )
                )
                .ToList()
            );
    }

    private List<GithubPackagesModel> m_packagesList;
    public List<GithubPackagesModel> PackagesList { get { return this.m_packagesList; } set { if (value == this.m_packagesList) { return; } this.m_packagesList = value; OnPropertyChanged(nameof(PackagesList)); } }
    public event PropertyChangedEventHandler PropertyChanged;
    public event PropertyChangedEventHandler PropertyChanged_PackagesList;
    private void OnPropertyChanged([System.Runtime.CompilerServices.CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        switch (propertyName)
        {
            case nameof(PackagesList):
                PropertyChanged_PackagesList?.Invoke(this, new PropertyChangedEventArgs(propertyName));
                break;
        }
    }
}

###### tags: `WinUI 3` `DataGrid` `WindowsCommunityToolkit`