【问题标题】:How can I make a Rectangle on a canvas which is draggable?如何在可拖动的画布上制作矩形?
【发布时间】:2016-05-11 13:03:27
【问题描述】:

我有这三个函数来触发事件。我已经有了我需要的静态版本,但我需要它的动态版本。

    bool captured = false;
    double x_shape, x_canvas, y_shape, y_canvas;
    UIElement source = null;

    private void MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {
        source = (UIElement)sender;
        Mouse.Capture(source);
        captured = true;
        x_shape = Canvas.GetLeft(source);
        x_canvas = e.GetPosition(canvasPreview).X;
        y_shape = Canvas.GetTop(source);
        y_canvas = e.GetPosition(canvasPreview).Y;
    }

    private void MouseMove(object sender, MouseEventArgs e)
    {
        //MessageBox.Show("test");
        if (captured)
        {
            double x = e.GetPosition(canvasPreview).X;
            double y = e.GetPosition(canvasPreview).Y;
            x_shape += x - x_canvas;
            Canvas.SetLeft(source, x_shape);
            x_canvas = x;
            y_shape += y - y_canvas;
            Canvas.SetTop(source, y_shape);
            y_canvas = y;
        }
    }

    private void MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
    {
        Mouse.Capture(null);
        captured = false;
    }

我在 WPF 中制作了一个名为“canvasPreview”的画布,我想将矩形(目前在静态版本中我使用的是椭圆)添加到画布上,它必须可以使用上述功能进行拖动。它已经在工作,但它必须是动态的。

希望你能帮助我,提前谢谢你!

【问题讨论】:

  • 如果不是动态的,它是如何工作的?你说它必须是动态的到底是什么意思?形状不会被拖动吗?
  • 对不起。静态版本正在工作,我的意思是静态工作是在 WPF 中创建的椭圆是可拖动的,但是当我尝试生成一个椭圆(应该是一个矩形)时,它是不可拖动的,但是调用了函数.
  • 画布中的函数?如果您插入断点并开始尝试拖动矩形,则 MouseLeftButtonDown 中的“源”设置是什么?
  • MouseDragElementBehavior 怎么样?从混合交互行为? [stackoverflow.com/questions/4599629/…

标签: c# wpf wpf-controls


【解决方案1】:

我相信这个示例代码会对你有所帮助。

XAML:

<Grid Margin="12">
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <StackPanel Grid.Row="0" Orientation="Horizontal">
        <Button x:Name="addRectangleButton" Content="Add Rectngle" Click="addRectangleButton_Click"/>
    </StackPanel>

    <Canvas Grid.Row="1" x:Name="canvas" Margin="0,12,0,0">
        <Rectangle x:Name="rectangle" Width="100" Height="50" Fill="RoyalBlue" MouseDown="rectangle_MouseDown" MouseMove="rectangle_MouseMove" MouseUp="rectangle_MouseUp" Canvas.Left="0" Canvas.Top="0"/>
    </Canvas>
</Grid>

C#:

    bool drag = false;
    Point startPoint;

    public MainWindow()
    {
        InitializeComponent();
    }

    // this creates and adds rectangles dynamically
    private void addRectangleButton_Click(object sender, RoutedEventArgs e)
    {
        // create new Rectangle
        Rectangle rectangle = new Rectangle();
        // assign properties
        rectangle.Width = 100;
        rectangle.Height = 50;
        rectangle.Fill = new SolidColorBrush(Colors.RoyalBlue);
        // assign handlers
        rectangle.MouseDown += rectangle_MouseDown;
        rectangle.MouseMove += rectangle_MouseMove;
        rectangle.MouseUp += rectangle_MouseUp;
        // set default position
        Canvas.SetLeft(rectangle, 0);
        Canvas.SetTop(rectangle, 0);
        // add it to canvas
        canvas.Children.Add(rectangle);
    }

    private void rectangle_MouseDown(object sender, MouseButtonEventArgs e)
    {
        // start dragging
        drag = true;
        // save start point of dragging
        startPoint = Mouse.GetPosition(canvas);
    }

    private void rectangle_MouseMove(object sender, MouseEventArgs e)
    {
        // if dragging, then adjust rectangle position based on mouse movement
        if (drag)
        {
            Rectangle draggedRectangle = sender as Rectangle;
            Point newPoint = Mouse.GetPosition(canvas);
            double left = Canvas.GetLeft(draggedRectangle);
            double top = Canvas.GetTop(draggedRectangle);
            Canvas.SetLeft(draggedRectangle, left + (newPoint.X - startPoint.X));
            Canvas.SetTop(draggedRectangle, top + (newPoint.Y - startPoint.Y));

            startPoint = newPoint;
        }
    }

    private void rectangle_MouseUp(object sender, MouseButtonEventArgs e)
    {
        // stop dragging
        drag = false;
    }

【讨论】:

  • 谢谢!问题已经解决了!它是 SetLeft 和 SetTop 属性。
  • 祝你好运,祝你成功。
猜你喜欢
  • 1970-01-01
  • 2013-08-04
  • 2016-12-03
  • 1970-01-01
  • 2022-10-21
  • 1970-01-01
  • 2013-01-24
  • 2022-01-05
  • 1970-01-01
相关资源
最近更新 更多