Problems with using Canvas in Listbox

[6ske]

I am trying to set the Canvas properties in a Listbox with Silverlight 4. After running this program, you can see two columns, with two buttons initially in the right one. The left column isnt important to me. But I want to be able to drag the buttons anywhere in the right-hand side column. But whenever I drag the buttons to the left column and then drag them around in the right column, they always get placed in the upper-left corner. In the right-hand side column, why cant I place them somewhere else, such as in the middle or lower-right corner?

I have already read the article "One more platform difference more-or-less tamed [SetterValueBindingHelper makes Silverlight Setters better!]" by David Anson and used the SetterValueBindingHelper, but it still doesnt work

The sole purpose of this program is to be able to drag multiple buttons simultaneously. I was only able to do this by creating a Listbox and then setting the SelectionMode to Multiple

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 SilverlightBusinessDragDrop
{
public partial class MainPage : UserControl
{

string BoxSelected = string.Empty;
ListBox bs = new ListBox();
ListBox bd = new ListBox();
List<string> SourceNames = new List<string>();
List<string> DestinationNames = new List<string>();

public MainPage()
{
InitializeComponent();
CreateObjects();
}

private void CreateObjects()
{
ListBoxDragDropTarget source = new ListBoxDragDropTarget();
source.Drop += new Microsoft.Windows.DragEventHandler(dest_Drop);
source.AllowDrop = true;
box1.Margin = new Thickness(1, 1, 0, 0);
box1.Background = new SolidColorBrush(Colors.Transparent);
box1.Width = 240;
box1.Height = 360;

// Create Items for the List Box
ListBoxItem i1 = new ListBoxItem();
i1.BorderBrush = new SolidColorBrush(Colors.Orange);
i1.BorderThickness = new Thickness(1);
i1.Name = "1";

Button s1 = new Button();
s1.Content = "button1";
s1.Background = new SolidColorBrush(Colors.Yellow);
s1.Width = 80;
s1.Height = 50;

ListBoxItem i2 = new ListBoxItem();
i2.BorderBrush = new SolidColorBrush(Colors.Red);
i2.BorderThickness = new Thickness(1);
i2.Name = "2";

Button s2 = new Button();
s2.Content = "button2";
s2.Background = new SolidColorBrush(Colors.Green);
s2.Width = 87;
s2.Height = 50;

i1.Content = s1;
box1.Items.Add(i1);
i2.Content = s2;
box1.Items.Add(i2);

Canvas column2 = new Canvas();
column2.Margin = new Thickness(200, 0, 0, 0);
column2.HorizontalAlignment = System.Windows.HorizontalAlignment.Left;
column2.VerticalAlignment = System.Windows.VerticalAlignment.Bottom;
column2.Width = 150;
column2.Height = 400;

TextBlock hdr2 = new TextBlock();
hdr2.Text = "Column 2";
hdr2.Height = 30;
hdr2.Margin = new Thickness(0, 0, 0, 0);
hdr2.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
hdr2.VerticalAlignment = System.Windows.VerticalAlignment.Top;

ListBoxDragDropTarget dest = new ListBoxDragDropTarget();
dest.Drop += new Microsoft.Windows.DragEventHandler(dest_Drop);
dest.AllowDrop = true;

ListBox box2 = new ListBox();
box2.Name = "Column2";
box2.Margin = new Thickness(1, 1, 0, 0);
box2.Background = new SolidColorBrush(Colors.Transparent);
box2.FlowDirection = System.Windows.FlowDirection.LeftToRight;
box2.HorizontalAlignment = System.Windows.HorizontalAlignment.Right;
box2.VerticalAlignment = System.Windows.VerticalAlignment.Stretch;
box2.Width = 140;
box2.Height = 360;

column2.Children.Add(hdr2);
dest.Content = box2;
column2.Children.Add(dest);

DragDropRoot.Children.Add(column2);
}

void dest_Drop(object sender, Microsoft.Windows.DragEventArgs e)
{
// Here we handle the object that was dropped
var format = e.Data.GetFormats()[0];
ItemDragEventArgs dragItem = e.Data.GetData(format) as ItemDragEventArgs;
bs = (ListBox)dragItem.DragSource;
ListBoxDragDropTarget b = (ListBoxDragDropTarget)sender;
bd = (ListBox)b.Content;
}

}
}

and the XAML


<UserControl xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk" x:Class="SilverlightBusinessDragDrop.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:toolKit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
xmlns:local="clr-namespaceelay"
mc:Ignorable="d"
designHeight="500" designWidth="600



<Grid x:Name="LayoutRoot" Background="White
<TextBlock Margin="20,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Text="Silverlight Business Drag and Drop" FontSize="16 </TextBlock>
<Grid x:Name="DragDropRoot" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="40,40,0,0

<toolKit:ListBoxDragDropTarget AllowDrop="True
<ListBox Canvas.Left="76" Canvas.Top="62" x:Name="box1" Height="200" Width="200" SelectionMode="Multiple"
DisplayMemberPath="Name" VerticalContentAlignment="Center


<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem
<Setter Property="local:SetterValueBindingHelper.PropertyBinding
<Setter.Value>
<local:SetterValueBindingHelper>
<local:SetterValueBindingHelper Type="Canvas" Property="Left" Binding="{Binding X}" />
<local:SetterValueBindingHelper Type="Canvas" Property="Top" Binding="{Binding Y}" />
<local:SetterValueBindingHelper Type="Canvas" Property="ZIndex" Binding="{Binding ZIndex.Value}" />
</local:SetterValueBindingHelper>
</Setter.Value>
</Setter>
<Setter Property="Template
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem
<ContentPresenter/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>

<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<Canvas />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>

</ListBox>
</toolKit:ListBoxDragDropTarget>
</Grid>
</Grid>
</UserControl>

Continue reading...