[WPF] DataGrid Row Num Column 추가하기

DataGrid를 사용할 떄, 데이터의 Row Num을 표시하고 싶을 때가 있다. 데이터에 Index 값이 있으면 바로 바인딩 처리하면되지만 해당 칼럼데이터가 없다면 Item과 ItemsSource를 IMultiValueConverter으로 바인딩하여 Index를 알아내는 방법으로 표현 가능하다.

 

// DataGrid에 바인딩할 데이터 클레스 선언
public class GridData
{
    public string Data { get; set; }
}

Converter 선언

public class RowNumberConverter : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
    {
    	// DataGrid에 현재 Item을 첫 번째 바인딩 파라미터로 넣는다.
        var row = values[0] as GridData;
        // DataGrid에 바인딩된 ItemsSource를 두 번째 바인딩 파라미터로 넣는다.
        var rowList = values[1] as List<GridData>;
        
        // ItemsSource에서 현재 Item의 위치를 IndexOf를 통해 얻어 내고 그것을 반환해준다.
        return rowList.IndexOf(row).ToString();
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Xaml 부분

<DataGrid AutoGenerateColumns="False"
            ItemsSource="{Binding GridDataList}">
    <DataGrid.Resources>
        <converter:RowNumberConverter x:Key="rowNumConverter"/>
    </DataGrid.Resources>
    <DataGrid.Columns>
        <DataGridTextColumn Header="idx" Width="Auto">
            <DataGridTextColumn.Binding>
                <MultiBinding Converter="{StaticResource rowNumConverter}">
                    <!-- 현재 Item을 바인딩한다 -->
                    <Binding />
                    <!-- ItemsSource를 바인딩한다 -->
                    <Binding RelativeSource="{RelativeSource AncestorType={x:Type DataGrid}}"
                                Path="ItemsSource"/>
                </MultiBinding>
            </DataGridTextColumn.Binding>
        </DataGridTextColumn>
        <DataGridTextColumn Header="Data" IsReadOnly="True" Width="*" Binding="{Binding Data}"/>
    </DataGrid.Columns>
</DataGrid>