Devo fare uno zoom di un oggetto Canvas ed ho pensato di farlo ricorrendo ad alcune animazioni che applicano delle trasformazioni di tipo TranslateTransform e ScaleTransform sul Canvas stesso.

Cosi ho creato un oggetto TransformGroup a cui ho aggiunto come figli le due trasformazioni:

codice:
Dim transformGroup as New TransformGroup
Dim translateTransform as New TranslateTransform
Dim zoomTransform as new ScaleTransform

transformGroup.Children.Add(zoomTransform);
transformGroup.Children.Add(translateTransform);
Ed ho impostato la proprietà RenderTransform del mio Canvas:
codice:
MyCanvas.RenderTransform = transformGroup;
Fatto ciò per lo zoom è sufficiente avviare due trasformazioni per la TranslateTransform (lungo asse x e y) e altre due (sempre per gli stessi assi) per la ScaleTransform:

codice:
translateTransform.BeginAnimation(TranslateTransform.XProperty, New DoubleAnimation With {.To = 3})
translateTransform.BeginAnimation(TranslateTransform.YProperty, New DoubleAnimation With {.To = 10})
zoomTransform.BeginAnimation(ScaleTransform.ScaleXProperty, New DoubleAnimation With {.To = 2})
zoomTransform.BeginAnimation(ScaleTransform.ScaleYProperty, New DoubleAnimation With {.To = 2})
Ora, i valori delle animazioni del mio esempio sono casuali, in realtà utilizzo posizioni fisiche e logiche del mouse rispetto al Canvas per ottenere una posizione finale di zoom corretta (cosa che effettivamente è).

Il problema sta nel fatto che quando viene avviata l'animazione sembra che inizialmente parta l'animazione legata alla scala e poco dopo quella legata alla traslazione, il che crea un effetto davvero spiacevole. Ho provato anche ad utilizzare una storyboard (che ora utilizzo invece dell'esempio che ho fatto vedere) pensando al fatto che con questa il timer per la partenza delle animazioni fosse necessariamente lo stesso per tutte (differentemente dall'utilizzo di BeginAnimation), tuttavia il risultato è lo stesso.

Come posso risolvere?
Grazie.