Star sizing Grid columns in an ItemsControl?

Question

I have a ListBox with an ItemsControl bound to a collection in my view model. I'm trying to use star sizing on a grid column within the DataTemplate and set the element within that column (a progress bar) to stretch. This normally would take up all available horizontal space in the grid however nested in an ItemsControl this does not seem to be the case. I've done a bit of reading around & there seems to be known issues using these controls together. Is there a solution to this?

<ListBox>
    <ItemsControl ItemsSource="{Binding WebMappingSourcesCollection}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid 
                    ShowGridLines="True"
                    Grid.IsSharedSizeScope="true"
                    >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>

                    <CheckBox 
                        Grid.Column="0"
                        HorizontalAlignment="Center" />
                    <TextBlock 
                        Grid.Column="1" 
                        Text="{Binding Name}"/>
                    <ProgressBar Grid.Column="2"
                        Minimum="0" 
                        Maximum="100" 
                        Value="30"
                        HorizontalContentAlignment="Stretch"                                                           
                        HorizontalAlignment="Stretch"     
                        MaxHeight="15"
                    /> 
                    <!-- etc. etc. -->

Did you try `HorizontalContentAlignment="Stretch"` on your ListBox? — Chris W., Apr 04 '16 at 15:07
Yeah no luck unfortunately. Works fine outside of the ListBox — Hardgraf, Apr 04 '16 at 15:10
Same result when used on both parent ListBox and the ListBoxItem via a style setter in the ItemContainerStyle? — Chris W., Apr 04 '16 at 15:16
Chris W. is pointing you in the right direction. The default container for a Listbox is a StackPanel, which won't stretch unless you tell it to via the ListBox.ItemContainerStyle. — Mark W, Apr 04 '16 at 15:18
Possible duplicate of [ListBoxItem HorizontalContentAlignment To Stretch Across Full Width of ListBox](http://stackoverflow.com/questions/16616262/listboxitem-horizontalcontentalignment-to-stretch-across-full-width-of-listbox) — Chris W., Apr 04 '16 at 15:28

score 2 · Accepted Answer · answered Apr 04 '16 at 15:18

Try setting HorizontalContentAlignment on your listbox item by giving ItemContainerStyle like below.

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

Star sizing Grid columns in an ItemsControl?

1 Answers1