Silverlight跑马灯

这个效果实在太多了，不管是flash版还是html（javascript）版都屡见不鲜了，这里就上一个Silverlight版本的，直接上代码（这里的跑马灯其实也可以说是一个图片展示（旋转）的动画效果）：

1. 我们会新建一个ShopItem的UserControl，也即用来放置一张图片的容器，xaml部分：

对应的C#部分代码不用写。

 

2. 在我们的MainPage里使用我们的ShopItem的UserControl，XAML部分：

对应的C#代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using SilverlightApplication1.Assets;
using System.Windows.Threading;
using System.ComponentModel;
using System.Collections.ObjectModel;
using System.Windows.Media.Imaging;

namespace SilverlightApplication1
{
    public partial class MainPage : UserControl
    {
        #region Field
        private DispatcherTimer timer;
        private int count = 10;
        private List objList = new List();
        private double degree = 10;
        private int width = 400;
        private int height = 100;
        private int itemHeight = 180;
        private int itemWidth = 100;
        #endregion

        #region Constructor
        public MainPage()
        {
            InitializeComponent();

            this.Loaded += new RoutedEventHandler(MainPage_Loaded);
        }
        #endregion

        #region Event
        void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            timer = new DispatcherTimer();
            for (int i = 0; i < count; i++)
            {
                ShopItem item = new ShopItem();
                Image image = item.obj;

                Uri uri = new Uri(string.Format("Assets/Images/{0}.jpg", (i + 1)), UriKind.Relative);
                BitmapImage bitmap = new BitmapImage(uri);
                image.Source = bitmap;

                image.MouseEnter += new MouseEventHandler(image_MouseEnter);
                image.MouseLeave += new MouseEventHandler(image_MouseLeave);
                image.MouseLeftButtonDown += new MouseButtonEventHandler(image_MouseLeftButtonDown);

                objList.Add(item);
                moveCanvas.Children.Add(item);
            }
            timer.Tick += new EventHandler(timer_Tick);
            TimeSpan ts = new TimeSpan(0, 0, 0, 0, 20);
            timer.Interval = ts;
            timer.Start();
        }

        void timer_Tick(object sender, EventArgs e)
        {
            StartMove();
        }

        void image_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {

        }

        void image_MouseLeave(object sender, MouseEventArgs e)
        {

        }

        void image_MouseEnter(object sender, MouseEventArgs e)
        {

        }

        private void btnStart_Click(object sender, RoutedEventArgs e)
        {

        }

        private void btnStop_Click(object sender, RoutedEventArgs e)
        {

        }
        #endregion

        #region Helper
        private void StartMove()
        {
            for (int i = 0; i < objList.Count; i++)
            {
                double offset = (degree + (360 / count) * i) % 360;
                offset = offset * Math.PI / 180;
                double posX = width * Math.Sin(offset);
                double posY = height * Math.Cos(offset);
                ShopItem obj = objList[i];

                //For the scale:
                double scale = (2 * height - posY) / (3 * height + itemHeight / 2);
                Canvas.SetLeft(obj, this.width / 2 + 300 + posX - (itemWidth / 2) * scale);
                Canvas.SetTop(obj, this.height / 2 + 180 - posY - (itemHeight / 2) * scale);
                Canvas.SetZIndex(obj, int.Parse(Math.Ceiling(count * scale).ToString()));

                //Transform:
                ScaleTransform st = new ScaleTransform();
                st.ScaleX = scale;
                st.ScaleY = scale;
                obj.RenderTransform = st;
                obj.Opacity = scale;
            }
            degree -= .3;
        }
        #endregion


        
    }


}

添加的按钮事件可以自行添加一些控制逻辑，比如旋转方向，Stop, Start的简单逻辑。