Udostępnij za pośrednictwem

Jak zmienić wyrównanie w poziomie kolumny w ListView

  • Artykuł

Domyślnie zawartość każdej kolumny w obiekcie ListViewItem jest wyrównana do lewej. Wyrównanie każdej kolumny można zmienić, podając DataTemplate właściwość i HorizontalAlignment dla elementu w elemecie DataTemplate. W tym temacie pokazano, jak ListView domyślnie wyrównana jest jego zawartość i jak zmienić wyrównanie jednej kolumny w obiekcie ListView.

Przykład

W poniższym przykładzie dane w kolumnach Title i ISBN są wyrównane do lewej.

<!--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>

Aby zmienić wyrównanie ISBN kolumny, należy określić, że HorizontalContentAlignment właściwość każdego ListViewItem z nich to Stretch, aby elementy w każdej ListViewItem kolumnie mogły obejmować lub być rozmieszczone wzdłuż całej szerokości każdej kolumny. Ponieważ element ListView jest powiązany ze źródłem danych, należy utworzyć styl ustawiający element HorizontalContentAlignment. Następnie należy użyć elementu , DataTemplate aby wyświetlić zawartość zamiast używać DisplayMemberBinding właściwości . Aby wyświetlić ISBN każdy szablon, DataTemplate element może zawierać tylko właściwość , która ma właściwość HorizontalAlignment ustawioną TextBlock na Rightwartość .

Poniższy przykład definiuje styl i DataTemplate jest niezbędny do wyrównania ISBN kolumny do prawej, a następnie zmienia element GridViewColumn , aby odwoływać się do elementu DataTemplate.

<!--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>

Zobacz też