WPF implements line-painting animation effect and wpf line-painting Animation

WPF implements line-painting animation effect and wpf line-painting Animation

This article provides examples to share with you the specific code for implementing line-drawn animation in WPF for your reference. The specific content is as follows:

Requirement: a straight line (not a curve) is drawn gradually on the canvas like a model stroke. However, the premise is that it is implemented using background code instead of the WPF tag.

Effect:

Code:

/// <Summary> /// interaction logic of Window2.xaml /// </summary> public partial class Window2: Window {public Window2 () {InitializeComponent (); var canvas = new Canvas (); Content = canvas; var points = new List <Point> () {new Point (10, 10), new Point (90, 90 ), new Point (60, 10), new Point (250, 90), new Point (10, 10)}; var sb = new Storyboard (); for (int I = 0; I <points. count-1; I ++) {var lineGeometry = new LineGeometry (points [I], points [I]); var path = new Path () {Stroke = Brushes. black, StrokeThickness = 2, Data = lineGeometry}; canvas. children. add (path); var animation = new PointAnimation (points [I], points [I + 1], new Duration (TimeSpan. fromMilliseconds (1000) {BeginTime = TimeSpan. fromMilliseconds (I * 1010)}; sb. children. add (animation); RegisterName ("geometry" + I, lineGeometry); Storyboard. setTargetName (animation, "geometry" + I); Storyboard. setTargetProperty (animation, new PropertyPath (LineGeometry. endPointProperty);} MouseDown + = (s, e) => sb. begin (this );}}

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.