Binding a Canvas to a Canvas in WPF

Question

I have a class called "WaferMap" that draws rectangles its own canvas. There is also a canvas in the main view as well. I want to be able to bind the content of the canvas in the WaferMap class to the canvas on the GUI. What is the best way to do this?

The way I am doing it now is creating a canvas in the WaferMap class and then binding it to the canvas on the GUI using the ContentPresenter property of the canvas.

WaferMap class:

public class WaferMap : ViewModelBase
{
#region Fields

    protected const int rows = 23;
    protected const int cols = 23;
    protected int currentRow;
    protected int currentCol;
    protected DiePrint diePrint;
    protected List<BlueTape> blueTapeList;
    protected Canvas canvasToMap;

#endregion

#region Constructor

    public WaferMap(List<BlueTape> btList)
    {
        blueTapeList = new List<BlueTape>();
        blueTapeList = btList;
    }

#endregion

#region Properties

    public Canvas WaferMapCanvas
    {
        get
        {
            return canvasToMap;
        }
    }
    public List<BlueTape> BlueTapeList
    {
        get
        {
            return blueTapeList;
        }
    }

#endregion

#region Methods

    public void DrawWaferMap()
    {
        if (blueTapeList.Count > 0)
        {
            canvasToMap = new Canvas();
            foreach (BlueTape bt in blueTapeList)
            {
                if (bt.DiePrintList.Count > 0)
                {
                    foreach (DiePrint print in bt.DiePrintList)
                    {
                        // Create a new DiePrintRectangle and get its
                        // row and column coordinates
                        DiePrintRectangle diePrintRect = new DiePrintRectangle(print);

                        // Add the print to the canvas
                        canvasToMap.Children.Add(diePrintRect);

                        // Set the properties
                        Thickness margin = new Thickness(0);
                        diePrintRect.Margin = margin;
                        diePrintRect.Height = 25;
                        diePrintRect.Width = diePrintRect.Height;
                        diePrintRect.HorizontalAlignment = HorizontalAlignment.Left;
                        diePrintRect.VerticalAlignment = VerticalAlignment.Top;
                        currentCol = Convert.ToInt32(print.Col * diePrintRect.Height);
                        currentRow = Convert.ToInt32(print.Row * diePrintRect.Height);
                        print.MapCol = currentCol;
                        print.MapRow = currentRow;
                        Canvas.SetLeft(diePrintRect, currentCol);
                        Canvas.SetTop(diePrintRect, currentRow);

                        // Get the color of the print fill and stroke
                        //diePrintRect.Stroke = GetDiePrintColor(bt);
                        diePrintRect.StrokeThickness = 12;
                        diePrintRect.Stroke = GetDiePrintColor(bt);
                        diePrintRect.Fill = Brushes.Transparent;
                        diePrintRect.MouseDown += diePrintRect_MouseDown;
                        diePrintRect.MouseEnter += diePrintRect_MouseEnter;
                    }
                }
            }
        }
    }
}

And here is my XAML:

    <DockPanel>
        <Canvas Name="mapCanvas">
            <ContentPresenter Content="{Binding WaferMap}"/>
        </Canvas>
    </DockPanel> 

And in the code behind:

NOTE: I have this setup for debugging the binding. When the button "btnDoStuff" gets clicked, it will set the datacontext of the canvas on the GUI.

public partial class WaferTrackerWindow : Window
{
    WaferTrackerWindowViewModel wtw;
    public WaferTrackerWindow()
    {
        InitializeComponent();

        SelectWaferButtonViewModel swbv = new SelectWaferButtonViewModel();
        wtw = new WaferTrackerWindowViewModel(tvwWaferList, txtFilter);            

        wtw.SelectWaferButtonViewModel = swbv;

        tvwDockPanel.DataContext = wtw.SelectWaferButtonViewModel;
        DataContext = wtw;
        btnChooseWafer.DataContext = wtw;
        btnSelectWafer.DataContext = wtw;
        btnExit.DataContext = wtw;
        tbkWafer.DataContext = wtw;

        btnDoStuff.Click += btnDoStuff_Click;
    }

    private void btnDoStuff_Click(object sender, RoutedEventArgs e)
    {
        mapCanvas.DataContext = wtw.WaferMap.WaferMapCanvas;
    }

For some reason, this is not working. Any help would greatly appreciated.

Is there a better way I should be doing this other than creating a canvas in a class and trying to bind it to a canvas in the view?

Thanks in advanced!

Answer 1

You are setting your DataContext of your mapCanvas to wtw.WaferMap.WaferMapCanvas, which is an object of type Canvas, and Canvas does not have a property called WaferMap

You need to instead set the DataContext to wtf.WaferMap and bind to the WaferMapCanvas property which is of data type Canvas

mapCanvas.DataContext = wtw.WaferMap;

and

<ContentPresenter Content="{Binding WaferMapCanvas}"/>