Как получить ListBox ItemTemplate, чтобы растянуть горизонтально на всю ширину ListBox?

Question

Я хочу, чтобы ListItems расширяли своим оранжевым фоном всю ширину списка.

В настоящее время они имеют такую ​​же ширину, как FirstName + LastName.

Я установил каждый элемент, который могу: HorizontalAlignment="Stretch".

Я хочу, чтобы фон ListboxItems расширялся по мере того, как пользователь растягивал Listbox, поэтому я не хочу вводить абсолютные значения.

Что мне нужно сделать, чтобы цвет фона ListBoxItems заполнил ширину 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

Я уверен, что это дубликат, но я не могу найти вопрос с тем же ответом.

добавлять HorizontalContentAlignment="Stretch" в ваш список. Это должно делать свое дело. Просто будьте осторожны с автозаполнением, потому что это так легко получить HorizontalAlignment по ошибке.

Answer 2

Я нашел другое решение здесь, так как наткнулся на оба поста...

Это из ответа Майлза:

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

Это сработало для меня.

Answer 3

Если ваши предметы шире, чем ListBoxдругие ответы здесь не помогут: элементы в ItemTemplate остаются шире, чем ListBox,

Исправление, которое работало для меня, состояло в том, чтобы отключить горизонтальную полосу прокрутки, которая, по-видимому, также сообщает контейнеру всех этих элементов, чтобы они оставались такими же широкими, как список.

Следовательно, комбинированное исправление для получения элементов ListBox, которые имеют ширину со списком, независимо от того, являются ли они меньше и нуждаются в растяжении или шире и нуждаются в переносе, заключаются в следующем:

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

( кредиты за идею полосы прокрутки)

Answer 4

Поскольку граница используется только для визуального отображения, вы можете поместить ее в ControlTemplate объекта ListBoxItem и изменить там свойства. В ItemTemplate вы можете разместить только StackPanel и TextBlock. Таким образом, код также остается чистым, так как внешний вид элемента управления будет контролироваться через ControlTemplate, а отображаемые данные будут контролироваться через DataTemplate.

Answer 5

У меня также была та же проблема, поскольку в качестве быстрого обходного пути я использовал blend, чтобы определить, сколько отступов было добавлено. В моем случае это было 12, поэтому я использовал отрицательный запас, чтобы избавиться от него. Теперь все теперь может быть правильно отцентрировано

Answer 6

Исправление для меня было установить свойство HorizontalAlignment="Stretch" на ItemsPresenter внутри ScrollVieweр..

Надеюсь, это поможет кому-то...

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