Silverlight跑马灯效果实现代码

Silverlight跑马灯效果实现代码,第1张

概述首先定义一个UC_Pic.xaml的文件 <UserControl  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  xmlns:d="http://schemas.microsoft.com/expr

首先定义一个UC_Pic.xaml的文件

<UserControl
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 mc:Ignorable="d"
 x:Class="Runlight.UC_Pic"
 d:DesignWIDth="640" d:DesignHeight="480">

 <Canvas x:name="LayoutRoot" Background="Red" Height="240">
  <Image x:name="photo" WIDth="320" Height="240" Stretch="UniformToFill" margin="10"></Image>
 </Canvas>
</UserControl>

UC_Pic.xaml.cs文件内容如下:

using System;
using System.windows;
using System.windows.Controls;
using System.windows.documents;
using System.windows.Ink;
using System.windows.input;
using System.windows.Media;
using System.windows.Media.Animation;
using System.windows.Shapes;
using System.windows.Media.Imaging;

namespace Runlight
{
 public partial class UC_Pic : UserControl
 {
  public UC_Pic()
  {
   // required to initialize variables
   InitializeComponent();
  }
  
  //定义一个图片的url属性
  private string _imageUrl;
  public string ImageUrl
  {
   get{return this._imageUrl;}
   set
   {
    this._imageUrl = value;
    Uri uri = new Uri(value,UriKind.relative);
    BitmAPImage bitmap = new BitmAPImage(uri);
    this.photo.source = bitmap;
   }
  }
 }
}

 

然后是在MainPage.xaml文件中定义

<UserControl
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 x:Class="Runlight.MainPage" SizeChanged="UserControl_SizeChanged">

 <GrID x:name="LayoutRoot">
  <GrID.Background >
   <ImageBrush ImageSource="Expo.jpg"></ImageBrush>
  </GrID.Background>
  <Canvas x:name="canvas" Background="Black" Height="280">
   <Canvas.Clip>
    <RectangleGeometry x:name="rg"></RectangleGeometry>
   </Canvas.Clip>
   <StackPanel x:name="SP" OrIEntation="Horizontal"></StackPanel>
  </Canvas>
  <Image x:name="Fullimage" WIDth="640" Height="480" Visibility="Collapsed" MouseleftbuttonUp="Fullimage_MouseleftbuttonUp"></Image>
 </GrID>
</UserControl>

MainPage.xaml.cs文件内容如下:

using System;
using System.windows;
using System.windows.Controls;
using System.windows.documents;
using System.windows.Ink;
using System.windows.input;
using System.windows.Media;
using System.windows.Media.Animation;
using System.windows.Shapes;

namespace Runlight
{
 public partial class MainPage : UserControl
 {
  //定义一个故事版变量
  private Storyboard sby;
  //图片的宽度
  private const double photoWIDth = 240;
  //滚动图片的总宽度
  private double totalWIDth;
  
  public MainPage()
  {
   InitializeComponent();
   CreatePhoto();
  }

  private voID CreatePhoto()
  {
   string[] photoList = new string[]{"a1.jpg","a2.jpg","a4.jpg","a5.jpg","a6.jpg","a7.jpg","a8.jpg","a9.jpg","a10.jpg"};
   for(int i=0;i<3;i++)
   {
    for(int j=0;j<photoList.Length;j++)
    {
     UC_Pic pic = new UC_Pic();
     pic.WIDth =  photoWIDth;
     pic.ImageUrl = "Photos/"+photoList[j];
     pic.MouseEnter+=new System.windows.input.MouseEventHandler(pic_MouseEnter);
     pic.MouseLeave+=new System.windows.input.MouseEventHandler(pic_MouseLeave);
     pic.MouseleftbuttonUp+=new System.windows.input.MousebuttonEventHandler(pic_MouseleftbuttonUp);
     SP.Children.Add(pic);
    }
   }
   //图片总宽度
   totalWIDth = -1.0 * photoWIDth * photoList.Length;
   //设置Canvas的left属性值
   Canvas.Setleft(SP,totalWIDth);
   //创建故事板
   CreateStoryboard();
   sby.Begin();
   //重置大小
   Resize();
  }
  
  //创建故事板
  private voID CreateStoryboard()
  {
   //创建故事板
   sby = new Storyboard();
   //创建DoubleAnimation动画
   DoubleAnimation ad = new DoubleAnimation();
   //设置动画的时间
   ad.Duration = new Duration(TimeSpan.FromSeconds(5.0));
   //设置作用对象的属性
   Storyboard.SetTarget(ad,SP);
   Storyboard.SetTargetProperty(ad,new PropertyPath("(canvas.left)",new Object[0]));
   //将动画添加到故事板中去
   sby.Children.Add(ad);
   //创建动画结束事件
   sby.Completed+=new System.EventHandler(sby_Completed);
   
  }
  
  private voID Fullimage_MouseleftbuttonUp(object sender,System.windows.input.MousebuttonEventArgs e)
  {
   //图片由放大再缩小至指定大小值
   Fullimage.Visibility = Visibility.Collapsed;
  }

  private voID pic_MouseEnter(object sender,System.windows.input.MouseEventArgs e)
  {
   //图片暂时停止
   sby.Pause();
  }

  private voID pic_MouseLeave(object sender,System.windows.input.MouseEventArgs e)
  {
   //图片滚动继续
   sby.Resume();
  }

  private voID pic_MouseleftbuttonUp(object sender,System.windows.input.MousebuttonEventArgs e)
  {
   //显示放大图片
   UC_Pic pic = sender as UC_Pic;
   Fullimage.source = pic.photo.source;
   Fullimage.Visibility = Visibility.Visible;
  }
  
  private voID Resize()
  {
   rg.Rect = new Rect(0,this.ActualWIDth,260);
  }

  private voID UserControl_SizeChanged(object sender,System.windows.SizeChangedEventArgs e)
  {
   // 改变尺寸
   Resize();
  }

  private voID sby_Completed(object sender,System.EventArgs e)  {   // Todo: Add event handler implementation here.   DoubleAnimation ad = (DoubleAnimation)sby.Children[0];   //获取图片组的当前位置   double left = Canvas.Getleft(SP);   //如果图片已经接近最后,则重新设置开始位置   if(left>(totalWIDth-photoWIDth))   {    ad.From = new double?(left);    }   //设置结束位置   ad.By = new double?(totalWIDth);   //开始循环动画   sby.Begin();  } }}

总结

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

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

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

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

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

发表评论

登录后才能评论

评论列表(0条)

保存