¿Cómo hacer que un ListBox ItemTemplate se estire horizontalmente en todo el ancho del ListBox?

Resuelto Edward Tanguay asked hace 15 años • 6 respuestas

Quiero que ListItems extienda con su fondo naranja todo el ancho del Listbox.

Actualmente, son tan anchos como Nombre + Apellido.

He configurado todos los elementos que puedo en: HorizontalAlignment="Stretch".

Quiero que el fondo de ListboxItems se expanda a medida que el usuario estira el Listbox, por lo que no quiero poner valores absolutos.

¿Qué tengo que hacer para que el color de fondo de los ListBoxItems ocupe el ancho del ListBox?

<Window x:Class="TestListBoxSelectedItemStyle.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:TestListBoxSelectedItemStyle"
    Title="Window1" Height="300" Width="300">

    <Window.Resources>
        <local:CustomerViewModel x:Key="TheDataProvider"/>

        <DataTemplate x:Key="CustomerItemTemplate">
            <Border CornerRadius="5" Background="Orange" HorizontalAlignment="Stretch" Padding="5" Margin="3">
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" Width="Auto">
                    <TextBlock HorizontalAlignment="Stretch">
                    <TextBlock.Text>
                        <MultiBinding StringFormat="{}{0} {1}">
                            <Binding Path="FirstName"/>
                            <Binding Path="LastName"/>
                        </MultiBinding>
                    </TextBlock.Text>
                    </TextBlock>
                </StackPanel>
            </Border>
        </DataTemplate>

    </Window.Resources>

    <Grid>
        <ListBox ItemsSource="{Binding Path=GetAllCustomers, Source={StaticResource TheDataProvider}}"
                 ItemTemplate="{StaticResource CustomerItemTemplate}"/>
    </Grid>
</Window>
Edward Tanguay avatar May 08 '09 15:05 Edward Tanguay
Aceptado

Encontré otra solución aquí , ya que me encontré con ambas publicaciones...

Esto es de la respuesta de Myles:

<ListBox.ItemContainerStyle> 
    <Style TargetType="ListBoxItem"> 
        <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter> 
    </Style> 
</ListBox.ItemContainerStyle> 

Esto funcionó para mí.

Gabriel Mongeon avatar May 27 '2010 19:05 Gabriel Mongeon

Estoy seguro de que es un duplicado, pero no encuentro una pregunta con la misma respuesta.

Agregue HorizontalContentAlignment="Stretch"a su ListBox. Eso debería hacer el truco. Sólo tenga cuidado con el autocompletado porque es muy fácil cometerlo HorizontalAlignmentpor error.

Matt Hamilton avatar May 08 '2009 08:05 Matt Hamilton

Si sus artículos son más anchos que el ListBox, las otras respuestas aquí no ayudarán: los artículos en el ItemTemplatesiguen siendo más anchos que el ListBox.

La solución que funcionó para mí fue deshabilitar la barra de desplazamiento horizontal, que, aparentemente, también le dice al contenedor de todos esos elementos que permanezca tan ancho como el cuadro de lista.

Por lo tanto, la solución combinada para obtener elementos de ListBox que sean tan anchos como el cuadro de lista, ya sean más pequeños y necesiten estirarse, o más anchos y necesiten ajustarse, es la siguiente:

<ListBox HorizontalContentAlignment="Stretch" 
         ScrollViewer.HorizontalScrollBarVisibility="Disabled">

( créditos por la idea de la barra de desplazamiento )

Roman Starkov avatar Aug 23 '2012 16:08 Roman Starkov