Question

我有一个非常讨厌的问题。我从Canvas中的ScrollViewer中的PDF中获取了一个图像。我想把＃34;兴趣点＆＃34;在该图像中，我想用该图像移动该POI / Mark。到目前为止，我可以将标记放在正确的位置，并且标记随着运动图像移动。问题是，在第一次移动/开始拖动图像时，我的标记会跳开然后随着图像一起移动..

我从image =＆gt;获得了一个位置点p = e.GetPosition（发件人为图像）

在下面的图片中，您可以看到情况，当我在放置该标记后开始拖动图像。我在已移动到画布右边界的图像的左侧片段/边框中标记了POI。因此，只显示图像的左侧片段/边框

annoying jump/teleport

我怎么能摆脱那个？我没有使用OnStartManipulation / OnStartDrag事件

画布尺寸：400 x 702 图像尺寸：1362 x 792

标记的移动是通过更新保证金

来实现的

以下是代码：

private void imagePDF_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{

    this.image_Transform.TranslateX += e.Delta.Translation.X; 
    this.image_Transform.TranslateY += e.Delta.Translation.Y;

    imageDeltaX = this.image_Transform.TranslateX;
    imageDeltaY = this.image_Transform.TranslateY;

    //update mark position

    foreach (var p in Points)
    {         
       Shapes[Points.IndexOf(p)].Margin = new Thickness(p.x + imageDeltaX, p.y + imageDeltaY, 0, 0);     
       Labels[Points.IndexOf(p)].Margin = new Thickness(p.x + imageDeltaX, p.y + imageDeltaY, 0, 0);     
    }

   }

任何帮助将不胜感激。我非常绝望。我仍然是UWP和C＃的新手，所以我的解决方案可能不是最好的。如果您遇到我不知道的任何其他问题，请非常友好并告诉我..

我尝试使用Canvas.Left / Canvas.Top但仍然没有成功。似乎是标记＆＃34;锚点＆＃34;到图像，当我第一次拖动图像..但我没有调用任何方法/代码这样做..请帮助

Answer 1

好的，这是最终解决方案：

    private void imagePDF_Tapped(object sender, TappedRoutedEventArgs e)
    {

        tapPosition = e.GetPosition(sender as Image);

        var x = tapPosition.X;
        var y = tapPosition.Y;

        AddMarkToPosition(++countPOI, x, y);

    }

    private void AddMarkToPosition(int id, double x, double y)
    {

        Points.Add(new PointOfInterest(countPOI, x, y));

        DrawShape(x, y);
        DisplayLabel(x, y, id.ToString());    

    }

    private void DrawShape(double x, double y)
    {
        shape = new Ellipse
        {
            Width = 30,
            Height = 30,
            Fill = new SolidColorBrush(Colors.Red),
            Stroke = new SolidColorBrush(Colors.Black),
        };

        shape.SetValue(Canvas.LeftProperty, x - 15 + imageDeltaX);
        shape.SetValue(Canvas.TopProperty, y - 15 + imageDeltaY);
        Shapes.Add(shape);
        canvasPDF.Children.Add(shape);
    }

    private void DisplayLabel(double x, double y, string s)
    {
        label = new TextBlock
        {
            Foreground = new SolidColorBrush(Colors.White),
            FontSize = 25,
            Text = s

        };

        label.SetValue(Canvas.LeftProperty, x - 8 + imageDeltaX);
        label.SetValue(Canvas.TopProperty, y - 20 + imageDeltaY);
        Labels.Add(label);
        canvasPDF.Children.Add(label);
    }

    private bool IsOutOfBorders(double x, double y)
    {
        var b = true;
        if ((x > (imagePDF.ActualWidth - 30)) || (x < 0) || (y > imagePDF.ActualHeight) || (y < 0))
        {
            b = true;
        }
        else b = false;
        return b;
    }

    private void UpdatePOI()
    {
        foreach (var p in Points)
        {
            Shapes[Points.IndexOf(p)].SetValue(Canvas.LeftProperty, p.x + imageDeltaX - 15);
            Shapes[Points.IndexOf(p)].SetValue(Canvas.TopProperty, p.y + imageDeltaY - 15);

            if (IsOutOfBorders(p.x + imageDeltaX, p.y + imageDeltaY)) Shapes[Points.IndexOf(p)].Visibility = Visibility.Collapsed;
            else Shapes[Points.IndexOf(p)].Visibility = Visibility.Visible;

            Labels[Points.IndexOf(p)].SetValue(Canvas.LeftProperty, p.x + imageDeltaX - 8);
            Labels[Points.IndexOf(p)].SetValue(Canvas.TopProperty, p.y + imageDeltaY - 20);

            if (IsOutOfBorders(p.x + imageDeltaX, p.y + imageDeltaY)) Labels[Points.IndexOf(p)].Visibility = Visibility.Collapsed;
            else Labels[Points.IndexOf(p)].Visibility = Visibility.Visible;

        }
    }

    private void imagePDF_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
    {

        this.image_Transform.TranslateX += e.Delta.Translation.X;
        this.image_Transform.TranslateY += e.Delta.Translation.Y;

        imageDeltaX = this.image_Transform.TranslateX;
        imageDeltaY = this.image_Transform.TranslateY;

        UpdatePOI();

    }

UI元素在移动后跳转

1 个答案: