这个效果实在太多了,不管是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跑马灯所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)