c# - wpf animation -- mouse down event doesn't work -

there blue rectangle moving left side of window right different distance every time.

either clicking rectangle or animation completed, rectangle start moving again left side.

if rectangle clicked, color of turn green duration of 0.3s.

but mousedown event seemed not start coloranimation , moving distance/duration of rectangle not correct neither.

private int i; private storyboard hittargetstoryboard; private list<double> dislist;  private void window_loaded(object sender, routedeventargs e) {     dislist = new list<double>{.......};  // init list of values.      /* create rectangle */     rectangle rect = new rectangle();     this.registername("rect", rect);     rect.height = this.actualheight;     rect.width = 50;     canvas.settop(rect, 0);     canvas.setleft(rect, 0);      /* fill rect solid brush */     solidcolorbrush targetrectbrush = new solidcolorbrush(colors.blue);     this.registername("targetrectbrush", targetrectbrush);     rect.fill = targetrectbrush;      /* add mouse down event */     rect.mousedown += rect_mousedown;      /* add rect canvas */     mycanvas.children.add(rect);      /* create coloranimation change color smoothly */     coloranimation hitca = new coloranimation();     hitca.to = colors.green;     hitca.duration = timespan.fromseconds(0.3);     hitca.completed += hitca_completed;      /* create storyboard , add coloranimation */     hittargetstoryboard = new storyboard();     storyboard.settargetname(hitca, "targetrectbrush");     storyboard.settargetproperty(hitca, new propertypath(solidcolorbrush.colorproperty));     hittargetstoryboard.children.add(hitca);      = 0;     targetanimation(i); }   /* move rect 0--dislist[i] */ private void targetanimation(int i) {     (this.findname("rect") rectangle).fill = brushes.blue;     doubleanimation da = new doubleanimation();     da.from = 0;     da.to = dislist[i];     da.duration = timespan.fromseconds(5);      storyboard.settargetname(da, "rect");     storyboard.settargetproperty(da, new propertypath(canvas.leftproperty));     storyboard storyboard = new storyboard();     storyboard.children.add(da);     storyboard.completed += storyboard_completed;     storyboard.begin(this); }  /* if rect clicked, change color green */ private void rect_mousedown(object sender, mousebuttoneventargs e) {     hittargetstoryboard.begin(this); }  /* after color changed, rect starts on */ private void hitca_completed(object sender, eventargs e) {     targetanimation(++i); }  /* if rect not clicked, start on */ private void storyboard_completed(object sender, eventargs e) {     targetanimation(++i); } 

update:

delete :(this.findname("rect") rectangle).fill = brushes.blue;

add : hitca.from = colors.blue;

coloranimation works well.

still:

if delete storyboard_completed or hitca_completed, movement of rect goes well. while if have both, movement runs wrong way.

update 2:

edit: storyboard.begin(this, true) in targetanimation(int i) method.

add: stroyboard.stop(this) in hitca_completed method.

without setting iscontroallable true, storyboard not controllable.

solved

your problem here:

(this.findname("rect") rectangle).fill = brushes.blue; 

first of all, easier make rect field , set fill property directly:

rect.fill = brushes.blue; 

that wouldn't color animation, though. you've set animation work targetrectbrush -- no longer fills rect since you've replaced it. removing 1 line animates color.

update

here's tweaked version:

public partial class mainwindow {     private int i;     private storyboard hittargetstoryboard;     private list<double> dislist;     private rectangle rect;      public mainwindow()     {         initializecomponent();         loaded += window_loaded;     }      private void window_loaded(object sender, routedeventargs e)     {         dislist = new list<double> {10, 20, 30, 40, 50, 60, 70, 80, 90, 100 };  // init list of values.          /* create rectangle */         rect = new rectangle();         this.registername("rect", rect);         rect.height = this.actualheight;         rect.width = 50;         canvas.settop(rect, 0);         canvas.setleft(rect, 0);          /* fill rect solid brush */         solidcolorbrush targetrectbrush = new solidcolorbrush(colors.blue);         this.registername("targetrectbrush", targetrectbrush);         rect.fill = targetrectbrush;          /* add mouse down event */         rect.mousedown += rect_mousedown;          /* add rect canvas */         mycanvas.children.add(rect);          /* create coloranimation change color smoothly */         coloranimation hitca = new coloranimation             {                 = colors.blue, // (instead of setting fill blue)                 = colors.green,                 duration = timespan.fromseconds(0.3),                 fillbehavior = fillbehavior.stop, // returns blue             };         hitca.completed += hitca_completed;          /* create storyboard , add coloranimation */         hittargetstoryboard = new storyboard();         storyboard.settargetname(hitca, "targetrectbrush");         storyboard.settargetproperty(hitca, new propertypath(solidcolorbrush.colorproperty));         hittargetstoryboard.children.add(hitca);          = 0;         targetanimation(i);     }       /* move rect 0--dislist[i] */     private void targetanimation(int i)     {         = % dislist.count; // don't overflow          doubleanimation da = new doubleanimation             {                 = 0,                 = dislist[i],                 duration = timespan.fromseconds(5),             };          storyboard.settargetname(da, "rect");         storyboard.settargetproperty(da, new propertypath(canvas.leftproperty));         storyboard storyboard = new storyboard();         storyboard.children.add(da);         storyboard.completed += storyboard_completed;         storyboard.begin(this);     }      /* if rect clicked, change color green */     private void rect_mousedown(object sender, mousebuttoneventargs e)     {         hittargetstoryboard.begin(this);     }      /* after color changed, rect starts on */     private void hitca_completed(object sender, eventargs e)     {         targetanimation(++i);     }      /* if rect not clicked, start on */     private void storyboard_completed(object sender, eventargs e)     {         targetanimation(++i);     } } 

what problem seeing distance/duration?