「東雲 忠太郎」の平凡な日常のできごと

「東雲 忠太郎」の平凡な日常のできごと

2024.03.17
XML
カテゴリ: C#.NET


`ObservableCollection` は、WPF アプリケーションにおいて、データの変更を自動的に通知するために使用されるコレクションです。以下に、`ObservableCollection` を活用する簡単なサンプルコードを示します。


このサンプルでは、ボタンをクリックするたびに `ObservableCollection` に新しい項目が追加され、その変更が自動的に UI に反映されます。


まず、MainWindow.xaml には、ボタンとリストボックスが含まれています。


```xml

<Window x:Class="ObservableCollectionSample.MainWindow"

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

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

        Title="ObservableCollection Sample" Height="450" Width="800">

    <Grid>

        <StackPanel>

            <Button Content="Add Item" Click="AddItem_Click"/>

            <ListBox x:Name="listBox" Width="200" Height="200"/>

        </StackPanel>

    </Grid>

</Window>

```


次に、MainWindow.xaml.cs には、`ObservableCollection` を使用してリストボックスの項目を動的に追加するコードが含まれています。


```csharp

using System.Collections.ObjectModel;

using System.Windows;


namespace ObservableCollectionSample

{

    public partial class MainWindow : Window

    {

        private ObservableCollection<string> items;


        public MainWindow()

        {

            InitializeComponent();


            // ObservableCollection をインスタンス化

            items = new ObservableCollection<string>();


            // リストボックスに ObservableCollection をバインド

            listBox.ItemsSource = items;

        }


        private void AddItem_Click(object sender, RoutedEventArgs e)

        {

            // ボタンがクリックされたときに、ObservableCollection に新しい項目を追加

            items.Add("Item " + (items.Count + 1));

        }

    }

}

```


このコードでは、`ObservableCollection<string>` をインスタンス化し、リストボックスの `ItemsSource` にバインドしています。ボタンがクリックされるたびに、新しい項目が `ObservableCollection` に追加されます。その変更は自動的に UI に反映されます。


`ObservableCollection` を使用することで、データの変更を監視し、UI の更新を簡単に行うことができます。これは、動的なデータの管理や表示に非常に便利です。






お気に入りの記事を「いいね!」で応援しよう

Last updated  2024.03.17 11:33:11


【毎日開催】
15記事にいいね!で1ポイント
10秒滞在
いいね! -- / --
おめでとうございます!
ミッションを達成しました。
※「ポイントを獲得する」ボタンを押すと広告が表示されます。
x

© Rakuten Group, Inc.
Create a Mobile Website
スマートフォン版を閲覧 | PC版を閲覧
Share by: