如何从代码隐藏中将多个标签拖放到wpf中的图像上？ [英] how to drag and drop multiple labels over image in wpf from codebehind?

问题描述

我在wpf，C＃中从代码隐藏生成一组标签。我只能拖放最后一个标签一次。我无法拖放任何其他标签。



C＃代码如下：

Hi,

I am generating a set of labels from codebehind in wpf, C#. I can drag and drop the last label only once. I am not able to drag and drop any other labels.

The C# code is as follows:

ImgFloorPlan.Source = new BitmapImage(new Uri(rootDic + "\\" + filename));
   .
   .
   .
   .
foreach (string room in roomsList)
            {
                lbl = new Label();
                lbl.Content = room;
                lbl.Foreground = Brushes.White;
                lbl.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
                lbl.Background = Brushes.Gray;
                lbl.Margin = new Thickness { Left = 5, Top = j };
                lbl.MouseDown += new MouseButtonEventHandler(StkRooms_MouseDown);
                lbl.MouseMove += new MouseEventHandler(StkRooms_MouseMove);
                lbl.Cursor = Cursors.Hand;
                lbl.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
                CnvsFloorPlan.Children.Add(lbl);
                i++;
                j += 30;
            }

以上所有标签都添加到画布中。 ImgFloorPlan也被添加到画布中。所有上述标签都应该拖放到图像上。



XAML代码如下：

All the above labels are added to a canvas. ImgFloorPlan is also added to the canvas. All the above labels should be dragged and dropped over the image.

XAML code is as follows:

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Margin="26,63,98,185" x:Name="_scrollViewer">
            <Canvas x:Name="CnvsFloorPlan">
                   <Grid x:Name="GrdFloorPlan" HorizontalAlignment="Left" VerticalAlignment="Top" Width="{Binding ElementName=CnvsFloorPlan, Path=ActualWidth}" Height="{Binding ElementName=CnvsFloorPlan, Path=ActualHeight}" >
                         <Image x:Name="ImgFloorPlan" Source="Images/blank.png" HorizontalAlignment="left" VerticalAlignment="Top" AllowDrop="True" Drop="ImgFloorPlan_Drop"  Visibility="Visible"   />
                   </Grid>
            </Canvas>
        </ScrollViewer>

有人可以帮帮我吗？我花了超过3个星期试图解决这个问题。我只需根据条件填充多个标签。用户应该能够将这些标签拖放到图像上。请帮帮我。



提前谢谢

Can anyone help me with this please? I have spent more than 3 weeks trying to fix this. I just have to populate multiple labels depending on the condition. and user should be able to drag and drop these labels over the image. Please help me with this.

Thanks in advance

推荐答案

可能是我能想到的唯一技巧是使用鼠标捕获，这样一旦你开始拖动，鼠标事件将继续进入控件。我认为它是WPF中Mouse类的静态属性，因此键入Mouse。你应该看到一个方法，你可以使用鼠标事件继续你的标签。然后拖动它直到鼠标按钮升起变得微不足道。完成后不要忘记清除捕获

Probably the only trick I can think of is to use mouse capture, so that once you start dragging, the mouse events keep going to the control. I think it''s a static property of the Mouse class in WPF, so type Mouse. and you should see a method you can use to make the mouse events keep going to your label. Then dragging it until the mouse button lifts becomes trivial. Don''t forget to clear the capture when you''re done

谢谢大家的解决方案。 HOwever，我使用Thumbs来解决这个问题并且效果很好。



我们必须首先为要拖动的项目创建一个控件模板，如下所示： br />

Thank you all for your solutions. HOwever, I have used Thumbs to solve this issue and it works quite well.

We have to first create a control template for the item to be dragged as follows:

<resourcedictionary>
            <controltemplate x:key="rmIcon" targettype="Thumb" xmlns:x="#unknown">
                <stackpanel x:name="StkRoom" horizontalalignment="Center">
                    <image x:name="tplImage" source="Images\lightoffsmall.png"></image>
                    <textblock x:name="tplTextBlock" text="User stage" foreground="White" />
                </stackpanel>
            </controltemplate>
        </resourcedictionary>

然后我创建了代码隐藏的必要可拖动拇指如下：

Then I created the necessary draggable thumbs from codebehind as follows:

TmbRoom = new Thumb();
                TmbRoom.Margin = new Thickness { Left = left, Top = top };
                TmbRoom.Template = this.Resources["rmIcon"] as ControlTemplate;
                TmbRoom.ApplyTemplate();
                TmbRoom.DragDelta += new DragDeltaEventHandler(onDragDelta);
                TmbRoom.PreviewMouseDown += TmbRoom_PreviewMouseDown;
                TmbRoom.PreviewMouseUp += TmbRoom_PreviewMouseUp;
                //changing text in the template
                TextBlock txt = (TextBlock)TmbRoom.Template.FindName("tplTextBlock", TmbRoom);
                txt.Text = room;
                // Put newly created thumb on the canvas
                CnvsFloorPlan.Children.Add(TmbRoom);
private void onDragDelta(object sender, DragDeltaEventArgs e)
        {
            Thumb thumb = e.Source as Thumb;

            double left = Canvas.GetLeft(thumb) + e.HorizontalChange;
            double top = Canvas.GetTop(thumb) + e.VerticalChange;

            Canvas.SetLeft(thumb, left);
            Canvas.SetTop(thumb, top);

            //LblStatus.Content = left.ToString() + ", " + top.ToString();
        }

onDragdelta函数支持拖动，与传统拖动相比更容易处理wpf中的方法。

The onDragdelta function enables dragging and is easier to handle compared to conventional dragging methods in wpf.

这篇关于如何从代码隐藏中将多个标签拖放到wpf中的图像上？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！