要求:四张图片水平滚动,每隔5秒进行一次循环,点击按钮随机变更图片。

XAML前台代码:

  1. <Window x:Class="图片滚动.MainWindow"
  2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4. Loaded="Window_Loaded"
  5. Title="MainWindow"
  6. Height="350"
  7. Width="525">
  8. <Viewbox>
  9. <Canvas Width="1241" Height="768" Name="ImageCanvas" Background="SkyBlue">
  10. <Canvas x:Name="canvas_photo" Width="1242" Height="200">
  11. <Image x:Name="image1" Width="200" Height="200"
  12. Canvas.Left="0" Source="F:\zcWPF入门\图片滚动\图片滚动\bin\Debug\Images\4.jpg">
  13. </Image>
  14. <Image x:Name="image3" Width="200" Height="200"
  15. Canvas.Left="420" Source="F:\zcWPF入门\图片滚动\图片滚动\bin\Debug\Images\6.jpg" Canvas.Top="0">
  16. </Image>
  17. <Image x:Name="image4" Width="200" Height="200"
  18. Canvas.Left="620" Source="F:\zcWPF入门\图片滚动\图片滚动\bin\Debug\Images\7.jpg" Canvas.Top="0">
  19. </Image>
  20. <Image x:Name="image2" Width="200" Height="200" Canvas.Left="218" Source="F:\zcWPF入门\图片滚动\图片滚动\bin\Debug\Images\5.jpg" Canvas.Top="0"></Image>
  21. </Canvas>
  22. <Button Canvas.Left="303" Canvas.Top="474" Content="Button" Height="77"
  23. Name="button1" Width="184" Click="button1_Click" />
  24. </Canvas>
  25. </Viewbox>
  26. </Window>

C#后台代码:

  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Text;
  5. using System.Windows;
  6. using System.Windows.Controls;
  7. using System.Windows.Data;
  8. using System.Windows.Documents;
  9. using System.Windows.Input;
  10. using System.Windows.Media;
  11. using System.Windows.Media.Imaging;
  12. using System.Windows.Navigation;
  13. using System.Windows.Shapes;
  14. using System.Windows.Media.Animation;
  15. using System.Windows.Threading;
  16. using System.IO;
  17.  
  18. namespace 图片滚动
  19. {
  20. /// <summary>
  21. /// MainWindow.xaml 的交互逻辑
  22. /// </summary>
  23. public partial class MainWindow : Window
  24. {
  25. private System.Windows.Threading.DispatcherTimer dTimer = new DispatcherTimer();
  26. List<string> listPath = new List<string>();
  27. //设定图片集合
  28. List<Image> listImg = new List<Image>();
  29.  
  30. double position = 0.0;
  31.  
  32. public MainWindow()
  33. {
  34. InitializeComponent();
  35. }
  36.  
  37. private void Window_Loaded(object sender, RoutedEventArgs e)
  38. {
  39.  
  40. listImg.Add(image1);
  41. listImg.Add(image2);
  42. listImg.Add(image3);
  43. listImg.Add(image4);
  44.  
  45. DoubleAnimation animation = new DoubleAnimation();
  46. //animation.From = 0;
  47. //animation.To = 250;
  48. animation.RepeatBehavior = RepeatBehavior.Forever;
  49. animation.Duration = TimeSpan.FromSeconds();
  50. image1.BeginAnimation(Canvas.LeftProperty, animation);
  51. //image1.BeginAnimation(Canvas.TopProperty, animation);
  52.  
  53. loadInfo();
  54.  
  55. //dTimer.Tick += new EventHandler(dTimer_Tick);
  56. //dTimer.Interval = new TimeSpan(0, 0, 5);
  57. //dTimer.Start();
  58.  
  59. //每30毫秒触发一次定时器
  60. dTimer.Tick += new EventHandler(dTimer_Tick);
  61. dTimer.Interval = TimeSpan.FromMilliseconds();
  62. dTimer.Start();
  63.  
  64. }
  65.  
  66. //遍历加载指定文件下的文件
  67. public void loadInfo()
  68. {
  69. string floderPath = System.Environment.CurrentDirectory + "\\Images\\";
  70. DirectoryInfo TheFolder = new DirectoryInfo(floderPath);
  71. foreach (FileInfo NextFile in TheFolder.GetFiles())
  72. {
  73. listPath.Add(NextFile.FullName);
  74. }
  75. }
  76.  
  77. private string Window_Loaded(int index)
  78. {
  79. return System.Environment.CurrentDirectory + "\\Images\\" + index.ToString() + ".jpg";
  80. }
  81.  
  82. //int i;
  83. private void dTimer_Tick(object sender, EventArgs e)
  84. {
  85. //if(Mouse)
  86. foreach (var item in listImg)
  87. {
  88. position = Canvas.GetLeft(item);
  89. //图片进行两个位置的移动
  90. position = position + ;
  91. //判断如果越界了
  92. if (position > this.canvas_photo.Width + )
  93. {
  94. //则回到起点图片零起点
  95. Canvas.SetLeft(item, );
  96. }
  97. else
  98. {
  99. //没有越界则继续移动
  100. Canvas.SetLeft(item, position);
  101. }
  102. }
  103. //for (i = 0; i < listImg.Count; i++)
  104. //{
  105. // position = Canvas.GetLeft(listImg[i]);
  106. // position = position + 2;
  107. // if (position > this.canvas_photo.Width + 200)
  108. // {
  109. // Canvas.SetLeft(listImg[i], 0);
  110. // }
  111. // else
  112. // {
  113. // Canvas.SetLeft(listImg[i], position);
  114. // }
  115. //}
  116. }
  117.  
  118. //int imageIndex = 0;
  119. private void button1_Click(object sender, RoutedEventArgs e)
  120. {
  121. //随机事件
  122. Random ran = new Random();
  123. int RandKey = ran.Next(, ) % listPath.Count;
  124. listImg[(new Random().Next(, )) % listImg.Count].Source = new BitmapImage(new Uri(listPath[RandKey]));
  125. }
  126. }
  127. }

【demo练习三】:图片水平滚动、点击按钮变更图片动画的更多相关文章

  1. [iOS] UICollectionView实现图片水平滚动

    最新更新: 简单封装了一下代码,参考新文章:UICollectionView实现图片水平滚动 先简单看一下效果: 新博客:http://wossoneri.github.io 准备数据 首先先加入一些 ...

  2. JQuery实现点击按钮切换图片(附源码)--JQuery基础

    JQuery实现切换图片相对比较简单,直接贴代码了哈,有注释噢!疑问请追加评论哈,不足之处还请大佬们指出! 1.案例代码: demo.html: <!DOCTYPE html><ht ...

  3. javascript总结36:DOM-点击按钮切换图片案例

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8& ...

  4. 鼠标点击按钮控制图片移动或者键盘控制图片移动(解决问题:parseInt失效问题,用Number)

    在测试用鼠标点击按钮,使图片左右上下移动: 效果如下: 代码如下: <!DOCTYPE html> <html lang="en"> <head> ...

  5. JAVA Eclipse如何设置点击按钮切换图片

    右击图片文件夹,新建一个Android XML文件   设置文件的名称,注意这个新建的xml文件就是会被用作按钮的background属性的,所以名字不要太奇怪,设置Root Element为sele ...

  6. CSS3和js炫酷点击按钮3D翻转动画特效

    简要教程 flipside是一款使用CSS3和js制作的炫酷点击按钮无缝过渡到确认面板的过渡动画特效.该点击按钮特效在按钮不同方向的边部点击时,产生的过渡动画特效是不一样的. 在线预览   源码下载 ...

  7. JS特效——图片水平滚动

    具体源码如下: <!doctype html> <html lang="en"> <head> <meta http-equiv=&quo ...

  8. [iOS] WSHorizontalPickerView 图片水平滚动封装

    之前这篇文章传送门本来是记录自己练手的demo的,后来很多人来问我要代码.今天就抽时间封装了一下,没有考虑太多情况,等我有空再去仔细考虑吧. 代码在:Github 用法很简单,创建对象,设置数据源,记 ...

  9. Android_ViewPager_实现多个图片水平滚动

    1.示意图                       2.实现分析 (1).xml配置 <!-- 配置container和pager的clipChildren=false, 并且指定margi ...

随机推荐

  1. 拖动层 拖动div 封装js 貌似不兼容FF,郁闷

    原文发布时间为:2009-12-02 -- 来源于本人的百度文章 [由搬家工具导入] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tran ...

  2. 用email实现邮件模板

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. Day 29 process&thread_1

    进程和线程 1 进程(process): 1.定义: 最小的执行单元.进程就是一个程序在一个数据集上的一次动态执行过程. 进程一般由程序.数据集.进程控制块三部分组成: 我们编写的程序用来描述进程要完 ...

  4. django 模型生成sql(多对多)

    模型如下: class Publisher(models.Model): name = models.CharField(max_length=30) address = models.CharFie ...

  5. ubuntu16.04安装docker CE

    如需开始在 Ubuntu 上使用 Docker CE,请确保您满足先决条件,然后再安装 Docker. 如需安装 Docker 企业版 (Docker EE),请转至获取适用于 Ubuntu 的 Do ...

  6. vue element-ui Tabs 标签页实现【更多】功能

    element-ui Tabs本身是没有更多功能的,如果在外边添加一个更多按钮,又非常不好看, 而利用API中Tabs Attributes的before-leave勾子方法可以实现这个功能, 简单P ...

  7. (5)php数组

    定义数组 $arr=array('篮球','自行车','海贼王'); 打印指定数组 echo $arr[0]; 打印全部数组 print_r($arr); 改变数组的值 $arr[0]='足球'; 赋 ...

  8. centos7安装hadoop2.6.1,详细教程

    1.我搭建的是三台centos7的环境 首先准备三个centos7(文中出现的所有的链接都是我自己的) centos7下载地址(也可以上官网自行下载):https://pan.baidu.com/s/ ...

  9. Android-Handler消息机制实现原理

    一.消息机制流程简介 在应用启动的时候,会执行程序的入口函数main(),main()里面会创建一个Looper对象,然后通过这个Looper对象开启一个死循环,这个循环的工作是,不断的从消息队列Me ...

  10. Java中获取当前时间并格式化

    主要有两种方式,其中使用Date比较好控制,代码如下: //使用Calendar Calendar now = Calendar.getInstance(); System.out.println(& ...