Silverlight:动画和/或平移图像

Question

我有一个客户要求将动画/平移图像添加到他们的网站。基本上，这是一个标准尺寸的图像，他想把它放在一个稍微窄一点的框架中，并将图像从左到右平移，作为他网站上的视觉元素。无需单击和拖动；它基本上只是一个从左到右的动画平移，然后从另一张图片重新开始。

这是一个.NET 页面，我有一堆Silverlight 书籍放在这里，我打算学习它。我认为现在是最好的时机，因为现在我真的可以使用它。郑重声明，我是一位经验丰富的 .NET 开发人员，但除了阅读几本书的前几章之外，我对 Silverlight 的使用并不多。

所以...第一个问题，我假设这可能与 Silverlight 有关，我错了吗？

第二个问题，如果我能做到，就需要什么功能/控制/技术来做到这一点，有人能指出我正确的方向吗？我正在阅读深度缩放，但这似乎不是我想要的。我只需要取一个标准尺寸的 jpeg/gif/任何文件，然后让它从左到右慢慢平移。为了做到这一点，我需要学习/花一些时间学习哪些 Silverlight 功能？

Answer 1

这当然是可行的。您基本上将在 Canvas 上放置一个图像，并且您将在该 Canvas 上处理 MouseMove 事件。当鼠标从一侧移动到另一侧时，您将对图像应用平移以将其从一侧移动到另一侧。

以下代码应该可以帮助您入门:

将带有图像的 Canvas 添加到 MainPage.xaml(注意 MouseMove/Enter/Leave 事件)

<Canvas x:Name="LayoutCanvas" MouseMove="LayoutCanvas_MouseMove" MouseEnter="LayoutCanvas_MouseEnter" Height="200" Width="200">
     <Image x:Name="imgToMove" Source="myimage.png" />
</Canvas>

在后面的代码中，添加 MouseMove/Enter/Leave 事件

    Point lastMousePos = new Point();
    Point currentMousePos = new Point();
    double amountToMove = 1;
    private void LayoutCanvas_MouseMove(object sender, MouseEventArgs e)
    {
        currentMousePos = e.GetPosition(LayoutCanvas);
        if (lastMousePos.X > currentMousePos.X)
        {
            amountToMove--;
        }
        else
        {
            amountToMove++;
        }
        imgToMove.SetValue(Canvas.LeftProperty, amountToMove);
        lastMousePos = currentMousePos;
    }

    private void LayoutCanvas_MouseEnter(object sender, MouseEventArgs e)
    {
        lastMousePos = e.GetPosition(LayoutCanvas);
    }

    private void LayoutCanvas_MouseLeave(object sender, MouseEventArgs e)
    {
        imgToMove.SetValue(Canvas.LeftProperty, (double)0);
    }

你已经完成了。现在，当您将鼠标移到图像上时，图像将从左到右或从右到左转换。当您离开图像时，它会回到原来的位置。