silverlight 实现在Canvas中拖放控件_silverlight canvas 拖拽定位组件-优快云博客

本文介绍了一个使用Silverlight实现的应用程序交互设计案例。通过拖动界面中的矩形元素，演示了如何捕捉用户的鼠标操作并更新元素的位置。文章详细展示了前端XAML布局及后台C#代码的实现细节。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1）前台代码

<UserControl x:Class="SilverlightApplication139.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"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">


    <Canvas x:Name="LayoutRoot" Background="White">
    </Canvas>
</UserControl>

2）后台代码

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 SilverlightApplication139
{
    public partial class MainPage : UserControl
    {
        bool trackingMousemove = false;
        Point mousePoint = new Point(0, 0);
        public MainPage()
        {
            InitializeComponent();
            Loaded += new RoutedEventHandler(MainPage_Loaded);
        }


        void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            for (int i = 0; i < 5; i++)
            {
                Rectangle rec = new Rectangle();
                rec.Name = i.ToString();
                rec.Fill = new SolidColorBrush(Colors.Red);
                rec.Width = 50;
                rec.Height = 50;
                rec.SetValue(Canvas.LeftProperty, 0D);
                rec.SetValue(Canvas.TopProperty, i * (rec.Width + 5));
                rec.MouseLeftButtonDown += new MouseButtonEventHandler(Element_MouseLeftButtonDown);
                rec.MouseMove += new MouseEventHandler(Element_MouseMove);
                rec.MouseLeftButtonUp += new MouseButtonEventHandler(Element_MouseLeftButtonUp);
                LayoutRoot.Children.Add(rec);
            }
        }
        /// <summary>
        /// 鼠标按下控件
        /// </summary>
        private void Element_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            FrameworkElement element = sender as FrameworkElement;
            mousePoint = e.GetPosition(null);
            trackingMousemove = true;
            element.CaptureMouse();
            element.Cursor = Cursors.Hand;


        }
        /// <summary>
        /// 鼠标移动控件
        /// </summary>
        private void Element_MouseMove(object sender, MouseEventArgs e)
        {
            FrameworkElement element = sender as FrameworkElement;
            if (trackingMousemove)
            {
                double deltaV = e.GetPosition(null).Y - mousePoint.Y;
                double deltaH = e.GetPosition(null).X - mousePoint.X;
                double newTop = deltaV + (double)element.GetValue(Canvas.TopProperty);
                double newLeft = deltaH + (double)element.GetValue(Canvas.LeftProperty);
                element.SetValue(Canvas.TopProperty, newTop);
                element.SetValue(Canvas.LeftProperty, newLeft);
                mousePoint = e.GetPosition(null);
            }
        }
        /// <summary>
        /// 鼠标放下控件
        /// </summary>
        private void Element_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
        {
            FrameworkElement element = sender as FrameworkElement;
            trackingMousemove = false;
            element.ReleaseMouseCapture();
            element.Cursor = null;
        }
    }
}