控件代码已经更新,支持上下左右四个方向。VS2010工程

/Files/RMay/WPF_Marquee/WpfMarquee.zip

我们知道在html中有一个marquee标签,可以很方便的实现文字滚动的效果,比如如下简单的声明:

<marquee loop="3" behavior="scroll">文本信息<marquee>

在WPF里面,当然,我们可以用Animation和Storyboard来达到同样的效果,但是感觉总是不那么好,每次都需要做动画。而且设置动画的属性很麻烦。能不能就像HTML简单的声明就行了呢?比如:

<l:Marquee Content="123" Direction="Right" Behavior="Scroll" ScrollAmount="20" ScrollDelay="500"/>

能够这样简单的指定属性来使用。

下面我们就用开发CustomControl的方式来打造一个Marquee控件。

首先,我们添加一个自定义控件,这个控件继承自ContentControl,因为它的里面可以放任何东西,而不仅仅限于文本。

接着,仿造html中的marquee标签,定义一些必要的属性。这些属性都是DependencyProperty。

【WPF】用CustomControl打造WPF版的Marquee

接下来我们需要写动画的逻辑了。有三种方式来写这个动画:

1、利用系统的Animation和Storyboard

2、在CompositionTarget的Rendering事件中写动画

3、利用DispatcherTimer写动画

我们这儿动画的行为有好几种,比较复杂,利用系统的动画方式来写会很麻烦,并且这儿有一个ScrollDelay属性来控制延时,在CompositionTarget的Rendering事件中不太好控制,因此,最后我选择用DispatcherTimer,在它的Tick事件中写动画逻辑。

动画的逻辑主要就是改变Content的位移,需要注意的是,这个位移是通过TranlateTransform来实现的。

部分代码如下:

 

 contentWidth;
                    }
                }
            }
        }

 

更详尽的内容可以直接参看源码。

使用的时候非常简单

>

 

 

【WPF】用CustomControl打造WPF版的Marquee

需要注意的是,如果设定了Loop,当Loop结束的时候,我并没有停止Timer,这样在Window Resize之后动画会重新播放。读者可以将选择其Stop掉,而在ResetAnimation方法中重新启动。

源码下载:

/Files/RMay/WPF_Marquee/WpfMarquee.rar

相关文章:

  • 2021-08-27
  • 2022-03-08
  • 2022-02-12
  • 2021-11-05
  • 2022-12-23
  • 2021-07-31
猜你喜欢
  • 2021-11-13
  • 2021-09-24
  • 2022-12-23
  • 2022-12-23
  • 2021-05-12
  • 2021-12-06
相关资源
相似解决方案