WPF 无缝图片滚动

上图是效果可以双方向拖动

废话不多说上代码

界面:

1 <Window x:Class="FlashPrac2.MainWindow"  
2         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
3         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
4         Title="MainWindow" Height="200" Width="800" KeyDown="Window_KeyDown" Loaded="Window_Loaded" >
5     <Canvas Width="800" x:Name="cvsGround" Background="Red"  PreviewMouseLeftButtonDown="grdTest_PreviewMouseLeftButtonDown"  
6                     PreviewMouseLeftButtonUp="grdTest_PreviewMouseLeftButtonUp">   
7     </Canvas>
8 </Window>

后台代码:

  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 namespace FlashPrac2
 16 {
 17     /// <summary>  
 18     /// MainWindow.xaml 的交互逻辑  
 19     /// </summary>  
 20     public partial class MainWindow : Window
 21     {
 22         public MainWindow()
 23         {
 24             InitializeComponent();
 25         }
 26 
 27         /// <summary>
 28         /// 创建双精度动画对象  
 29         /// </summary>
 30         DoubleAnimation doubleAnimation = new DoubleAnimation();
 31 
 32         /// <summary>
 33         /// 产生图片的循环变量
 34         /// </summary>
 35         public static int imgCycle = 0;
 36 
 37         /// <summary>
 38         /// 产生图片的数量
 39         /// </summary>
 40         int imgCount = 4;
 41         
 42         /// <summary>  
 43         /// 完成缓冲效果  
 44         /// </summary>  
 45         /// <param name="to">目标位置</param>  
 46         private void DoMove(double to)
 47         {
 48             int Direction = 0;
 49 
 50 
 51             //需要移除的图片列表
 52             List<UIElement> ElementList = new List<UIElement>();
 53 
 54             //添加图片的位置
 55             double endDouble = 0;
 56 
 57             //循环移动图片的位置  并且判断需要删除的图片
 58             foreach (UIElement element in cvsGround.Children)
 59             {
 60                 double transferLeft = Convert.ToDouble(element.GetValue(Canvas.LeftProperty));
 61                 doubleAnimation.To = to + transferLeft;
 62                 element.BeginAnimation(Canvas.LeftProperty, doubleAnimation);//设置动画应用的属性并启动动画 
 63                 transferLeft = Convert.ToDouble(element.GetValue(Canvas.LeftProperty));
 64                 if (to < 0)
 65                 {
 66                     if (transferLeft < -400)
 67                     {
 68                         ElementList.Add(element);
 69                     }
 70                     if (transferLeft > endDouble)
 71                     {
 72                         endDouble = transferLeft;
 73                     }
 74                     Direction = 1;
 75                 }
 76                 else 
 77                 {
 78                     if (transferLeft > cvsGround.Width + 400)
 79                     {
 80                         ElementList.Add(element);
 81                     }
 82                     if (transferLeft < endDouble)
 83                     {
 84                         endDouble = transferLeft;
 85                     }
 86                     Direction = 0;
 87                 }
 88                 
 89             }
 90             //循环删除图片
 91             foreach (UIElement element in ElementList) 
 92             {
 93                 cvsGround.Children.Remove(element);
 94             }
 95 
 96             List<Image> imgList = new List<Image>();
 97 
 98             //考虑每次移动的误差  endDouble 都要 加上图片的 宽度
 99             if (to < 0)
100             {
101                 imgList = ControlsLoad(ElementList.Count, Direction, endDouble + 100);
102             }
103             else 
104             {
105                 imgList = ControlsLoad(ElementList.Count, Direction, endDouble - 100);
106             }
107             
108             //循环移动 添加的图片
109             foreach (UIElement element in imgList)
110             {
111                 double transferLeft = Convert.ToDouble(element.GetValue(Canvas.LeftProperty));
112                 doubleAnimation.To = to + transferLeft;
113                 element.BeginAnimation(Canvas.LeftProperty, doubleAnimation);//设置动画应用的属性并启动动画 
114             }
115             //System.Windows.Forms.MessageBox.Show(cvsGround.Children.Count + "");
116         }
117 
118         private double pressedX;
119         /// <summary>  
120         /// 点击鼠标，记录鼠标单击的位置  
121         /// </summary>  
122         /// <param name="sender"></param>  
123         /// <param name="e"></param>  
124         private void grdTest_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
125         {
126             ////获得鼠标点击的X坐标  
127             pressedX = e.GetPosition(cvsGround).X;
128         }
129 
130         /// <summary>
131         /// 鼠标释放时的操作
132         /// </summary>
133         /// <param name="sender"></param>
134         /// <param name="e"></param>
135         private void grdTest_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
136         {
137             
138            
139             
140             ////获得鼠标释放时的位置  
141             double releasedX = e.GetPosition(cvsGround).X;
142             ////获得距离间隔  
143             double to = releasedX - pressedX;
144             pressedX = 0;
145             ////计算出传送带要的目标位置  
146             
147            
148             DoMove(to);
149         }
150         /// <summary>
151         /// esc关闭窗口
152         /// </summary>
153         /// <param name="sender"></param>
154         /// <param name="e"></param>
155         private void Window_KeyDown(object sender, KeyEventArgs e)
156         {
157             if (e.Key == Key.Escape) 
158             {
159                 System.Environment.Exit(0);
160             }
161         }
162 
163         private void Window_Loaded(object sender, RoutedEventArgs e)
164         {
165             AniamtionLoad();
166             ControlsLoad();
167 
168         }
169 
170         /// <summary>
171         /// 图片的运动方法
172         /// </summary>
173         private void AniamtionLoad() 
174         {
175             doubleAnimation.Duration = TimeSpan.FromSeconds(0.5);//设置动画时间线长度  
176             doubleAnimation.AccelerationRatio = 0.1;//动画加速  
177             doubleAnimation.DecelerationRatio = 0.5;//动画减速  
178             doubleAnimation.FillBehavior = FillBehavior.HoldEnd;//设置动画完成后执行的操作  
179         }
180         /// <summary>
181         /// 产生初始图片
182         /// </summary>
183         private void ControlsLoad() 
184         {
185             
186             for (int i = -4 ; i < 30; i++)
187             {
188                 
189                 // Create the image element.
190                 Image simpleImage = new Image();
191                 simpleImage.Width = 100;
192                 Canvas.SetLeft(simpleImage, i * 100);
193 
194                
195                 // Set the image source.
196                 simpleImage.Source = createImg();
197 
198                 cvsGround.Children.Add(simpleImage);
199             }
200         }
201         /// <summary>
202         /// 循环产生图片
203         /// </summary>
204         /// <param name="num">产生图片的个数</param>
205         /// <param name="Direction">产生图片的方向</param>
206         /// <param name="Location">产生图片的位置</param>
207         /// <returns></returns>
208         private List<Image> ControlsLoad(int num, int Direction, double Location)
209         {
210             List<Image> imgList = new List<Image>();
211             for (int i = 0; i < num; i++)
212             {
213                 
214                 Image simpleImage = new Image();
215                 simpleImage.Width = 100;
216 
217                 if (Direction == 1) 
218                 {
219                     Canvas.SetLeft(simpleImage, i * 100 + Location);
220                 }
221                 else
222                 {
223                     Canvas.SetLeft(simpleImage, -i * 100 + Location);
224                 }
225 
226 
227 
228                 simpleImage.Source = createImg();
229                 cvsGround.Children.Add(simpleImage);
230                 imgList.Add(simpleImage);
231             }
232             return imgList;
233         }
234 
235 
236         /// <summary>
237         /// 循环产生照片
238         /// </summary>
239         /// <returns></returns>
240         public BitmapImage createImg()
241         {
242             imgCycle++;
243             if (imgCycle > imgCount)
244             {
245                 imgCycle = 1;
246             }
247             Console.WriteLine(imgCycle);
248             // Create source.
249             BitmapImage bi = new BitmapImage();
250             // BitmapImage.UriSource must be in a BeginInit/EndInit block.
251             bi.BeginInit();
252             bi.UriSource = new Uri(@"/res/" + imgCycle + ".jpg", UriKind.RelativeOrAbsolute);
253             bi.EndInit();
254             // Set the image source.
255 
256             return bi;
257         }
258       
259 
260     }
261 }

转帖请注明出处林夕木大大