Silverlight 4：为什么物品不可移动？ [英] Silverlight 4: why items are not moveable?
问题描述
有一个可以在其中拖动某些项目的字段：
There is a "field" on which some items are draggable:
这里是XAML代码：
<Canvas Height="180" Width="169" >
<Image Canvas.Left="0" Canvas.Top="0" Height="180" Width="149"
Source="../Picts/field.png" />
<Pages:FieldItem x:Name="Item2" Canvas.Left="129" Canvas.Top="34"
MouseLeftButtonDown="Item1_OnMouseLeftButtonDown"
MouseLeftButtonUp="Item1_MouseLeftButtonUp"
MouseMove="Item1_MouseMove"
/>
</Canvas>
和代码隐藏：
private bool bIsCaptured = false;
double mouseVerticalPosition;
double mouseHorizontalPosition;
private void Item1_OnMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
((FrameworkElement)sender).CaptureMouse();
bIsCaptured = true;
mouseVerticalPosition = e.GetPosition(null).Y;
mouseHorizontalPosition = e.GetPosition(null).X;
}
private void Item1_MouseMove(object sender, MouseEventArgs e)
{
if (bIsCaptured)
{
UserControl item = sender as UserControl;
if (item != null)
{
// Calculate the current position of the object.
double deltaV = e.GetPosition(null).Y - mouseVerticalPosition;
double deltaH = e.GetPosition(null).X - mouseHorizontalPosition;
double newTop = deltaV + (double)item.GetValue(Canvas.TopProperty);
double newLeft = deltaH + (double)item.GetValue(Canvas.LeftProperty);
// Set new position of object.
item.SetValue(Canvas.TopProperty, newTop);
item.SetValue(Canvas.LeftProperty, newLeft);
// Update position global variables.
mouseVerticalPosition = e.GetPosition(null).Y;
mouseHorizontalPosition = e.GetPosition(null).X;
}
}
}
private void Item1_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
UserControl item = sender as UserControl;
bIsCaptured = false;
if (item != null)
{
item.ReleaseMouseCapture();
}
}
我的任务是显示以下项目的集合绑定到对象列表。主题中描述了如何执行此操作： Silverlight 4：如何显示自定义控件的列表（不按列表顺序）。
My task is to display a collection of items that are bound to a list of object. How to do that is described in the topic: Silverlight 4: how to display list of custom controls (not in list order).
唯一缺少建议方法的是：项目不再可拖动...
The only lack of the suggested approach is: items are not draggable anymore...
如果有更新控件持有人的XAML代码（出于一致性目的而提供）：
Here if update XAML code of controls "holder" (provided for consistency purposes):
<Canvas Height="180" Width="169" Background="Beige" HorizontalAlignment="Center" >
<Image Canvas.Left="0" Canvas.Top="0" Height="180" Width="149"
Source="../Picts/field.png" />
<Pages:MyItemsControl ItemsSource="{Binding SquadFieldPlayers}">
<Pages:MyItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas Height="180" Width="169" Background="Transparent"
HorizontalAlignment="Center" />
</ItemsPanelTemplate>
</Pages:MyItemsControl.ItemsPanel>
<Pages:MyItemsControl.ItemTemplate>
<DataTemplate>
<Pages:FieldItem
MouseLeftButtonDown="Item1_OnMouseLeftButtonDown"
MouseLeftButtonUp="Item1_MouseLeftButtonUp"
MouseMove="Item1_MouseMove"
/>
</DataTemplate>
</Pages:MyItemsControl.ItemTemplate>
</Pages:MyItemsControl >
</Canvas>
所有鼠标事件处理程序都被调用，但是项并不是真正可移动的……为什么？
All mouse-event handlers are called, but items are not really movable... why?
推荐答案
仍不确定该如何工作，但我找到了解决方法。方法'Item1_MouseMove'已更新为执行以下操作：
Still not sure how that should work, but I've found a workaround. Method 'Item1_MouseMove' was updated to do the following:
- 查找控件绑定到的数据对象；
- 设置该对象的'FieldCoordX'和'FieldCoordY'属性，而不是设置控件的'Canvas.LeftProperty'和'Canvas.RightProperty'。
它看起来像这样：
private void Item1_MouseMove(object sender, MouseEventArgs e)
{
if (bIsCaptured)
{
FrameworkElement element = sender as FrameworkElement;
if (element != null)
{
ISquadPlayerViewModel vmPlayer = element.DataContext as ISquadPlayerViewModel;
if (vmPlayer != null)
{
// Calculate the current position of the object.
double deltaH = e.GetPosition(null).X - mouseHorizontalPosition;
double deltaV = e.GetPosition(null).Y - mouseVerticalPosition;
double newLeft = deltaH + vmPlayer.FieldCoordX;
double newTop = deltaV + vmPlayer.FieldCoordY;
// Set new position of object.
vmPlayer.FieldCoordX = newLeft;
vmPlayer.FieldCoordY = newTop;
}
// Update position global variables.
mouseVerticalPosition = e.GetPosition(null).Y;
mouseHorizontalPosition = e.GetPosition(null).X;
}
}
}
还要添加一项原始说明中，托管所有控件的 ItemsControl对象的自定义：
One more item to be added into original description, customization of the 'ItemsControl' object that hosts all controls:
public class MyItemsControl : ItemsControl
{
protected override void PrepareContainerForItemOverride(
DependencyObject element, object item)
{
FrameworkElement contentitem = element as FrameworkElement;
if (contentitem != null)
{
Binding leftBinding = new Binding("FieldCoordX");
Binding topBinding = new Binding("FieldCoordY");
leftBinding.Mode = BindingMode.TwoWay;
topBinding.Mode = BindingMode.TwoWay;
contentitem.SetBinding(Canvas.LeftProperty, leftBinding);
contentitem.SetBinding(Canvas.TopProperty, topBinding);
base.PrepareContainerForItemOverride(element, item);
}
}
}
您可以看到我们的控件已经绑定到数据对象的属性。因此，我们不需要更新控制数据，而是对象数据。
As you can see our controls are already bound to the properties of the data objects. So we need to update not a control data, but object data.
如果有人对更多详细信息感兴趣，请询问。我会尽力提供帮助。
If somebody is interested in more details, ask. I will try to help.
这篇关于Silverlight 4：为什么物品不可移动？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
