Architectural limitations of WPF - XAML animation

----Goal--------

I wanted to define an animation in XAML and control it in C#.

So I DID NOT WANT to define any EventTriggers, RoutedEvents
or SourceNames for a StoryBoard animation. I tryed the code below.

<StackPanel>
<Storyboard x:Name="Animate_status_block_01_skp_sbd_ctr" >
<DoubleAnimation
Storyboard.TargetName="Status_block_05_skp_ctr"
Storyboard.TargetProperty="Height"
From="80" To="0" Duration="0:0:3" AutoReverse="true"
/>
</Storyboard>
</StackPanel>

----Problem-----

The runtime error is:

XAML Parse Error
Error Object : Animate_status_block_01_skp_sbd_ctr
Error Message : 'Storyboard' object cannot be added to 'StackPanel'.

Cannot add instance of type 'Storyboard' to a collection of type
'UIElementCollection'.
Only items of type 'UIElement' are allowed.
Error at
object 'Animate_status_block_01_skp_sbd_ctr'
in markup file

'Storyboard_05_win_app_02;component/aaa_viewport/app_viewport_cls.xaml' Line
556 Position 18.

----Request-----

Is there a way in XAML to define a Storyboard without the event control
constructs???

---Discussion------

For those of you with time on your hands ... :-)

Although I'm new to the WPF/XAML architecture it seems their
Animation/Eventing design is targeted to animated controls and not animated
applications (layout - panel level animation) since the EventTrigger -
RoutedEvent - SourceName scope is all 'inward' where animations are parent
based and child triggered.

Note : I'm new to WPF - XAML an have only coded WPF-XAML
for a few weeks (since Jan 1 2007).

Also Note : I have not tryed the C# only - local animation approach -
since I want to leverage as much of the XAML architecture as possible
(but do most of the trigger control from C#). So this architectural
discussion/question is for WPF-XAML designs.

I'm hoping I'm wrong about the architectural limitations of
the current (.Net 3.0 RTM) WPF-XAML animation design.

[1] I want to animate a major panel of a WPF application (without using
an Expander control) for a hide-show, hidden panel type of design.
So I want to animation width/height from 0 to 'Auto' or '*' maximum
size.

[2] I want to trigger the hide/close from a toolbar button and/or
a menu selection (ie. from a C# method of the main application viewport).
So the StoryBoard.Begin(my_control) approach is what I would like to do.
This works but a 'bug' appears in all code because the animation EventTrigger
will be mis-triggered due to its (designed requirement) need
for a locally scoped SourceName for the RoutedEvent.
Also I do not need a 'controllable animation' for pause, restart, etc.
I just need a begin animation (with two animations defined - one open, one
close).

After going through the MS documentation (also forums, blogs, etc)
it seems that WPF-XAML animation is limited to 'control animation'.
Application level 'Panel animation' does not seem to be a consideration
of the design.

By 'control animation' I mean that the animation of a control like
a button or a media viewer. By 'Panel animation' I mean a section
of a standard 'panel' area like the 'status panel', 'navigation panel'
or 'data panel'.

The two animation constructs (architectural features done somehow in code)
I wanted were:

[1] Value animation targeted to 'Auto' and '*' values.
[2] External event sources to trigger animations (EventTrigger with no
RoutedEvent).

In [1] all SDK and book code (I have Petzold's and Nathans book code) that
I have searched through do not contain DoubleAnimation target values of
'Auto' and '*' (From, To, etc).

In [2] the StoryBoard (a) Must contain an EventTrigger that (b) MUST (by
design) contain a
RoutedEvent that (c) MUST have a SourceName 'under' (within the animated
parent event scope).
I would prefer a StoryBoard architecture that did not require a tirggering
event to be defined.
In this way I could just define the animation in XAML and control it in WPF
C#.

I do not expect that [1] is possible in the first version RTM) WPF-XAML
architecture.

I do hope that [2] is possible using an animation technique that I am
(currently) not
aware of.

If any one has any comments (good or bad) please feel free to respond :-)

Shawnk

PS. Sorry for the length of this post - would like a Sr. level architectural
comment
PPS. Note - I do not have an XAML/WPF books at this point - just using the
Microsoft help docs.

Hi,

Shawnk wrote:
> ----Goal--------
>
> I wanted to define an animation in XAML and control it in C#.
>
> So I DID NOT WANT to define any EventTriggers, RoutedEvents
> or SourceNames for a StoryBoard animation. I tryed the code below.
>
> <StackPanel>
> <Storyboard x:Name="Animate_status_block_01_skp_sbd_ctr" >
> <DoubleAnimation
> Storyboard.TargetName="Status_block_05_skp_ctr"
> Storyboard.TargetProperty="Height"
> From="80" To="0" Duration="0:0:3" AutoReverse="true"
> />
> </Storyboard>
> </StackPanel>
>
> ----Problem-----
>
> The runtime error is:
>
> XAML Parse Error
> Error Object : Animate_status_block_01_skp_sbd_ctr
> Error Message : 'Storyboard' object cannot be added to 'StackPanel'.

That's correct. When you add an element under a Panel's hierarchy (or
any other UIElement for that matter), it will be added to the Children
collection, which is of type UIElementCollection, and which, by
definition, can only contain other UIElements.

> Cannot add instance of type 'Storyboard' to a collection of type
> 'UIElementCollection'.
> Only items of type 'UIElement' are allowed.
> Error at
> object 'Animate_status_block_01_skp_sbd_ctr'
> in markup file
>
> 'Storyboard_05_win_app_02;component/aaa_viewport/app_viewport_cls.xaml' Line
> 556 Position 18.
>
> ----Request-----
>
> Is there a way in XAML to define a Storyboard without the event control
> constructs???

I think that what you try to do is what I described in this article:

http://www.galasoft-lb.ch/mydotnet/a...006102701.aspx
(scroll down to "Triggering animations in code-behind")

Here you will see that you can define storyboards in resources and
trigger them from the code behind. Resources are great in XAML, they are
like a hashtable where you can story styles, animations, etc... and use
them later in the code. You can even store resources in other files (or
even other assemblies) and load them dynamically during runtime (the
"FindResource" method is very dynamic).


> ---Discussion------
>
> For those of you with time on your hands ... :-)
>
> Although I'm new to the WPF/XAML architecture it seems their
> Animation/Eventing design is targeted to animated controls and not animated
> applications (layout - panel level animation) since the EventTrigger -
> RoutedEvent - SourceName scope is all 'inward' where animations are parent
> based and child triggered.

I don't totally understand what you mean. However, you are right when
you note that animations in XAML are limited. As you found out, XAML can
only react to triggers, which is often not enough. Defining animations
in XAML is great, and I personally find it easier than to define them in
the code-behind, but triggering them can be tricky or even impossible.
This is why I think that coding behind will remain necessary for most
WPF-based applications.

> Note : I'm new to WPF - XAML an have only coded WPF-XAML
> for a few weeks (since Jan 1 2007).
>
> Also Note : I have not tryed the C# only - local animation approach -
> since I want to leverage as much of the XAML architecture as possible
> (but do most of the trigger control from C#). So this architectural
> discussion/question is for WPF-XAML designs.
>
> I'm hoping I'm wrong about the architectural limitations of
> the current (.Net 3.0 RTM) WPF-XAML animation design.

I strongly believe that the dual approach to WPF (XAML front-end and C#
code-behind) is a successful attempt by Microsoft to bring designers and
developers closer. As a professional developer and very amateur
designer, I am thrilled at the prospect of working with professional
designers on future applications. But I also strongly believe that both
profession are not going to eliminate each other. I believe that "pure
codebehind" WPF applications are not reasonable, because XAML is very
efficient when it comes to layout, gradients, animations, etc... I also
believe that pure XAML applications don't have a future, because they
cannot handle data or "complex" triggering of events.

Of course, that's just IMHO ;-)

> [1] I want to animate a major panel of a WPF application (without using
> an Expander control) for a hide-show, hidden panel type of design.
> So I want to animation width/height from 0 to 'Auto' or '*' maximum
> size.
>
> [2] I want to trigger the hide/close from a toolbar button and/or
> a menu selection (ie. from a C# method of the main application viewport).
> So the StoryBoard.Begin(my_control) approach is what I would like to do.
> This works but a 'bug' appears in all code because the animation EventTrigger
> will be mis-triggered due to its (designed requirement) need
> for a locally scoped SourceName for the RoutedEvent.
> Also I do not need a 'controllable animation' for pause, restart, etc.
> I just need a begin animation (with two animations defined - one open, one
> close).
>
> After going through the MS documentation (also forums, blogs, etc)
> it seems that WPF-XAML animation is limited to 'control animation'.
> Application level 'Panel animation' does not seem to be a consideration
> of the design.
>
> By 'control animation' I mean that the animation of a control like
> a button or a media viewer. By 'Panel animation' I mean a section
> of a standard 'panel' area like the 'status panel', 'navigation panel'
> or 'data panel'.
>
> The two animation constructs (architectural features done somehow in code)
> I wanted were:
>
> [1] Value animation targeted to 'Auto' and '*' values.
> [2] External event sources to trigger animations (EventTrigger with no
> RoutedEvent).
>
> In [1] all SDK and book code (I have Petzold's and Nathans book code) that
> I have searched through do not contain DoubleAnimation target values of
> 'Auto' and '*' (From, To, etc).
>
> In [2] the StoryBoard (a) Must contain an EventTrigger that (b) MUST (by
> design) contain a
> RoutedEvent that (c) MUST have a SourceName 'under' (within the animated
> parent event scope).
> I would prefer a StoryBoard architecture that did not require a tirggering
> event to be defined.
> In this way I could just define the animation in XAML and control it in WPF
> C#.
>
> I do not expect that [1] is possible in the first version RTM) WPF-XAML
> architecture.

I never tried this. If I were you, I would ask Karsten (see blog link
below).

>
> I do hope that [2] is possible using an animation technique that I am
> (currently) not
> aware of.

I think that storing the storyboard in a resource dictionary is going to
help you do what you want. If it doesn't, maybe try to rephrase.

> If any one has any comments (good or bad) please feel free to respond :-)
>
> Shawnk
>
> PS. Sorry for the length of this post - would like a Sr. level architectural
> comment
> PPS. Note - I do not have an XAML/WPF books at this point - just using the
> Microsoft help docs.

I thought you have at least 2 books ;-)

Charles Petzold's WPF book has a very good reputation in the WPF world,
and I find this justified. I like his approach of starting by doing
everything in the code behind, it helps me to understand how the
concepts really work, but then again I am a developer.

Karsten's blog:
http://blogs.msdn.com/karstenj/default.aspx

HTH,
Greetings,
Laurent
--
Laurent Bugnion [MVP ASP.NET]
Software engineering, Blog: http://www.galasoft-LB.ch
PhotoAlbum: http://www.galasoft-LB.ch/pictures
Support children in Calcutta: http://www.calcutta-espoir.ch

Laurent,

Just wanted to thank you for your response. I actually saw it a day
or two after you posted it. I had to 'drop back' so to speak and
develop a good 'commanding' infrastructure to manage the
command bndings prior to locating 'where' to put the animation
code.

I am currently finishing up a 'binding management' architecture that
is relevant to both command and data binding management.

Forrtunately the animation design limitations I was concerned about do not
seem to exist but I won't know for certain until my XAML commanding
implementation is done.

I'll incorporate your suggestions in the final design and let you know how
it went.

Thanks so much for your input. I did not want to respond until I had
finished the animation code but it took longer (on the commanding stuff) than
I thought.

Shawnk

"Shawnk" wrote:

> ----Goal--------
>
> I wanted to define an animation in XAML and control it in C#.
>
> So I DID NOT WANT to define any EventTriggers, RoutedEvents
> or SourceNames for a StoryBoard animation. I tryed the code below.
>
> <StackPanel>
> <Storyboard x:Name="Animate_status_block_01_skp_sbd_ctr" >
> <DoubleAnimation
> Storyboard.TargetName="Status_block_05_skp_ctr"
> Storyboard.TargetProperty="Height"
> From="80" To="0" Duration="0:0:3" AutoReverse="true"
> />
> </Storyboard>
> </StackPanel>
>
> ----Problem-----
>
> The runtime error is:
>
> XAML Parse Error
> Error Object : Animate_status_block_01_skp_sbd_ctr
> Error Message : 'Storyboard' object cannot be added to 'StackPanel'.
>
> Cannot add instance of type 'Storyboard' to a collection of type
> 'UIElementCollection'.
> Only items of type 'UIElement' are allowed.
> Error at
> object 'Animate_status_block_01_skp_sbd_ctr'
> in markup file
>
> 'Storyboard_05_win_app_02;component/aaa_viewport/app_viewport_cls.xaml' Line
> 556 Position 18.
>
> ----Request-----
>
> Is there a way in XAML to define a Storyboard without the event control
> constructs???
>
> ---Discussion------
>
> For those of you with time on your hands ... :-)
>
> Although I'm new to the WPF/XAML architecture it seems their
> Animation/Eventing design is targeted to animated controls and not animated
> applications (layout - panel level animation) since the EventTrigger -
> RoutedEvent - SourceName scope is all 'inward' where animations are parent
> based and child triggered.
>
> Note : I'm new to WPF - XAML an have only coded WPF-XAML
> for a few weeks (since Jan 1 2007).
>
> Also Note : I have not tryed the C# only - local animation approach -
> since I want to leverage as much of the XAML architecture as possible
> (but do most of the trigger control from C#). So this architectural
> discussion/question is for WPF-XAML designs.
>
> I'm hoping I'm wrong about the architectural limitations of
> the current (.Net 3.0 RTM) WPF-XAML animation design.
>
> [1] I want to animate a major panel of a WPF application (without using
> an Expander control) for a hide-show, hidden panel type of design.
> So I want to animation width/height from 0 to 'Auto' or '*' maximum
> size.
>
> [2] I want to trigger the hide/close from a toolbar button and/or
> a menu selection (ie. from a C# method of the main application viewport).
> So the StoryBoard.Begin(my_control) approach is what I would like to do.
> This works but a 'bug' appears in all code because the animation EventTrigger
> will be mis-triggered due to its (designed requirement) need
> for a locally scoped SourceName for the RoutedEvent.
> Also I do not need a 'controllable animation' for pause, restart, etc.
> I just need a begin animation (with two animations defined - one open, one
> close).
>
> After going through the MS documentation (also forums, blogs, etc)
> it seems that WPF-XAML animation is limited to 'control animation'.
> Application level 'Panel animation' does not seem to be a consideration
> of the design.
>
> By 'control animation' I mean that the animation of a control like
> a button or a media viewer. By 'Panel animation' I mean a section
> of a standard 'panel' area like the 'status panel', 'navigation panel'
> or 'data panel'.
>
> The two animation constructs (architectural features done somehow in code)
> I wanted were:
>
> [1] Value animation targeted to 'Auto' and '*' values.
> [2] External event sources to trigger animations (EventTrigger with no
> RoutedEvent).
>
> In [1] all SDK and book code (I have Petzold's and Nathans book code) that
> I have searched through do not contain DoubleAnimation target values of
> 'Auto' and '*' (From, To, etc).
>
> In [2] the StoryBoard (a) Must contain an EventTrigger that (b) MUST (by
> design) contain a
> RoutedEvent that (c) MUST have a SourceName 'under' (within the animated
> parent event scope).
> I would prefer a StoryBoard architecture that did not require a tirggering
> event to be defined.
> In this way I could just define the animation in XAML and control it in WPF
> C#.
>
> I do not expect that [1] is possible in the first version RTM) WPF-XAML
> architecture.
>
> I do hope that [2] is possible using an animation technique that I am
> (currently) not
> aware of.
>
> If any one has any comments (good or bad) please feel free to respond :-)
>
> Shawnk
>
> PS. Sorry for the length of this post - would like a Sr. level architectural
> comment
> PPS. Note - I do not have an XAML/WPF books at this point - just using the
> Microsoft help docs.
>

Hi,

Shawnk wrote:
> Laurent,
>
> Just wanted to thank you for your response. I actually saw it a day
> or two after you posted it. I had to 'drop back' so to speak and
> develop a good 'commanding' infrastructure to manage the
> command bndings prior to locating 'where' to put the animation
> code.

No worries :-) Not everyone gives feedback on the newsgroups, it's part
of the game. Nice to read that things go well for your project though!

Greetings,
Laurent


> I am currently finishing up a 'binding management' architecture that
> is relevant to both command and data binding management.
>
> Forrtunately the animation design limitations I was concerned about do not
> seem to exist but I won't know for certain until my XAML commanding
> implementation is done.
>
> I'll incorporate your suggestions in the final design and let you know how
> it went.
>
> Thanks so much for your input. I did not want to respond until I had
> finished the animation code but it took longer (on the commanding stuff) than
> I thought.
>
> Shawnk
>
> "Shawnk" wrote:
>
>> ----Goal--------
>>
>> I wanted to define an animation in XAML and control it in C#.
>>
>> So I DID NOT WANT to define any EventTriggers, RoutedEvents
>> or SourceNames for a StoryBoard animation. I tryed the code below.
>>
>> <StackPanel>
>> <Storyboard x:Name="Animate_status_block_01_skp_sbd_ctr" >
>> <DoubleAnimation
>> Storyboard.TargetName="Status_block_05_skp_ctr"
>> Storyboard.TargetProperty="Height"
>> From="80" To="0" Duration="0:0:3" AutoReverse="true"
>> />
>> </Storyboard>
>> </StackPanel>
>>
>> ----Problem-----
>>
>> The runtime error is:
>>
>> XAML Parse Error
>> Error Object : Animate_status_block_01_skp_sbd_ctr
>> Error Message : 'Storyboard' object cannot be added to 'StackPanel'.
>>
>> Cannot add instance of type 'Storyboard' to a collection of type
>> 'UIElementCollection'.
>> Only items of type 'UIElement' are allowed.
>> Error at
>> object 'Animate_status_block_01_skp_sbd_ctr'
>> in markup file
>>
>> 'Storyboard_05_win_app_02;component/aaa_viewport/app_viewport_cls.xaml' Line
>> 556 Position 18.
>>
>> ----Request-----
>>
>> Is there a way in XAML to define a Storyboard without the event control
>> constructs???
>>
>> ---Discussion------
>>
>> For those of you with time on your hands ... :-)
>>
>> Although I'm new to the WPF/XAML architecture it seems their
>> Animation/Eventing design is targeted to animated controls and not animated
>> applications (layout - panel level animation) since the EventTrigger -
>> RoutedEvent - SourceName scope is all 'inward' where animations are parent
>> based and child triggered.
>>
>> Note : I'm new to WPF - XAML an have only coded WPF-XAML
>> for a few weeks (since Jan 1 2007).
>>
>> Also Note : I have not tryed the C# only - local animation approach -
>> since I want to leverage as much of the XAML architecture as possible
>> (but do most of the trigger control from C#). So this architectural
>> discussion/question is for WPF-XAML designs.
>>
>> I'm hoping I'm wrong about the architectural limitations of
>> the current (.Net 3.0 RTM) WPF-XAML animation design.
>>
>> [1] I want to animate a major panel of a WPF application (without using
>> an Expander control) for a hide-show, hidden panel type of design.
>> So I want to animation width/height from 0 to 'Auto' or '*' maximum
>> size.
>>
>> [2] I want to trigger the hide/close from a toolbar button and/or
>> a menu selection (ie. from a C# method of the main application viewport).
>> So the StoryBoard.Begin(my_control) approach is what I would like to do.
>> This works but a 'bug' appears in all code because the animation EventTrigger
>> will be mis-triggered due to its (designed requirement) need
>> for a locally scoped SourceName for the RoutedEvent.
>> Also I do not need a 'controllable animation' for pause, restart, etc.
>> I just need a begin animation (with two animations defined - one open, one
>> close).
>>
>> After going through the MS documentation (also forums, blogs, etc)
>> it seems that WPF-XAML animation is limited to 'control animation'.
>> Application level 'Panel animation' does not seem to be a consideration
>> of the design.
>>
>> By 'control animation' I mean that the animation of a control like
>> a button or a media viewer. By 'Panel animation' I mean a section
>> of a standard 'panel' area like the 'status panel', 'navigation panel'
>> or 'data panel'.
>>
>> The two animation constructs (architectural features done somehow in code)
>> I wanted were:
>>
>> [1] Value animation targeted to 'Auto' and '*' values.
>> [2] External event sources to trigger animations (EventTrigger with no
>> RoutedEvent).
>>
>> In [1] all SDK and book code (I have Petzold's and Nathans book code) that
>> I have searched through do not contain DoubleAnimation target values of
>> 'Auto' and '*' (From, To, etc).
>>
>> In [2] the StoryBoard (a) Must contain an EventTrigger that (b) MUST (by
>> design) contain a
>> RoutedEvent that (c) MUST have a SourceName 'under' (within the animated
>> parent event scope).
>> I would prefer a StoryBoard architecture that did not require a tirggering
>> event to be defined.
>> In this way I could just define the animation in XAML and control it in WPF
>> C#.
>>
>> I do not expect that [1] is possible in the first version RTM) WPF-XAML
>> architecture.
>>
>> I do hope that [2] is possible using an animation technique that I am
>> (currently) not
>> aware of.
>>
>> If any one has any comments (good or bad) please feel free to respond :-)
>>
>> Shawnk
>>
>> PS. Sorry for the length of this post - would like a Sr. level architectural
>> comment
>> PPS. Note - I do not have an XAML/WPF books at this point - just using the
>> Microsoft help docs.
>>


--
Laurent Bugnion [MVP ASP.NET]
Software engineering, Blog: http://www.galasoft-LB.ch
PhotoAlbum: http://www.galasoft-LB.ch/pictures
Support children in Calcutta: http://www.calcutta-espoir.ch