Compartir a través de


Cómo: Cambiar la alineación horizontal de una columna en un control ListView

Actualización: noviembre 2007

De forma predeterminada, el contenido de cada columna de un elemento ListViewItem está alineado a la izquierda. Para cambiar la alineación de cada columna, proporcione una DataTemplate y establezca la propiedad HorizontalAlignment del elemento dentro del objeto DataTemplate. En este tema se muestra cómo el control ListView alinea su contenido de forma predeterminada y cómo cambiar la alineación de una columna del control ListView.

Ejemplo

En el ejemplo siguiente, los datos de las columnas Title e ISBN se alinean a la izquierda.

<!--XmlDataProvider is defined in a ResourceDictionary, 
    such as Window.Resources-->
<XmlDataProvider x:Key="InventoryData" XPath="Books">
    <x:XData>
        <Books >
            <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>

Para cambiar la alineación de la columna ISBN, hay que especificar que la propiedad HorizontalContentAlignment de cada control ListViewItem es Stretch para que los elementos de cada control ListViewItem puedan abarcar el ancho completo de cada columna o situarse a lo largo de él. Como ListView está enlazado a un origen de datos, es preciso crear un estilo que establezca la propiedad HorizontalContentAlignment. A continuación, tiene que utilizar DataTemplate para mostrar el contenido, en lugar de utilizar la propiedad DisplayMemberBinding. Para mostrar el valor ISBN de cada plantilla, DataTemplate puede contener únicamente un control TextBlock cuya propiedad HorizontalAlignment esté establecida en Right.

En el ejemplo siguiente se define el estilo y el objeto DataTemplate necesarios para alinear a la derecha la columna ISBN y se cambia GridViewColumn de modo que haga referencia a 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>

Vea también

Tareas

Cómo: Enlazar a datos XML mediante XMLDataProvider y consultas XPath

Conceptos

Información general sobre el enlace de datos

Información general sobre plantillas de datos

Información general sobre ListView