xaml - listview wpf binding

¿Cómo obtener una plantilla de elementos de ListBox para estirar horizontalmente el ancho completo de ListBox?

Question

Quiero tener los ListItems para extender con su fondo naranja todo el ancho del cuadro de lista.

Actualmente solo son tan anchos como el Nombre + Apellido.

He establecido todos los elementos que puedo para: HorizontalAlignment = "Stretch".

Quiero que el fondo de ListboxItems se expanda a medida que el usuario amplía el cuadro de lista, por lo que no quiero poner valores absolutos.

¿Qué tengo que hacer para que el color de fondo del ListBoxItems llene 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>

Answer 1

Dado que el borde se usa solo para la apariencia visual, puede colocarlo en la plantilla de control del ListBoxItem y modificar las propiedades allí. En ItemTemplate, solo puede colocar StackPanel y TextBlock. De esta manera, el código también permanece limpio, ya que en la apariencia del control se controlará a través de la Plantilla de Control y los datos que se mostrarán se controlarán a través de la Plantilla de Datos.

Answer 2

Encontré otra solución aquí , ya que encontré 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í.

Answer 3

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

Agregue HorizontalContentAlignment="Stretch" a su ListBox. Eso debería hacer el truco. Solo tenga cuidado con la función de autocompletar porque es muy fácil obtener la HorizontalAlignment por error.

Answer 4

La solución para mí fue establecer la propiedad HorizontalAlignment="Stretch" en ItemsPresenter dentro de ScrollViewe r ..

Espero que esto ayude a alguien...

<Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListBox">
                    <ScrollViewer x:Name="ScrollViewer" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Foreground="{TemplateBinding Foreground}" Padding="{TemplateBinding Padding}" HorizontalAlignment="Stretch">
                        <ItemsPresenter  Height="252" HorizontalAlignment="Stretch"/>
                    </ScrollViewer>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

Answer 5

Si sus elementos son más anchos que el ListBox , las otras respuestas aquí no serán de ayuda: los elementos en el ItemTemplate siguen 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 que todos esos elementos permanezcan tan anchos como el cuadro de lista.

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

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

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

Answer 6

También tuve el mismo problema, como una solución rápida, utilicé la combinación para determinar cuánto relleno se estaba agregando. En mi caso era 12, así que usé un margen negativo para deshacerme de él. Ahora todo puede estar centrado correctamente.