Silverlight跑马灯

Silverlight跑马灯,第1张

概述这个效果实在太多了,不管是flash版还是html(javascript)版都屡见不鲜了,这里就上一个Silverlight版本的,直接上代码(这里的跑马灯其实也可以说是一个图片展示(旋转)的动画效果): 1. 我们会新建一个ShopItem的UserControl,也即用来放置一张图片的容器,xaml部分: <Grid x:Name="LayoutRoot" Background="White"

这个效果实在太多了,不管是flash版还是HTML(JavaScript)版都屡见不鲜了,这里就上一个Silverlight版本的,直接上代码(这里的跑马灯其实也可以说是一个图片展示(旋转)的动画效果):

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

<GrID x:name="LayoutRoot" Background="White">        <Image x:name="obj" WIDth="288" Height="512" Stretch="Fill"/></GrID>

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

 

2. 在我们的MainPage里使用我们的ShopItem的UserControl,XAML部分:

<GrID x:name="LayoutRoot" Background="#ff333333">        <Image x:name="shower" WIDth="180" Height="180" Stretch="Fill" Visibility="Collapsed">            <Image.Effect>                <DropShadowEffect color="White" BlurRadius="10" Opacity=".8" ShadowDepth="0"/>            </Image.Effect>        </Image>        <Canvas x:name="moveCanvas"/>        <StackPanel OrIEntation="Horizontal" margin="300,500,0">            <button WIDth="50" Height="30" Content="Play" x:name="btnStart" Click="btnStart_Click"/>            <button WIDth="50" Height="30" Content="Stop" margin="10" x:name="btnStop" Click="btnStop_Click"/>        </StackPanel>    </GrID>

对应的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<ShopItem> objList = new List<ShopItem>();        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,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的简单逻辑。  

总结

以上是内存溢出为你收集整理的Silverlight跑马灯全部内容,希望文章能够帮你解决Silverlight跑马灯所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1071110.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-26
下一篇 2022-05-26

发表评论

登录后才能评论

评论列表(0条)

保存