Windows Phone 应用程序在 C# 上对图像应用转换

Question

我正在开发一个迷你游戏，我需要使用平移变换使图像从它们的初始位置移动到另一个位置。

问题是：我不知道如何进行应用翻译。

所以这是用于生成我的图像的代码。

Image myImage1 = new Image();
myImage1.Source = new BitmapImage(new Uri("/Images/image1.png", UriKind.Relative));
myImage1.Name = "image" + index++.ToString();
myImage1.Tap += myImage_Tap;

Canvas.SetLeft(image, 200);
Canvas.SetTop(image, 600);

gameArea.Children.Add(image);

感谢您的宝贵时间。

Answer 1

您有两种选择来移动图像。第一个是使用 Canvas 就像你的代码显示的那样，但你必须确保你的元素实际上在 Canvas 内。你的 "gameArea" 是 Canvas 吗？如果不是，您的代码将无法运行。另一种选择是使用转换。

var myImage1 = new Image
{
    Source = new BitmapImage(new Uri("/Images/image1.png", UriKind.Relative)),
    Name = "image" + index++.ToString(),
    Tap += myImage_Tap,
    RenderTransform = new TranslateTransform
    {
        X = 200,
        Y = 600
    }
};

gameArea.Children.Add(image);

现在 gameArea 可以是任何类型的面板，它会起作用。

请注意，当使用 Canvas 时，您的 Top 和 Left 将从 Canvas 的左上角开始。使用变换时，您的 X 和 Y 将相对于元素最初绘制的位置。

更新 -- 助手 class 使用 Canvas

制作简单的动画

public sealed class ElementAnimator
{
    private readonly UIElement _element;

    public ElementAnimator(UIElement element)
    {
        if (null == element)
        {
            throw new ArgumentNullException("element", "Element can't be null.");
        }

        _element = element;
    }

    public void AnimateToPoint(Point point, int durationInMilliseconds = 300)
    {
        var duration = new Duration(TimeSpan.FromMilliseconds(durationInMilliseconds));

        var easing = new BackEase
        {
            Amplitude = .3
        };

        var sb = new Storyboard
        {
            Duration = duration
        };

        var animateLeft = new DoubleAnimation
        {
            From = Canvas.GetLeft(_element),
            To = point.X,
            Duration = duration,
            EasingFunction = easing,
        };

        var animateTop = new DoubleAnimation
        {
            From = Canvas.GetTop(_element),
            To = point.Y,
            Duration = duration,
            EasingFunction = easing,
        };

        Storyboard.SetTargetProperty(animateLeft, "(Canvas.Left)");
        Storyboard.SetTarget(animateLeft, _element);

        Storyboard.SetTargetProperty(animateTop, "(Canvas.Top)");
        Storyboard.SetTarget(animateTop, _element);

        sb.Children.Add(animateLeft);
        sb.Children.Add(animateTop);

        sb.Begin();
    }
}

Answer 2

这就是我对你的代码所做的，我只取了这一部分并将其变成了一个函数：

public void AnimateToPoint(UIElement image, Point point, int durationInMilliseconds = 300)
{
    var duration = new Duration(TimeSpan.FromMilliseconds(durationInMilliseconds));

    var sb = new Storyboard
    {
        Duration = duration
    };

    var animateTop = new DoubleAnimation
    {
        From = Canvas.GetTop(image),
        To = point.Y,
        Duration = duration
    };

    Storyboard.SetTargetProperty(animateTop, new PropertyPath("Canvas.Top")); // You can see that I made some change here because I had an error with what you gave me
    Storyboard.SetTarget(animateTop, image);

    sb.Children.Add(animateTop);

    sb.Begin();
}

然后我拨打电话：

Point myPoint = new Point(leftpos, 300); // leftpos is a variable generated randomly
AnimateToPoint(myImage, myPoint);

所以现在还有一个错误，它在指令"sb.Begin;"中。它说：无法解析指定对象上的 TargetProperty Canvas.Top。我真的不知道如何进行。感谢您之前的回答！

Windows Phone 应用程序在 C# 上对图像应用转换

Apply transformation on an image on C# for a Windows Phone application

c#

windows-phone

transform

translation