Wpf – Make a ListBox Fill the Width of the Parent Container

listboxwpfwpf-controls

I have a DockPanel with a listbox in it. The dockpanel successfully fills the width of the entire window. Now, i want the Listbox to fill the width of the entire DockPanel.

I have tried many things… including wrapping a grid around it and setting the column to width of *, setting the horizontalalignment of the listbox to stretch, and numerous others. I cannot seem to get this silly listbox to fill the width.

This listbox DOES have an ItemTemplate, but everything inside it has a horizontal alignment of stretch with auto width. Whenever you set the ItemTemplate's width to something static, the listbox does resize appropriately. I just cannot get it to fill the parent.

Thanks.

EDIT:

Thanks guys for making me realize it's my fault… Turns out it was a goof in the style Tag.

I will attempt to remove this question now.

Best Answer

I would bet that your ListBox is filling the width of its parent container, but the ListBoxItems within your list box are not stretching horizontally. Try adding the following style:

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

Related Solutions

Wpf – How to make an item in a toolbar fill all available space in WPF

Unfortunately it looks like the default ControlTemplate for ToolBar doesn't use an ItemsPresenter, it uses a ToolBarPanel, so setting ToolBar.ItemsPanel won't have any effect.

ToolBarPanel inherits from StackPanel. By default its Orientation is bound to the parent ToolBar.Orientation, but you can override this and set its Orientation to Vertical with a Style and this will allow items to stretch horizontally:

<DockPanel>
    <ToolBar DockPanel.Dock="Top">
        <ToolBar.Resources>
            <Style TargetType="{x:Type ToolBarPanel}">
                <Setter Property="Orientation" Value="Vertical"/>
            </Style>
        </ToolBar.Resources>
        <ComboBox HorizontalAlignment="Stretch" SelectedIndex="0">
            <ComboBoxItem>A B C</ComboBoxItem>
            <ComboBoxItem>1 2 3</ComboBoxItem>
            <ComboBoxItem>Do Re Mi</ComboBoxItem>
        </ComboBox>
    </ToolBar>
    <Border Margin="10" BorderBrush="Yellow" BorderThickness="3"/>
</DockPanel>

You can then use a Grid or something in place of the ComboBox above if you want multiple items on a line.

.net – Stretch ListBox Items hit area to full width of the ListBox? ListBox style is set implicity through a theme

HorizontalContentAlignment="Stretch" should be set in ItemContainerStyle for this to work.

Xaml Example

<ListBox xmlns:sys="clr-namespace:System;assembly=mscorlib">
    <ListBox.ItemsSource>
        <x:Array Type="{x:Type sys:String}">
            <sys:String>String 1</sys:String>
            <sys:String>String 2</sys:String>
            <sys:String>String 3</sys:String>
            <sys:String>String 4</sys:String>
        </x:Array>
    </ListBox.ItemsSource>
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
        </Style>
    </ListBox.ItemContainerStyle>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding}" Background="Green"/>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Update
Try this

<ListBox ...>
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ListBoxItem}}">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
        </Style>
    </ListBox.ItemContainerStyle>

Best Answer

Related Solutions

Wpf – How to make an item in a toolbar fill all available space in WPF

.net – Stretch ListBox Items hit area to full width of the ListBox? ListBox style is set implicity through a theme

Related Topic