Page 1 of 1

[SOLVED] Storyboard TargetProperty Canvas.Left can not work

Posted: Mon Dec 05, 2016 8:49 am
by tomny
Dear JS-Support,

I would like to use the latest version (beta10.5) to achieve a simple animation, but it was unsuccessful. The process is painful, the recording process is as follows:

The following is a simple animation code, this code has been tested in Silverlight is working.
(Note that the following code is in Silverlight :)

Code: Select all

<UserControl.Resources>
        <Storyboard x:Name="Dong1" >
            <DoubleAnimation From="0" To="200" Duration="0:0:5" Storyboard.TargetName="rec1" Storyboard.TargetProperty="(Canvas.Left)" RepeatBehavior="Forever"></DoubleAnimation>
        </Storyboard>
    </UserControl.Resources>
    <Canvas x:Name="LayoutRoot" Background="White">
        <Rectangle Width="100" Height="100" Canvas.Left="0" Canvas.Top="30" Fill="Yellow" x:Name="rec1">
        </Rectangle>
    </Canvas>


Then we use the following code to open the animation, it can work:

Code: Select all

  public MainPage()
        {
            InitializeComponent();
            this.Loaded += MainPage_Loaded;
        }

        private void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            Dong1.Begin();
        }


Below I use the "Silverlight Migration Edition", the code is as follows:

Code: Select all

 <Page.Resources>
        <Storyboard x:Name="Dong1" >
            <DoubleAnimation From="0" To="200" Duration="0:0:5" Storyboard.TargetName="rec1" Storyboard.TargetProperty="(Canvas.Left)" ></DoubleAnimation>
        </Storyboard>
    </Page.Resources>
    <Canvas x:Name="LayoutRoot" Background="White">
        <Rectangle Width="100" Height="100" Canvas.Left="0" Canvas.Top="30" Fill="Yellow" x:Name="rec1">
        </Rectangle>
    </Canvas>


However, it can not compile successfully. Such as the screenshot below:

Image062.png
Image062.png (56.82 KiB) Viewed 6496 times

Look at the situation, it is a namespace problem.

So, I do not use the "Silverlight Migration Edition", but the first direct use of cshtml5 empty project to create, with the above code, it can compile successfully!
Image063.png
Image063.png (26.64 KiB) Viewed 6496 times

But I am happy too early, although the translation was successful, but it can not function properly, being given as follows:
Image064.png
Image064.png (58.57 KiB) Viewed 6496 times


After repeated checks, the problem should be in the properties of the animation, Storyboard.TargetProperty = "(Canvas.Left)" It does not work. I try to use Opacity as the animation property, which is working fine!

To give you trouble,
Best Regards,
Tomny

Re: Storyboard TargetProperty Canvas.Left can not work

Posted: Mon Dec 05, 2016 9:07 am
by JS-Support @Userware
Thank you Tomny, we are going to fix it asap, hopefully in Beta 10.6 expected within 2 weeks.

Regards,
JS-Support

Re: Storyboard TargetProperty Canvas.Left can not work

Posted: Wed Dec 07, 2016 3:44 pm
by tomny
Dear Chris,

thank you for your reply. I am looking forward to the new version.

Regards,
Tomny

Re: Storyboard TargetProperty Canvas.Left can not work

Posted: Tue Mar 21, 2017 5:47 pm
by JS-Support @Userware
Hi,

The ability to animate attached properties such as Canvas.Left and Canvas.Top has now been added to the Beta 10.12 and newer, available from:
http://forums.cshtml5.com/viewforum.php?f=6

Thanks.
Regards,
JS-Support