다음을 통해 공유

방법: ListView에 있는 열의 가로 맞춤 변경

  • 아티클

기본적으로 ListViewItem의 각 열 콘텐츠는 왼쪽에 정렬됩니다. DataTemplate을 제공하고 DataTemplate 내 요소의 HorizontalAlignment 속성을 설정하여 각 열의 맞춤을 변경할 수 있습니다. 이 항목에서는 ListView가 기본적으로 해당 콘텐츠를 정렬하는 방법과 ListView의 한 열 맞춤을 변경하는 방법을 보여 줍니다.

예제

다음 예제에서는 Title 열과 ISBN 열의 데이터가 왼쪽에 맞춰집니다.

<!--XmlDataProvider is defined in a ResourceDictionary, 
    such as Window.Resources-->
<XmlDataProvider x:Key="InventoryData" XPath="Books">
    <x:XData>
        <Books xmlns="">
            <Book ISBN="0-7356-0562-9" Stock="in" Number="9">
                <Title>XML in Action</Title>
                <Summary>XML Web Technology</Summary>
            </Book>
            <Book ISBN="0-7356-1370-2" Stock="in" Number="8">
                <Title>Programming Microsoft Windows With C#</Title>
                <Summary>C# Programming using the .NET Framework</Summary>
            </Book>
            <Book ISBN="0-7356-1288-9" Stock="out" Number="7">
                <Title>Inside C#</Title>
                <Summary>C# Language Programming</Summary>
            </Book>
            <Book ISBN="0-7356-1377-X" Stock="in" Number="5">
                <Title>Introducing Microsoft .NET</Title>
                <Summary>Overview of .NET Technology</Summary>
            </Book>
            <Book ISBN="0-7356-1448-2" Stock="out" Number="4">
                <Title>Microsoft C# Language Specifications</Title>
                <Summary>The C# language definition</Summary>
            </Book>
        </Books>
    </x:XData>
</XmlDataProvider>

<ListView ItemsSource="{Binding Source={StaticResource InventoryData}, XPath=Book}">
    <ListView.View>
        <GridView>
            <GridViewColumn Width="300" Header="Title" 
                            DisplayMemberBinding="{Binding XPath=Title}"/>
            <GridViewColumn Width="150" Header="ISBN" 
                            DisplayMemberBinding="{Binding XPath=@ISBN}"/>
        </GridView>
    </ListView.View>
</ListView>

ISBN 열의 정렬을 변경하려면 각 ListViewItem의 HorizontalContentAlignment 속성을 Stretch로 지정하여 각 ListViewItem의 요소가 각 열의 전체 너비를 따라 확장되거나 배치될 수 있도록 해야 합니다. ListView가 데이터 원본에 바인딩되므로 HorizontalContentAlignment를 설정하는 스타일을 만들어야 합니다. 다음으로, DisplayMemberBinding 속성을 사용하는 대신 DataTemplate을 사용하여 콘텐츠를 표시해야 합니다. 각 템플릿의 ISBN을 표시하려면 DataTemplate에 HorizontalAlignment 속성이 Right로 설정된 TextBlock만 포함할 수 있습니다.

다음 예제에서는 ISBN 열을 오른쪽 맞춤으로 만드는 데 필요한 스타일 및 DataTemplate을 정의하고 DataTemplate을 참조하도록 GridViewColumn을 변경합니다.

<!--The Style and DataTemplate are defined in a ResourceDictionary, 
    such as Window.Resources-->
<Style TargetType="ListViewItem">
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
</Style>

<DataTemplate x:Key="ISBNTemplate">
    <TextBlock HorizontalAlignment="Right" 
               Text="{Binding XPath=@ISBN}"/>
</DataTemplate>

<ListView ItemsSource="{Binding Source={StaticResource InventoryData}, XPath=Book}">
    <ListView.View>
        <GridView>
            <GridViewColumn Width="300" Header="Title" 
                            DisplayMemberBinding="{Binding XPath=Title}"/>
            <GridViewColumn Width="150" Header="ISBN" 
                            CellTemplate="{StaticResource ISBNTemplate}"/>
        </GridView>
    </ListView.View>
</ListView>

참고 항목