ScrollViewer.CanContentScroll not scrolling ItemsControl item by item - wpf

I have an ItemControl on a ScrollViewer. I want to scroll item by item, now is scrolling pixel by pixel.
<ScrollViewer Height="299" Margin="10,10,0,0"
HorizontalScrollBarVisibility="Visible" x:Name="Scroll"
VerticalAlignment="Top"
Grid.Column="0" Grid.Row="1"
PanningMode="HorizontalOnly"
CanContentScroll="True">
<ItemsControl ItemsSource="{Binding RelativeSource={RelativeSource AncestorType=Window}, Path=Items, Mode=OneWay}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border Width="175" Height="64" Margin="0,0,16,16" HorizontalAlignment="Center" Focusable="False">
<TextBlock Text="{Binding}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>

Just set this property on ListBox:
VirtualizingStackPanel.ScrollUnit ="Item"
Another mode is "Pixel", which is default mode.

I found a solution
<ItemsControl ItemsSource="{Binding TypeHeaders}"
x:Name="ActivityItemsControl"
Grid.Column="0" Grid.Row="1">
<ItemsControl.Template>
<ControlTemplate>
<ScrollViewer HorizontalScrollBarVisibility="Hidden"
VerticalScrollBarVisibility="Visible"
CanContentScroll="True"
x:Name="ActivityScrollViewer">
<ItemsPresenter/>
<i:Interaction.Triggers>
<i:EventTrigger EventName="ScrollChanged">
<cmd:EventToCommand PassEventArgsToCommand="True"
Command="{Binding RelativeSource={RelativeSource AncestorType={x:Type Grid}}, Path=DataContext.VmCommands.ActivityScrollChangedCommand}" />
</i:EventTrigger>
</i:Interaction.Triggers>
</ScrollViewer>
</ControlTemplate>
</ItemsControl.Template>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Button Content="{Binding Description}" Style="{DynamicResource ZoneTypeHeaderButtonStyle}"
Command="{Binding RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}, Path=DataContext.VmCommands.ZoneOverviewControlTypeHeaderClickedCommand}"
CommandParameter="{Binding}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>

You can use ListBox instead of ScrollViewer. I thought you did not want to have a selection style so I changed it.
<ListView ScrollViewer.CanContentScroll="True"
ScrollViewer.VerticalScrollBarVisibility="Hidden"
ScrollViewer.PanningMode="HorizontalOnly"
ScrollViewer.HorizontalScrollBarVisibility="Visible"
ItemsSource="{Binding RelativeSource={RelativeSource AncestorType=Window}, Path=Items, Mode=OneWay}">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemContainerStyle>
<Style TargetType="{x:Type ListViewItem}">
<Setter Property="Background" Value="Transparent" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListViewItem}">
<ContentPresenter />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate>
<Border Width="175" Height="64" Margin="0,0,16,16" HorizontalAlignment="Center" Focusable="False">
<TextBlock Text="{Binding }" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

Related

How could I fill the available space with a ItemsControl and and UniformGrid?

I want to use a ItemsControl with a uniform template, to have 4 rows and 3 columns. And I want to fill all the available space, so if I change the size of the window, it should fill all the space.
My ItemsControl is this:
<Viewbox Stretch="UniformToFill" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Grid.Row="1">
<ItemsControl Background="Yellow" Name="icCalendarios" ItemsSource="{Binding Calendarios}" Margin="0,0,30,0" HorizontalAlignment="Center" VerticalAlignment="Stretch" Grid.Row="1">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Rows="4" Columns="3" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<myControls:MyControl VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Viewbox>
This my Control:
<DockPanel>
<Viewbox Name="vbReescalado" Height="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="0,0,0,0" Stretch="UniformToFill"
Width="{Binding ElementName=MesConEventos, Path=WidthReescalado}">
<DockPanel>
<TextBlock Text="{Binding Date}" />
<Grid Height="30" DockPanel.Dock="Top">
<TextBox Foreground="Black" Name="txtEncabezado" FontSize="12"
BorderBrush="Transparent" BorderThickness="0" Background="Transparent"
VerticalAlignment="Center" TextAlignment="Center" HorizontalAlignment="Stretch"
Padding="25,0,0,0"
Text="{Binding Encabezado}"/>
</Grid>
<ItemsControl ItemsSource="{Binding NombresDias}" DockPanel.Dock="Top" Grid.Column="1">
<ItemsControl.ItemTemplate>
<DataTemplate>
<TextBlock TextAlignment="Center" Text="{Binding}" FontSize="8"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Rows="1" Columns="8" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
<ItemsControl ItemsSource="{Binding Dias}" Grid.Column="1" Margin="0,0,0,0">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border BorderThickness="0.25" Padding="0,0,0,0" Margin="0,0,0,0"
BorderBrush="{Binding Converter={StaticResource ColorRecuadroDiaConverter}}"
Width="25" Height="25">
<Border Name="InnerBorder" Background="{Binding ColorDia}" BorderBrush="{Binding Path=ColorRecuadroExterno}" BorderThickness="{Binding Path=GrosorRecuadroExterno}" Padding="0,0,0,0" Margin="0,0,0,0">
<DockPanel>
<!--Número de día.-->
<StackPanel Orientation="Horizontal" DockPanel.Dock="Top" FlowDirection="RightToLeft">
<TextBox TextAlignment="Center" BorderBrush="Transparent" Background="Transparent" Text="{Binding Path=., Converter={StaticResource DateConverter}}" FontSize="5" Margin="0,0,0,0" Padding="0,0,0,0">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsTargetMonth}" Value="false">
<Setter Property="TextBlock.Foreground" Value="Gray"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
</StackPanel>
<TextBox IsEnabled="{Binding IsEnabled}" FontSize="2.5" Height="18" AcceptsReturn="True" TextWrapping="Wrap" BorderThickness="0" ScrollViewer.VerticalScrollBarVisibility="Disabled"
Background="{x:Null}"
Foreground="{Binding Path=ColorTexto}"
Text="{Binding Path=Notes}"/>
</DockPanel>
</Border>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Rows="6" Columns="8" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</DockPanel>
</Viewbox>
</DockPanel>
But in this case MyControl doesn't adjust to parent, I have to set a size manually because if not, it is not shown.
How could adjust the month to the available space?
Thanks.
UniformGrid always measures its content with auto size unless fixed size is set, so it will be difficult to achieve this behavior. If you have a fixed numbers of rows and columns, I would use Grid instead. The tricky part is dynamically setting Grid.Row and Grid.Column. Here is a very simple test with Style binding:
<ItemsControl x:Name="cntrl">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
</Grid>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemContainerStyle>
<Style>
<Setter Property="Grid.Row" Value="{Binding Row}" />
<Setter Property="Grid.Column" Value="{Binding Col}" />
</Style>
</ItemsControl.ItemContainerStyle>
</ItemsControl>
And this is the sample data:
cntrl.ItemsSource = Enumerable.Range(0, 12).Select(s => new { Row = s % 3, Col = s % 4});

Distribute Labels evenly in certain space [duplicate]

I have an ItemsControl, the ItemsPanel is made by a DockPanel.
Inside of the DockPanel, I can have one, two, or three buttons. The problem arises from the width of the buttons: I want the three elements with the same size, but the elements take the size that they need (the last element take the excess width because LastChildFill is true).
Can I give the buttons the same width without providing their size manually?
<ItemsControl ItemTemplate="{StaticResource Template1}" ItemsSource="{Binding Path=options, Mode=OneWay}" ItemsPanel="{StaticResource Panel1}" HorizontalContentAlignment="Stretch"/>
<ItemsPanelTemplate x:Key="Panel1">
<DockPanel Height="Auto" Width="Auto" LastChildFill="True"/>
</ItemsPanelTemplate>
<DataTemplate x:Key="BasicasTemplateOpciones" DataType="{x:Type local:MyOption}">
<Grid HorizontalAlignment="Stretch">
<Button DataContext="{Binding}" HorizontalContentAlignment="Stretch" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Button.Template>
<ControlTemplate TargetType="{x:Type Button}">
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Center">
<StackPanel Orientation="Horizontal">
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Stretch"/>
<TextBlock HorizontalAlignment="Right" VerticalAlignment="Stretch"/>
</StackPanel>
</Grid>
</ControlTemplate>
</Button.Template>
</Button>
</Grid>
</DataTemplate>
A UniformGrid with a single row will do what you want:
<ItemsPanelTemplate x:Key="Panel1">
<UniformGrid Rows="1" />
</ItemsPanelTemplate>
Example:
<StackPanel Orientation="Vertical">
<StackPanel.Resources>
<ItemsPanelTemplate x:Key="Panel1">
<UniformGrid Rows="1" />
</ItemsPanelTemplate>
<Style TargetType="ItemsControl" x:Key="ICStyle">
<Style.Resources>
<Style TargetType="Button">
<Setter Property="Margin" Value="2" />
</Style>
</Style.Resources>
<Setter Property="ItemsPanel" Value="{StaticResource Panel1}" />
</Style>
</StackPanel.Resources>
<ItemsControl Style="{StaticResource ICStyle}">
<Button>Foo</Button>
</ItemsControl>
<ItemsControl Style="{StaticResource ICStyle}">
<Button>Foo</Button>
<Button>Bar</Button>
</ItemsControl>
<ItemsControl Style="{StaticResource ICStyle}">
<Button>Foo</Button>
<Button>Bar</Button>
<Button>Baz</Button>
</ItemsControl>
</StackPanel>

Fill all available space in ItemsComtrol with same width size of elements

I have an ItemsControl, the ItemsPanel is made by a DockPanel.
Inside of the DockPanel, I can have one, two, or three buttons. The problem arises from the width of the buttons: I want the three elements with the same size, but the elements take the size that they need (the last element take the excess width because LastChildFill is true).
Can I give the buttons the same width without providing their size manually?
<ItemsControl ItemTemplate="{StaticResource Template1}" ItemsSource="{Binding Path=options, Mode=OneWay}" ItemsPanel="{StaticResource Panel1}" HorizontalContentAlignment="Stretch"/>
<ItemsPanelTemplate x:Key="Panel1">
<DockPanel Height="Auto" Width="Auto" LastChildFill="True"/>
</ItemsPanelTemplate>
<DataTemplate x:Key="BasicasTemplateOpciones" DataType="{x:Type local:MyOption}">
<Grid HorizontalAlignment="Stretch">
<Button DataContext="{Binding}" HorizontalContentAlignment="Stretch" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Button.Template>
<ControlTemplate TargetType="{x:Type Button}">
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Center">
<StackPanel Orientation="Horizontal">
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Stretch"/>
<TextBlock HorizontalAlignment="Right" VerticalAlignment="Stretch"/>
</StackPanel>
</Grid>
</ControlTemplate>
</Button.Template>
</Button>
</Grid>
</DataTemplate>
A UniformGrid with a single row will do what you want:
<ItemsPanelTemplate x:Key="Panel1">
<UniformGrid Rows="1" />
</ItemsPanelTemplate>
Example:
<StackPanel Orientation="Vertical">
<StackPanel.Resources>
<ItemsPanelTemplate x:Key="Panel1">
<UniformGrid Rows="1" />
</ItemsPanelTemplate>
<Style TargetType="ItemsControl" x:Key="ICStyle">
<Style.Resources>
<Style TargetType="Button">
<Setter Property="Margin" Value="2" />
</Style>
</Style.Resources>
<Setter Property="ItemsPanel" Value="{StaticResource Panel1}" />
</Style>
</StackPanel.Resources>
<ItemsControl Style="{StaticResource ICStyle}">
<Button>Foo</Button>
</ItemsControl>
<ItemsControl Style="{StaticResource ICStyle}">
<Button>Foo</Button>
<Button>Bar</Button>
</ItemsControl>
<ItemsControl Style="{StaticResource ICStyle}">
<Button>Foo</Button>
<Button>Bar</Button>
<Button>Baz</Button>
</ItemsControl>
</StackPanel>

Arranging ListView items Horizontally

I am working with a ListView which is grouped on one of the properties (Resource) of Data Source. My requirement is to display each group aligned horizontally with other groups but my implementation (as below) shows the groups aligned veritcally
<ListView x:Name="listViewResourceHours" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="0" SelectionMode="Single" Height="100" Width="300" >
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="GroupItem">
<StackPanel Orientation="Horizontal">
<ContentPresenter/>
<ItemsPresenter/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Label VerticalAlignment="Center" Margin="0" Content="{Binding Hours}" />
<Label VerticalAlignment="Center" Margin="2,0,0,0" Content="{Binding WorkingHoursType, Converter={StaticResource ResourceKey=hoursTypeConverter}}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Here is a sample of what this code results:
PSE: 0 (B) 0 (NB)
PSC: 0 (B) 0 (NB)
PM: 0 (B) 0 (NB)
EIA: 0 (B) 0 (NB)
Here is a sample of what I actually want it to look like
PSE: 0 (B) 0 (NB) PSC: 0 (B) 0 (NB) PM: 0 (B) 0 (NB) EIA: 0 (B) 0 (NB)
Any help appreciated.
In this case you should define the Panel for Group as well like:
<GroupStyle.Panel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</GroupStyle.Panel>
After the mod your xaml looks like:
<ListView x:Name="listViewResourceHours" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="0" SelectionMode="Single" Height="100" Width="300" >
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</GroupStyle.Panel>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="GroupItem">
<StackPanel Orientation="Horizontal">
<ContentPresenter/>
<ItemsPresenter/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Label VerticalAlignment="Center" Margin="0" Content="{Binding Hours}" />
<Label VerticalAlignment="Center" Margin="2,0,0,0" Content="{Binding WorkingHoursType}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
The correct way to do it, is:
<ListView Grid.Row="4" Name="btView">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"></StackPanel>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<RadioButton Name="Octave1" Content="Octave 1"/>
<RadioButton Name="Octave2" Content="Octave 2"/>
<RadioButton Name="Octave3" Content="Octave 3"/>
<RadioButton Name="Octave4" Content="Octave 4"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
<ListItem/>
</ListView>
Here is the final code after following gaurawerma
<ListView x:Name="listViewResourceHours" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="0" SelectionMode="Single" Height="100" Width="500" >
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</GroupStyle.Panel>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<TextBlock FontWeight="Bold" Text="{Binding Name, StringFormat={}{0}:}" />
</DataTemplate>
</GroupStyle.HeaderTemplate>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="GroupItem">
<StackPanel Orientation="Horizontal">
<ContentPresenter Margin="0,0,0,0" VerticalAlignment="Center" />
<ItemsPresenter Margin="0,0,0,0" VerticalAlignment="Center"/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center" >
<Label VerticalAlignment="Center" Margin="0" Content="{Binding Hours}" />
<Label Name="lblWorkingHours" VerticalAlignment="Center" Margin="0,0,0,0" Content="{Binding WorkingHoursType, Converter={StaticResource ResourceKey=hoursTypeConverter}}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<ListBox Height="50" VerticalAlignment="Top">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBoxItem Content="aaaaaaaaaaa"/>
<ListBoxItem Content="aaaaaaaaaaa"/>
<ListBoxItem Content="aaaaaaaaaaa"/>
<ListBoxItem Content="aaaaaaaaaaa"/>
<ListBoxItem Content="aaaaaaaaaaa"/>
</ListBox>

Accordion control showing item content only after second selection

I have an AccordionControl (WPFToolkit) to which I add items dynamically:
<my:Accordion Grid.Column="1"
ItemsSource="{Binding Path=Tests}"
SelectionMode="ZeroOrOne"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
<my:Accordion.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Header}" />
</StackPanel>
</DataTemplate>
</my:Accordion.ItemTemplate>
<my:Accordion.ContentTemplate>
<DataTemplate>
<ContentPresenter Content="{Binding Content}"/>
</DataTemplate>
</my:Accordion.ContentTemplate>
</my:Accordion>
To actually see the Content, I have to select (open) an AccordionItem, close it and open it again. What could be the reason for this behaviour?
EDIT
I have found a way around this using styles instead, still I would be interested why the above does not work. Here the style solution:
<Style x:Key="itemStyle" TargetType="my:AccordionItem">
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate>
<TextBlock Text="{Binding Header}"/>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="accordionStyle" TargetType="my:Accordion">
<Setter Property="ItemContainerStyle" Value="{StaticResource itemStyle}" />
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<ItemsControl ItemsSource="{Binding MenuItems}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<TextBox Text="{Binding Path=Text, Mode=OneWay}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
<my:Accordion Grid.Column="1" Height="Auto"
Name="accordion1"
ExpandDirection="Left"
SelectionMode="One"
ItemsSource="{Binding Tests}"
Style="{StaticResource accordionStyle}">
</my:Accordion>
EDIT
I have now found the problem: I cannot "Stretch the AccordionControl.
<my:Accordion Grid.Column="1" Height="Auto"
VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
Name="accordion1"
ExpandDirection="Left"
SelectionMode="One"
ItemsSource="{Binding Tests}"
Style="{StaticResource accordionStyle}">
</my:Accordion>
As soon as I do this, it is not working anymore. Does someone know a way around this?

Resources