Condividi tramite

Procedura: Modificare l'allineamento orizzontale di una colonna in un ListView

Per impostazione predefinita, il contenuto di ogni colonna in un ListViewItem è allineato a sinistra. È possibile modificare l'allineamento di ogni colonna specificando un DataTemplate e impostando la proprietà HorizontalAlignment sull'elemento all'interno dell'DataTemplate. In questo argomento viene illustrato come un ListView allinea il contenuto per impostazione predefinita e come modificare l'allineamento di una colonna in un ListView.

Esempio

Nell'esempio seguente i dati nelle colonne Title e ISBN sono allineati a sinistra.

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

Per modificare l'allineamento della colonna ISBN, è necessario specificare che la proprietà HorizontalContentAlignment di ogni ListViewItem è Stretch, in modo che gli elementi in ogni ListViewItem possano estendersi o essere posizionati lungo l'intera larghezza di ogni colonna. Poiché l'ListView è associato a un'origine dati, occorre creare uno stile che stabilisce l'HorizontalContentAlignment. Successivamente, è necessario usare un DataTemplate per visualizzare il contenuto anziché usare la proprietà DisplayMemberBinding. Per visualizzare la ISBN di ogni modello, il DataTemplate può contenere solo una TextBlock con la relativa proprietà HorizontalAlignment impostata su Right.

Nell'esempio seguente viene definito lo stile e DataTemplate necessario per rendere allineata a destra la colonna ISBN e viene modificato il GridViewColumn per fare riferimento all'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>

Vedere anche

  • Last updated on