다음을 통해 공유


방법: ListView 행의 배경색 대체

업데이트: 2007년 11월

이 예제에서는 ListView에서 행의 Background 색을 대체하는 데 사용할 수 있는 세 가지 방법을 보여 줍니다.

예제

다음 단원에서는 행의 Background 색이 대체되는 ListView를 만드는 세 가지 방법을 설명합니다. 예제에서는 행을 추가하거나 제거할 때 뷰를 업데이트하는 방법도 설명합니다.

방법 1: IvalueConverter를 사용하는 스타일을 정의하여 배경색 대체

다음 예제에서는 Background 속성의 값을 IValueConverter에 바인딩하는 ListViewItem 컨트롤의 Style을 정의하는 방법을 보여 줍니다.

<Style x:Key="myItemStyle" TargetType="{x:Type ListViewItem}">
  <Setter Property="Background">
    <Setter.Value>
      <Binding RelativeSource="{RelativeSource Self}" 
               Converter="{StaticResource myConverter}"/>
    </Setter.Value>
  </Setter>
</Style>

다음 예제에서는 IValueConverterResourceKey를 정의합니다.

<namespc:BackgroundConverter x:Key="myConverter"/>

다음 예제에서는 행 인덱스에 따라 Background 속성을 설정하는 IValueConverter의 정의를 보여 줍니다.

public sealed class BackgroundConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, 
        CultureInfo culture)
    {
        ListViewItem item = (ListViewItem)value;
        ListView listView = 
            ItemsControl.ItemsControlFromItemContainer(item) as ListView;
        // Get the index of a ListViewItem
        int index = 
            listView.ItemContainerGenerator.IndexFromContainer(item);

        if (index % 2 == 0)
        {
            return Brushes.LightBlue;
        }
        else
        {
            return Brushes.Beige;
        }
    }

다음 예제에서는 StyleItemContainerStyle로 사용하여 필요한 레이아웃을 제공하는 ListView를 정의하는 방법을 보여 줍니다.

<ListView Name="theListView" 
          ItemsSource="{Binding Source={StaticResource EmployeeData}, 
                                        XPath=Employee}"
          ItemContainerStyle="{StaticResource myItemStyle}" >
  <ListView.View>
    <GridView>
      <GridViewColumn DisplayMemberBinding="{Binding XPath=FirstName}" 
                      Header="First Name" Width="120"/>
      <GridViewColumn DisplayMemberBinding="{Binding XPath=LastName}" 
                      Header="Last Name" Width="120"/>
      <GridViewColumn DisplayMemberBinding="{Binding XPath=FavoriteCity}" 
                      Header="Favorite City" Width="120"/>
    </GridView>
  </ListView.View>
</ListView>

방법 2: ListView에서 새 클래스를 파생시켜 배경색 대체

다음 예제에서는 ListView에서 파생되는 클래스를 정의하는 방법을 보여 줍니다. 이 클래스는 Background 색이 대체되는 행을 만들기 위해 PrepareContainerForItemOverride 메서드를 재정의합니다.

public class SubListView : ListView
{
    protected override void
        PrepareContainerForItemOverride(DependencyObject element,
        object item)
    {
        base.PrepareContainerForItemOverride(element, item);
        if (View is GridView)
        {
            int index = ItemContainerGenerator.IndexFromContainer(element);
            ListViewItem lvi = element as ListViewItem;
            if (index % 2 == 0)
            {
                lvi.Background = Brushes.LightBlue;
            }
            else
            {
                lvi.Background = Brushes.Beige;
            }
        }
    }
}

다음 예제에서는 이 클래스의 인스턴스를 만드는 방법을 보여 줍니다. namespc 접두사는 CLR(공용 언어 런타임) 네임스페이스 및 StyleSelector가 정의된 해당 어셈블리로 매핑됩니다.

<namespc:SubListView
      ItemsSource="{Binding Source={StaticResource EmployeeData}, 
                                        XPath=Employee}">
  <namespc:SubListView.View>
    <GridView>
      <GridViewColumn DisplayMemberBinding="{Binding XPath=FirstName}" 
                      Header="First Name" Width="120"/>
      <GridViewColumn DisplayMemberBinding="{Binding XPath=LastName}" 
                      Header="Last Name" Width="120"/>
      <GridViewColumn DisplayMemberBinding="{Binding XPath=FavoriteCity}" 
                      Header="Favorite City" Width="120"/>
    </GridView>
  </namespc:SubListView.View>
</namespc:SubListView>

방법 3: StyleSelector를 사용하여 배경색 대체

다음 예제에서는 행의 Style을 정의하는 StyleSelector를 정의하는 방법을 보여 줍니다. 이 예제에서는 행 인덱스에 따라 Background 색을 정의합니다.

public class ListViewItemStyleSelector : StyleSelector
{
    public override Style SelectStyle(object item, 
        DependencyObject container)
    {
        Style st = new Style();
        st.TargetType = typeof(ListViewItem);
        Setter backGroundSetter = new Setter();
        backGroundSetter.Property = ListViewItem.BackgroundProperty;
        ListView listView = 
            ItemsControl.ItemsControlFromItemContainer(container) 
              as ListView;
        int index = 
            listView.ItemContainerGenerator.IndexFromContainer(container);
        if (index % 2 == 0)
        {
            backGroundSetter.Value = Brushes.LightBlue;
        }
        else
        {
            backGroundSetter.Value = Brushes.Beige;
        }
        st.Setters.Add(backGroundSetter);
        return st;
    }
}    

다음 예제에서는 StyleSelector에 대한 ResourceKey를 정의하는 방법을 보여 줍니다. namespc 접두사는 CLR 네임스페이스 및 StyleSelector가 정의된 해당 어셈블리로 매핑됩니다. 자세한 내용은 XAML 네임스페이스 및 네임스페이스 매핑을 참조하십시오.

<namespc:ListViewItemStyleSelector x:Key="myStyleSelector"/>

다음 예제에서는 ListViewItemContainerStyleSelector 속성을 이 StyleSelector 리소스로 설정하는 방법을 보여 줍니다.

<ListView 
      ItemsSource="{Binding Source={StaticResource EmployeeData}, 
                                        XPath=Employee}"
      ItemContainerStyleSelector="{DynamicResource myStyleSelector}" >      
  <ListView.View>
    <GridView>
      <GridViewColumn DisplayMemberBinding="{Binding XPath=FirstName}" 
                      Header="First Name" Width="120"/>
      <GridViewColumn DisplayMemberBinding="{Binding XPath=LastName}" 
                      Header="Last Name" Width="120"/>
      <GridViewColumn DisplayMemberBinding="{Binding XPath=FavoriteCity}" 
                      Header="Favorite City" Width="120"/>
    </GridView>
  </ListView.View>
</ListView>

ListViewItem 컬렉션 변경 후 ListView 업데이트

ListView 컨트롤에서 ListViewItem을 추가하거나 제거한 경우에는 대체 Background 색을 다시 만들기 위해 ListViewItem 컨트롤을 업데이트해야 합니다. 다음 예제에서는 ListViewItem 컨트롤을 업데이트하는 방법을 보여 줍니다.

ICollectionView dataView =
  CollectionViewSource.GetDefaultView(theListView.ItemsSource);
dataView.Refresh();

참고 항목

개념

ListView 개요

GridView 개요

참조

GridView

ListView

기타 리소스

ListView 샘플

ListView 방법 항목