Day 14: 컬렉션과 바인딩 - ObservableCollection, ICollectionView

이번 글에서는 WPF에서 데이터 컬렉션과 바인딩을 다루는 두 가지 클래스인 ObservableCollection과 ICollectionView에 대해 알아보겠습니다. 또한, 이를 이용하여 반도체 제조 공정에서 사용되는 웨이퍼 리스트를 구현해보겠습니다.

컬렉션에 대해 알고싶은분은 아래 글을 참고해주세요.

2023.04.11 - [Languages/C#] - C# 컬렉션 & 제네릭 컬렉션(Collection & Generic Collection)

C# 컬렉션 & 제네릭 컬렉션(Collection & Generic Collection)

---

ObservableCollection

ObservableCollection 클래스는 .NET 프레임워크에서 제공하는 클래스로, 컬렉션 데이터의 변경 내용을 자동으로 알립니다. 이 클래스는 INotifyCollectionChanged 인터페이스를 구현하여, 데이터 변경 시 자동으로 컨트롤에 바인딩된 데이터를 업데이트 할 수 있도록 합니다.

간단한 예제를 통해 ObservableCollection 클래스를 사용하는 방법을 알아보겠습니다.

public class Wafer
{
    public int Number { get; set; }
    public string Status { get; set; }
}

public class WaferList : ObservableCollection<Wafer>
{
    public WaferList()
    {
        Add(new Wafer { Number = 1, Status = "Good" });
        Add(new Wafer { Number = 2, Status = "Bad" });
        Add(new Wafer { Number = 3, Status = "Good" });
    }
}

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();

        DataContext = new WaferList();
    }
}

위 예제에서는 Wafer 클래스를 정의하고, WaferList 클래스에서 ObservableCollection<Wafer>를 상속받아 컬렉션을 정의합니다. 그리고 WaferList 생성자에서 Wafer 객체를 생성하여 컬렉션에 추가합니다.

MainWindow 클래스에서는 WaferList를 DataContext로 설정하여, XAML에서 데이터 바인딩에 사용됩니다.

728x90

ICollectionView

ICollectionView 인터페이스는 WPF에서 제공하는 인터페이스로, 컬렉션의 데이터를 필터링하고 정렬하는 기능을 제공합니다. ICollectionView 인터페이스를 구현하는 클래스 중에서 가장 많이 사용되는 클래스는 CollectionViewSource 클래스입니다.

아래는 ICollectionView를 사용하여 WaferList에서 데이터를 필터링하고 정렬하는 예제입니다.

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();

        WaferList waferList = new WaferList();

        ICollectionView view = CollectionViewSource.GetDefaultView(waferList);
        view.Filter = w => ((Wafer)w).Status == "Good";
        view.SortDescriptions.Add(new SortDescription("Number", ListSortDirection.Ascending));

        DataContext = view;
    }
}

위 예제에서는 WaferList를 생성하고, CollectionViewSource 클래스의 GetDefaultView 메서드를 사용하여 ICollectionView 객체를 생성합니다.

ICollectionView 객체의 Filter 프로퍼티를 사용하여 WaferList에서 Status가 "Good"인 데이터만 필터링하고,

SortDescriptions 프로퍼티를 사용하여 Number 프로퍼티를 기준으로 오름차순으로 정렬합니다.

마지막으로 WaferList를 ICollectionView 객체인 WaferCollectionView으로 wrapping하여, DataContext로 설정합니다. 이는 XAML에서 데이터 바인딩을 할 때 사용됩니다.

public MainWindow()
{
    InitializeComponent();

    WaferList = new List<Wafer>();
    for (int i = 0; i < 10; i++)
    {
        WaferList.Add(new Wafer() { LotId = "Lot" + i.ToString(), WaferId = i });
    }

    WaferCollectionView = CollectionViewSource.GetDefaultView(WaferList);
    DataContext = WaferCollectionView;
}

이제 XAML에서는 DataContext에 WaferCollectionView를 설정하여 데이터 바인딩을 할 수 있습니다.

<ListBox ItemsSource="{Binding}">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <TextBlock Text="{Binding LotId}"/>
                <TextBlock Text="{Binding WaferId}"/>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

이렇게 설정하면, ListBox에 WaferList의 데이터가 바인딩되어 표시됩니다. ICollectionView를 사용하면, 정렬, 필터링, 그룹핑 등의 기능을 쉽게 사용할 수 있습니다.

---

오늘은 WPF에서 컬렉션과 바인딩에 대해 알아보았습니다. ObservableCollection은 컬렉션 내의 데이터가 변경되었을 때 알림을 받을 수 있도록 하는 타입이며, 이를 활용하여 UI의 업데이트를 쉽게 처리할 수 있습니다. 또한, ICollectionView를 사용하면 컬렉션 내부를 필터링, 정렬, 그룹화 등 다양한 방법으로 조작할 수 있습니다.

간단한 예제를 통해 ObservableCollection과 ICollectionView를 사용하는 방법을 살펴보았습니다. 이러한 기능들은 반도체 산업 등 데이터가 빈번하게 갱신되는 분야에서 UI 업데이트를 효율적으로 처리하기 위해 많이 사용됩니다.

이상으로 오늘의 글을 마치겠습니다. 다음 시간에는 WPF에서 리스트뷰와 트리뷰를 구현하는 방법에 대해 알아보겠습니다. 감사합니다.