Silverlight:动画和/或平移图像

Question

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

这是一个.NET页面,我有一堆Silverlight书籍坐在这里,我想要学习它.我觉得现在和任何人一样好,因为现在我真的有一个真实的用途.为了记录,我是.NET开发人员的经验,但除了阅读几本书的前几章之外,还没有玩过Silverlight.

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

第二个问题,如果我能做到这一点,有人可以指出我在正确的方向上做到这一点需要哪些功能/控制/技术？我正在阅读深度变焦,但这似乎并不是我想要的.我只需要采用标准尺寸的jpeg/gif /无论文件,并从左到右缓慢平移.我需要学习哪些Silverlight功能/花一些时间学习才能做到这一点？

Answer 1

这肯定是可行的.你将基本上有一个坐在画布上的图像,你将在该画布上处理MouseMove事件.当鼠标从一侧跟踪到另一侧时,您将对图像应用平移以将其从一侧移动到另一侧.

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

将带有图像的画布添加到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);
    }

而且你已经完成了.现在,当您将鼠标移到图像上时,图像将从左向右或从右向左平移.当您离开图像时,它将返回其原始位置.