c# - Clon canvas to dynamic viewbox WPF -

having main window , canvas class graphcontext animations , several shapes interact like:

xaml

<dockpanel name="stackpanel2" dockpanel.dock="left" margin="10,10,10,10" lastchildfill="true" >       <myctrl:graphcontext x:name="graphsurface" background="black" >       </myctrl:graphcontext> </dockpanel> 

code

public class graphcontext : canvas     {          ellipse _fixedcircle;         internal int cavaswidth { get; set; }         internal int cavasheight { get; set; }          public void drawsinglepoint(solidcolorbrush color)         {             this.children.clear();             _fixedcircle = new ellipse();             _fixedcircle.width = 25;             _fixedcircle.height = 25;             _fixedcircle.stroke = color;             _fixedcircle.fill = color;             _fixedcircle.strokethickness = 3;             // center x , y coordinates             double x = this.actualwidth / 2 ;             double y = this.actualheight / 2 ;             _fixedcircle.margin = new thickness(x, y, 1, 1);             // add circle canvas             this.children.add(_fixedcircle);             this.invalidatevisual();         }    ... } 

i want clon graphcontext inside other maximized canvas in second other monitor maybe using viewbox.

i have tried

canvas copycanvas = xamlreader.parse(xamlwriter.save(graphsurface)) canvas; viewbox vb = new viewbox() { stretchdirection = stretchdirection.both, stretch=stretch.uniform }; vb.child = copycanvas; window newwin = new window() { content = vb }; newwin.show(); 

however when graphsurface updated copycanvas not updated. see point, when instance animation using storyboard codebehind copycanvas not updated.

what need copycanvas mirror of graphsurface ?

do need copy logic other control?, way same, maybe little delay...

maybe databinding canvas viewbox it, how be?

you use visualbrush, example1; example2

so basically, can create visualbrush , data-bind current graphcontext visual property, creates duplicate image of graphcontext.

code in main window:

mirrorwindow newwin = new mirrorwindow (); newwin.datacontext = graphsurface; newwin.show(); 

xaml mirroring window:

 <grid>         <grid.background>             <visualbrush stretch="uniform" visual="{binding}"/>         </grid.background>  </grid> 

sample:

mainwindow basic canvas , animation on mousedown:

<window x:class="wpfapplication1.mainwindow"         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"         title="mainwindow" height="350" width="525">     <grid>         <canvas background="black" x:name="graphsurface">             <canvas.triggers>                 <eventtrigger routedevent="mousedown">                     <beginstoryboard>                         <storyboard>                             <coloranimation  to="red" storyboard.targetproperty="(background).(solidcolorbrush.color)" fillbehavior="stop" duration="0:0:5"/>                         </storyboard>                     </beginstoryboard>                 </eventtrigger>             </canvas.triggers>         </canvas>     </grid> </window> 

mirroring window:

<window x:class="wpfapplication1.mirror"         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"         title="mirror" height="300" width="300">     <grid>         <grid.background>             <visualbrush stretch="fill" visual="{binding}"/>         </grid.background>     </grid> </window> 

mainwindow code behind:

public partial class mainwindow : window {     public mainwindow()     {         initializecomponent();         mirror mm = new mirror();         mm.datacontext = this.graphsurface;         mm.show();     }         } 

result: mouse click on mainwindow, both mainwindow , mirror show color change animation.