最近在一个外网的网站,困扰了我多天的循环和大家分享下,也做为我以后工作之用.第一种(信息作用循环.实现方式后台时钟在前台循环滚动(左右)显示).
2011-11-19 09:23
831 查看
为了方便初学者我把实验代码的源码都公布了出来.
前台页面:
<UserControl x:Class="listScroll.MainPage"
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">
<Canvas Name="canMain" Width="300" Height="300">
<TextBlock Name="tbmarquee"></TextBlock><!-- 用于循环信息显示之用-->
</Canvas>
<!-- 呈现自元素的容器 -->
</UserControl>
后台代码:
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;
namespace listScroll
{
public partial class MainPage : UserControl
{
public MainPage()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(MainPage_Loaded);
}
void MainPage_Loaded(object sender, RoutedEventArgs e)
{
//产生时钟的模拟操作,同时把时间赋值给前台显示控件
this.tbmarquee.Text = string.Concat("TimerWindow ", DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"));
TopToBottomMarquee();
}
private void TopToBottomMarquee()
{
// 定义一个矩形,把循环的信息放在矩形中.
RectangleGeometry rectangleGeometry = new RectangleGeometry();
rectangleGeometry.Rect = new Rect(new Point(0, 0), new Size(canMain.Width, canMain.Height));
canMain.Clip = rectangleGeometry;
double width = canMain.Width - tbmarquee.ActualWidth;
double jleft = width/2;
tbmarquee.Margin = new Thickness(jleft, 0, 0, 0);
DoubleAnimation doubleAnimation = new DoubleAnimation();
doubleAnimation.From = -tbmarquee.ActualHeight;
doubleAnimation.To = canMain.Height;
doubleAnimation.RepeatBehavior = RepeatBehavior.Forever;
doubleAnimation.Duration = new Duration(TimeSpan.FromSeconds(1)); //循环时间
Storyboard storyboard = new Storyboard();
storyboard.Children.Add(doubleAnimation);
Storyboard.SetTarget(doubleAnimation, tbmarquee);
Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("(Canvas.Top)"));//Canvas.Top:上下信息循环显示,Canvas.Left :信息左右循环显示
storyboard.Begin();
}
}
}
如果转载请说明出处.
前台页面:
<UserControl x:Class="listScroll.MainPage"
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">
<Canvas Name="canMain" Width="300" Height="300">
<TextBlock Name="tbmarquee"></TextBlock><!-- 用于循环信息显示之用-->
</Canvas>
<!-- 呈现自元素的容器 -->
</UserControl>
后台代码:
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;
namespace listScroll
{
public partial class MainPage : UserControl
{
public MainPage()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(MainPage_Loaded);
}
void MainPage_Loaded(object sender, RoutedEventArgs e)
{
//产生时钟的模拟操作,同时把时间赋值给前台显示控件
this.tbmarquee.Text = string.Concat("TimerWindow ", DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"));
TopToBottomMarquee();
}
private void TopToBottomMarquee()
{
// 定义一个矩形,把循环的信息放在矩形中.
RectangleGeometry rectangleGeometry = new RectangleGeometry();
rectangleGeometry.Rect = new Rect(new Point(0, 0), new Size(canMain.Width, canMain.Height));
canMain.Clip = rectangleGeometry;
double width = canMain.Width - tbmarquee.ActualWidth;
double jleft = width/2;
tbmarquee.Margin = new Thickness(jleft, 0, 0, 0);
DoubleAnimation doubleAnimation = new DoubleAnimation();
doubleAnimation.From = -tbmarquee.ActualHeight;
doubleAnimation.To = canMain.Height;
doubleAnimation.RepeatBehavior = RepeatBehavior.Forever;
doubleAnimation.Duration = new Duration(TimeSpan.FromSeconds(1)); //循环时间
Storyboard storyboard = new Storyboard();
storyboard.Children.Add(doubleAnimation);
Storyboard.SetTarget(doubleAnimation, tbmarquee);
Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("(Canvas.Top)"));//Canvas.Top:上下信息循环显示,Canvas.Left :信息左右循环显示
storyboard.Begin();
}
}
}
如果转载请说明出处.
相关文章推荐
- 以前经常来这里,但是很少写博客.最近在做silverlight 项目.前几天被一个 类似.netmarquee的循环滚动的功能憋了很长时间,现在和大家分享下.
- 给大家提供一个C#2.0的网站后台文章上传与前台显示的代码!呵呵!fckeditor大家自己调哦!
- 有段时间没有更新博客了,最近比较忙,今天和大家分享一个使用Swift实现的新特性功能吧
- 网站滚动公告信息的实现方式
- 大家工作还好吗?分享一个信息:主架构师
- 最近被一个问题困扰着,如何实现类似Photoshop的多层图像操作,每层可单独操作,又可以组合显示出来。
- 研究了一段时间siverlight,最近需要实现一个动画,此动画是循环滚动的动画
- 最近学习框架做了一个小网站,基本功能都实现了但是分页没办法用框架思想实现,查了资料找到一个不错的,修改了下分享下
- 本文实例讲述了AngularJS+bootstrap实现动态选择商品功能。分享给大家供大家参考,具体如下: 项目中后台一个商品库,新建活动时动态选择所需商品
- 一个流行且实用的JS表单验证提示,演示了怎么自定义错误信息的显示方式,同时通过写FormValid.showError类方法来实现错误显示方式自定义: errMsg 是一个错误消息的数组,这样方便自定
- 研究了一段时间siverlight,最近需要实现一个动画,此动画是循环滚动的动画(2)
- 最近本人每天会花5分钟把前5年的工作内容做一个总结,并分享成多篇博客,让大家可以学习,交流。
- 最近做了一个Mqtt消息推送,和大家分享分享心得,以防以后搞忘了,新人第一次写博客,大神勿喷。
- 通过模仿AsyncTask的封装方式,实现一个后台预读数据的线程,(使用AsyncTask有导致应用FC的风险)
- 将后台数据读取到前台的EXCEL文件中去,用javascript实现.(发一个原创)
- 大家很容易忽视的几个问题,1.投简历请换位思考、2.前台页面设计比后台实现更值钱
- 从外网访问内网本机的网站实现方法分享
- 社交工具发表信息日期的显示方式实现
- jquery 页眉单行信息滚动显示实现思路及代码
- 【工作记录0013】easyui中datagrid绑定,后台可读出数据,前台未显示的解决方法