Getting a scrollviewer to stretch until maxwidth

Question

I have a scrollviewer which isn't stretching to fit its content up until maxwidth. Currently, it sets the width to the MinWidth value... and that's about it.

This is the code I'm using, I've tried both with and without HorizontalAlignment="Stretch".

<Border BorderBrush="#5D5D5D" BorderThickness="5" Padding="0" Height="75"  Background="White">
    <ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Disabled" MaxWidth="800" MinWidth="200" HorizontalAlignment="Stretch">
        <ItemsControl ItemsSource="{Binding People}" >
        </ItemsControl>
    </ScrollViewer>
</Border>

@ChrisW. Thanks for the suggestion, but I'm afraid it doesn't work. — Halaster
Share more of your layout or a generic one to reproduce the issue, your culprit likely lies in your layout elsewhere. — Chris W.
That actually is a generic one I made on a separate blank project to try to isolate the issue. That inside a blank page, filling the itemscontrol with textblocks is enough to reproduce the issue. — Halaster
So that's the only thing on a new page? Is the Border and ScrollViewer like that? Interesting, Throw it in a panel like a Grid and see what's actually not stretching, the Border, the ScrollViewer, or the ItemsControl. Your HorizontalContentAlignment may be on the wrong thing. — Chris W.

Mike Strobel Mike Strobel · Accepted Answer · 2014-11-06T17:07:19

Everything looks fine to me, except that the Border isn't constrained by the MaxWidth of the ScrollViewer, so the ScrollViewer becomes centered within the wider Border once the available width exceeds 800.

Try moving MinWidth and MaxWidth to the Border.

This is what the result looks like for me, with the MaxWidth reduced to 400 for a smaller screenshot:

Screenshot

As you can see, the Border will grow horizontally up to MaxWidth. When the window is shrunken, the Border will be reduced in width until it hits 200.

I added the ItemTemplate so you could see the bounds of the items within the ItemsControl; the sizing behavior is unchanged if you comment it out.

Getting a scrollviewer to stretch until maxwidth

1 Answers