Silverlight Toolkit Accordion in TreeView

Question

I'm trying to get the SL Tookit (March 2009) Accordion control to populate the ItemTemplate of a TreeView control, but it doesn't render properly (just a 1x1 pixel square).

Here's my XAML:

<UserControl x:Class="SilverlightTest.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:tk="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
    xmlns:tkw="clr-namespace:System.Windows;assembly=System.Windows.Controls.Toolkit"
    xmlns:lo="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Layout.Toolkit"
    Width="400" Height="300">
    <Grid x:Name="LayoutRoot" Background="White">
        <tk:TreeView Name="tv">
            <tk:TreeView.ItemTemplate>
                <DataTemplate>
                    <lo:Accordion Name="acc" SelectionMode="ZeroOrMore">
                        <lo:Accordion.HeaderTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding Key}"/>
                            </DataTemplate>
                        </lo:Accordion.HeaderTemplate>
                        <lo:Accordion.ContentTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="Value: "/>
                                    <TextBlock Text="{Binding Value}"/>
                                </StackPanel>
                            </DataTemplate>
                        </lo:Accordion.ContentTemplate>
                    </lo:Accordion>
                </DataTemplate>    
            </tk:TreeView.ItemTemplate>
        </tk:TreeView>
    </Grid>
</UserControl>

And the codebehind:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace SilverlightTest
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();

            KeyValuePair<string, string>[] data = new KeyValuePair<string,string>[]
            {
                new KeyValuePair<string, string>("Item 1", "Apple"),
                new KeyValuePair<string, string>("Item 2", "Banana"),
                new KeyValuePair<string, string>("Item 3", "Grapefruit"),
                new KeyValuePair<string, string>("Item 4", "Kiwi")
            };

            tv.ItemsSource = data;
        }
    }
}

What can I do to make this do what I want?

Answer 1

you should finish the code by adding

tv.UpdateLayout();

That should do it.

/Micke