ScrollViewer changes Size of Content(ItemControl) instead of showing a scrollbar

Question

I have a WPF UserControl containing an ItemsControl with a Horizontal StackPanel as ItemsPanel (Basically some kind of the WinRT Hub Control). And the content extends the Size of the UserControl

If I try to add a ScrollViewer around my ItemsControl, the ScrollViewer shrinks the ItemsControl so all Items fit into the UserControl bounds.

Thats somehow exactly the opposite of what i expected can anybody tell me why the scrollviewer behaves this way?

Here is my UserControl:

<UserControl x:Class="ContentModule.ContentView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d"
             xmlns:contentModule="clr-namespace:ContentModule"
             xmlns:regions="http://www.codeplex.com/CompositeWPF"
             xmlns:statics="clr-namespace:Infrastructure.Statics;assembly=Infrastructure"
             d:DesignHeight="300" d:DesignWidth="300" d:DataContext="{d:DesignInstance contentModule:ContentViewModel}"
             VerticalAlignment="Top" HorizontalAlignment="Left">
        <ItemsControl regions:RegionManager.RegionName="{x:Static statics:ContentRegions.ContentCollection}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
</UserControl>

The Items are injected via Prism RegionManager.

EDIT1:

The UserControl is getting Injected into my MainForm. It is assigned to the ContrentControl => ShellRegions.Content (the third one)

  <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <ContentControl Grid.Row="0" cal:RegionManager.RegionName="{x:Static statics:ShellRegions.MainMenu}" />
        <ItemsControl Grid.Row="1" cal:RegionManager.RegionName="{x:Static statics:ShellRegions.NavigationBar}" />
        <ContentControl Grid.Row="2" cal:RegionManager.RegionName="{x:Static statics:ShellRegions.Content}" />
    </Grid>

EDIT 2: Some more details.

The ItemsControl looks like : (Gray is the UserControl, Orange are the items in the ItemsControl) The Content scales when changing the bounds of the Form/UserControl as expected but the ItemsControl does not show a ScrollBar. If i add a ScrollViewer the Content does not scale with changing bounds anymore and is Vertically scrollable instead of horizontal, or it does change the width of the items to fit the UserControll depending on the ScrollBar properties.

But i can't get it working to keep the scaling and add a scroll bar to the bottom of the ItemsControl.

Answer 1

After a day full of research i found a working solution:

<ItemsControl regions:RegionManager.RegionName="{x:Static statics:ContentRegions.ContentCollection}">
            <ItemsControl.Template>
                <ControlTemplate>
                    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled">
                        <ItemsPresenter/>
                    </ScrollViewer>
                </ControlTemplate>
            </ItemsControl.Template>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>

Answer 2

You can try doing following:

Wrap your control in a ScrollViewer and set CanContentScrol property to TRUE.

Futhermore change the Panel of your ItemsControl to VirtualizingStackPanel.

    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

Tell us whether it worked or what kind of new issues those changes will bring up.