Programmatically bind an image's canvas point in WPF - wpf

Question

In my program I am dynamically creating images to be added into a canvas in a WPF window.
My question is: How can I bind the canvas.left and canvas.right point to a class property.
If the image existed before run-time I would make and bind it like this in XAML/WPF:
<Image Height="26" HorizontalAlignment="Left" Canvas.Left="{Binding left}" Canvas.Top="{Binding top}" Name="Image1" Stretch="Fill" VerticalAlignment="Top" Width="28" Source="/imageTest;component/Images/blue-pin-md.png" />
What I have in VB.net:
'Create array of images
Dim myImages(5) as myImage
For i = 0 to myImages.count - 1
myImages(i) = New myImage
'set datacontext if I can bind
myImages(i).image.DataContext = myImages(i)
canvas1.Children.Add(myImages(i).image)
Next
myImage class:
Imports System.ComponentModel
Public Class myImage
Implements INotifyPropertyChanged
Public Event PropertyChanged As PropertyChangedEventHandler Implements INotifyPropertyChanged.PropertyChanged
Private Sub NotifyPropertyChanged(ByVal info As String)
RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(info))
End Sub
Private Property _image as New Image
Private Property _left As Double
Private Property _top As Double
Private Shared Property r As New Random()
Public Sub New()
_image.Width = 28
_image.Height = 26
_image.Source = New System.Windows.Media.Imaging.BitmapImage(New Uri("/imageTest;component/Images/blue-pin-md.png", UriKind.Relative))
'the below works without binding if I just want to set and leave them in one place but I would like to bind them so that I can move them relative to other data
'_left = r.Next(0, System.Windows.SystemParameters.PrimaryScreenWidth)
'_top = r.Next(0, System.Windows.SystemParameters.PrimaryScreenHeight)
End Sub
Public ReadOnly Property image As Image
Get
Return _image
End Get
End Property
Public ReadOnly Property left As Double
Get
Return _left
End Get
End Property
Public ReadOnly Property top As Double
Get
Return _top
End Get
End Property
'a possible move method that would take advantage of the binding
Public Sub move()
_top += 1
_left += 1
NotifyPropertyChanged("left")
NotifyPropertyChanged("top")
End Sub

Answer 1

Not sure how to write it in VB, but in C# it would look like this:
var leftBinding = new Binding
{
Path = new PropertyPath("left"),
Source = myImages[i]
};
var topBinding = new Binding
{
Path = new PropertyPath("top"),
Source = myImages[i]
};
myImages[i].image.SetBinding(Canvas.LeftProperty, leftBinding);
myImages[i].image.SetBinding(Canvas.TopProperty, topBinding);
Or perhaps simpler, with DataContext:
myImages[i].image.DataContext = myImages[i];
myImages[i].image.SetBinding(Canvas.LeftProperty, "left");
myImages[i].image.SetBinding(Canvas.TopProperty, "top");

Answer 2

Thanks to Clemens C# code I was able to get it working. Below is the code that I used. The .SetBindings(,) was the key for me.
For i = 0 To myImages.Count - 1
myImages(i) = New myImage
myImages(i).image.DataContext = myImages(i)
myImages(i).image.SetBinding(Canvas.LeftProperty, "left")
myImages(i).image.SetBinding(Canvas.TopProperty, "top")
canvas1.Children.Add(myImages(i).image)
Next