Question

I’m trying to make a control for a silverlight application and I’m having some trouble. The control is a treeview. When I select an item it should pass width and height values which update the size of a canvas. They will be templates basically. Let’s say I wanted my templates to be “Big Square” which would pass width and height values of 600 and 600, “Small Square” which would be 400*400, and rectangle which would pass 600 for width and 400 for height. And so on. This would be bound to my canvas width and height properties. The squares would be under a parent called “Squares” and the rectangles under “Rectangles” etc.

I can write a treeview in XAML but can’t attach height and width values to it so can’t bind my canvas height and width to anything. I was thinking of maybe defining my items (with parent, template name, height and width) in a .cs file and using that to populate the treeview. Then when an item is selected the values associated with that item are passed as my width and height to controls in my MainPage.xaml which are already bound to my canvas width and height.

Not much existing code to be added but even if I could get this example working it would be a big help.

<sdk:TreeView x:Name="trvTemplate">
        <sdk:TreeViewItem Header="Squares">
              <sdk:TreeViewItem Header="Big Square"/>
              <sdk:TreeViewItem Header="Smaller Square"/>
        </sdk:TreeViewItem>
        <sdk:TreeViewItem Header="Rectangles">
              <sdk:TreeViewItem Header="Big Rectangle"/>
              <sdk:TreeViewItem Header="Small Rectangle"/>
        </sdk:TreeViewItem>
<\sdk:TreeView>

Is this possible with a treeview and how would I go about it if so? Thanks for any help.

Edit:Thinking about it now I could easily use eventhandlers on each template but I’d rather not do that and go with an mvvm approach.

Something like this maybe?

public class CanvasTemplate
{
    private static List<CanvasTemplate> listTemplates = null;

    public CanvasTemplate(string name, double width, double height)
    {


        new CanvasTemplate("Template 1", 800, 400);
        new CanvasTemplate("Template 2", 600, 600);

        Name = name;
        Width = width;
        Height = height;

    }


    public string Name { get; set; }
    public double Width { get; set; }
    public double Height { get; set; }


}           

Answer 1

This is your xaml

            <sdk:TreeView.ItemTemplate>
            <DataTemplate>
                <sdk:TreeViewItem Header="{Binding HeaderName}" ItemsSource="{Binding ListTemplates}">
                    <sdk:TreeViewItem.ItemTemplate>
                        <DataTemplate>
                            <sdk:TreeViewItem Header="{Binding Name}"  GotFocus="TreeViewItem_GotFocus"/>
                        </DataTemplate>
                    </sdk:TreeViewItem.ItemTemplate>


                </sdk:TreeViewItem>
            </DataTemplate>
        </sdk:TreeView.ItemTemplate>
        </sdk:TreeView>

The Class are

public class ParentCanvasTemplate
    {
        public ParentCanvasTemplate(string headername)
        {
            if (headername == "Squares")
            {
                HeaderName = headername;
                ListTemplates = new List<CanvasTemplate>();
                CanvasTemplate ct = new CanvasTemplate("Smaller Square", 400, 400);
                ListTemplates.Add(ct);
                ct = new CanvasTemplate("Bigger Square", 800, 800);
                ListTemplates.Add(ct);
            }
            else if (headername == "Rectangles")
            {
                HeaderName = headername;
                ListTemplates = new List<CanvasTemplate>();
                CanvasTemplate ct = new CanvasTemplate("Smaller Rectangle", 600, 400);
                ListTemplates.Add(ct);
                ct = new CanvasTemplate("Bigger Rectangle", 800, 600);
                ListTemplates.Add(ct);
            }
        }
        public string HeaderName { get; set; }
        public List<CanvasTemplate> ListTemplates { get; set; }
    }

    public class CanvasTemplate
    {


        public CanvasTemplate(string name, double width, double height)
        {       

            Name = name;
            Width = width;
            Height = height;

        }


        public string Name { get; set; }
        public double Width { get; set; }
        public double Height { get; set; }


    }  

Add this where ever you have to create your tree view

List<ParentCanvasTemplate> lst = new List<ParentCanvasTemplate>();
            ParentCanvasTemplate pct = new ParentCanvasTemplate("Squares");
            lst.Add(pct);
            pct = new ParentCanvasTemplate("Rectangles");
            lst.Add(pct);
            trvTemplate.ItemsSource = lst;

This will give you what you want

 private void TreeViewItem_GotFocus(object sender, RoutedEventArgs e)
        {
            string test = ((sender as TreeViewItem).DataContext as CanvasTemplate).Name;
            string Width = ((sender as TreeViewItem).DataContext as CanvasTemplate).Width+"";

        }