Windows Vista Forums
Vista Forums Home Join Vista Forums Donate Vista Tutorials Tags

Welcome to Vista Forums we are your forum to discuss Windows Vista x64 and x86 systems. Whether you need help or just want to post an idea you have on Vista, this is the forum for you.
Register at Vista forums...the world biggest Windows Vista resource Join Vista Forums Now

Go Back   Vista Forums > Microsoft Technical Newsgroups > Avalon

How to animate To/From an Auto value?

Closed Thread
 
Thread Tools Display Modes
Old 02-08-2007   #1 (permalink)
Shawnk
Guest


 

How to animate To/From an Auto value?

I have storyboard animations that work well but
I do not know how to set the From/To value targets
for width and height to the 'Auto' value.

In the XAML code below I would like the "80" value to be "Auto"
but that won't compile.

My XAML code is:

<Grid Name = "My_grid_ctr" >
<Grid.Triggers>
<EventTrigger RoutedEvent="Button.Click" >
<BeginStoryboard Name="My_grid_amt_ctr" >
<Storyboard x:Name="My_grid_sbd_ctr" >
<DoubleAnimation
Storyboard.TargetName="My_grid_ctr"
Storyboard.TargetProperty="Height"
From="0" To="80" Duration="0:0:3" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Grid.Triggers>
</Grid>

In the event handler I have:

My_grid_stb_ctr.Begin( My_grid_ctr );

The animations work great for numeric fixed value targets (like To="80"
above).
How can I get them to target an 'Auto' width or height (in either From/To).

Also - I have tryed to reset the UI elements to the auto value in code via:

My_grid_ctr.Width = double.NaN; // Auto Width
My_grid_ctr.Height = double.NaN; // Auto Height
My_grid_ctr.InvalidateVisual(); // Redraw element

But that does not seem to reset them.

Thanks ahead of time.

Shawnk

PS. I searched all the WPF code in the SDK and did not find any 'Auto'
animation targets.


Old 02-08-2007   #2 (permalink)
Bill Henning
Guest


 

Re: How to animate To/From an Auto value?

You don't need to set both the From and To if you don't want.

For instance, if you leave From blank and fill in To, it will animate from
the default height to the "To" value. Whereas if you leave To blank and
fill in From, I believe it will animate from the "From" value to the default
height. I have only tried the former myself and not the latter but I
believe it would work.

--

Bill Henning
Actipro Software

WPF Wizard Control -
http://www.actiprosoftware.com/Produ...d/Default.aspx



"Shawnk" <Shawnk@discussions.microsoft.com> wrote in message
news:45093EAC-32EF-445B-BE8D-898C478532CC@microsoft.com...
>I have storyboard animations that work well but
> I do not know how to set the From/To value targets
> for width and height to the 'Auto' value.
>
> In the XAML code below I would like the "80" value to be "Auto"
> but that won't compile.
>
> My XAML code is:
>
> <Grid Name = "My_grid_ctr" >
> <Grid.Triggers>
> <EventTrigger RoutedEvent="Button.Click" >
> <BeginStoryboard Name="My_grid_amt_ctr" >
> <Storyboard x:Name="My_grid_sbd_ctr" >
> <DoubleAnimation
> Storyboard.TargetName="My_grid_ctr"
> Storyboard.TargetProperty="Height"
> From="0" To="80" Duration="0:0:3" />
> </Storyboard>
> </BeginStoryboard>
> </EventTrigger>
> </Grid.Triggers>
> </Grid>
>
> In the event handler I have:
>
> My_grid_stb_ctr.Begin( My_grid_ctr );
>
> The animations work great for numeric fixed value targets (like To="80"
> above).
> How can I get them to target an 'Auto' width or height (in either
> From/To).
>
> Also - I have tryed to reset the UI elements to the auto value in code
> via:
>
> My_grid_ctr.Width = double.NaN; // Auto Width
> My_grid_ctr.Height = double.NaN; // Auto Height
> My_grid_ctr.InvalidateVisual(); // Redraw element
>
> But that does not seem to reset them.
>
> Thanks ahead of time.
>
> Shawnk
>
> PS. I searched all the WPF code in the SDK and did not find any 'Auto'
> animation targets.
>
>



Old 02-09-2007   #3 (permalink)
Shawnk
Guest


 

Re: How to animate To/From an Auto value?

Bill,

Thanks much for the advice.

We tryed dropping the From and to (Just use From or To by itself) - It did
not work. With the code below:

<EventTrigger RoutedEvent="Button.Click"
>

<BeginStoryboard
Name="Close_status_block_via_width_01_skp_amt_ctr" >
<Storyboard
x:Name="Close_status_block_via_width_01_skp_sbd_ctr" >
<DoubleAnimation
Storyboard.TargetName="Status_block_03_skp_ctr"
Storyboard.TargetProperty="Width"
To="0" Duration="0:0:3" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>

We received the exception.

"'System.Windows.Media.Animation.DoubleAnimation' cannot use default
origin value of 'NaN'."

I tryed some permutations/variations all with bad results.

I finally found an alternate approach that seems to be working. I'll post
the solution once it passes all the testing.

Thanks again for your helpful advice. I think that soultion (To alone/From
alone) may work in other situations but it died on my system (XP with .NET
3.0 RTM, XAML, C#, VS Studio 2005).

Shawnk


"Bill Henning" wrote:

> You don't need to set both the From and To if you don't want.
>
> For instance, if you leave From blank and fill in To, it will animate from
> the default height to the "To" value. Whereas if you leave To blank and
> fill in From, I believe it will animate from the "From" value to the default
> height. I have only tried the former myself and not the latter but I
> believe it would work.
>
> --
>
> Bill Henning
> Actipro Software
>
> WPF Wizard Control -
> http://www.actiprosoftware.com/Produ...d/Default.aspx
>
>
>
> "Shawnk" <Shawnk@discussions.microsoft.com> wrote in message
> news:45093EAC-32EF-445B-BE8D-898C478532CC@microsoft.com...
> >I have storyboard animations that work well but
> > I do not know how to set the From/To value targets
> > for width and height to the 'Auto' value.
> >
> > In the XAML code below I would like the "80" value to be "Auto"
> > but that won't compile.
> >
> > My XAML code is:
> >
> > <Grid Name = "My_grid_ctr" >
> > <Grid.Triggers>
> > <EventTrigger RoutedEvent="Button.Click" >
> > <BeginStoryboard Name="My_grid_amt_ctr" >
> > <Storyboard x:Name="My_grid_sbd_ctr" >
> > <DoubleAnimation
> > Storyboard.TargetName="My_grid_ctr"
> > Storyboard.TargetProperty="Height"
> > From="0" To="80" Duration="0:0:3" />
> > </Storyboard>
> > </BeginStoryboard>
> > </EventTrigger>
> > </Grid.Triggers>
> > </Grid>
> >
> > In the event handler I have:
> >
> > My_grid_stb_ctr.Begin( My_grid_ctr );
> >
> > The animations work great for numeric fixed value targets (like To="80"
> > above).
> > How can I get them to target an 'Auto' width or height (in either
> > From/To).
> >
> > Also - I have tryed to reset the UI elements to the auto value in code
> > via:
> >
> > My_grid_ctr.Width = double.NaN; // Auto Width
> > My_grid_ctr.Height = double.NaN; // Auto Height
> > My_grid_ctr.InvalidateVisual(); // Redraw element
> >
> > But that does not seem to reset them.
> >
> > Thanks ahead of time.
> >
> > Shawnk
> >
> > PS. I searched all the WPF code in the SDK and did not find any 'Auto'
> > animation targets.
> >
> >

>
>
>

Old 02-09-2007   #4 (permalink)
Shawnk
Guest


 

RE: How to animate To/From an Auto value?


I tryed an alternate approach to expand/collapse animation (for large panels
like navigation panels).

I used the ScaleTransfrom animation technique to 'scale' from '0' to 'Auto'.
The code to hide a grid control is given below.

Unfortunately this approach did not seem to work.
I can collapse the grid with this approach but I can not expand it
once it is collapsed.

Note that the 'open back up' process starts with a fully collapsed UI element
that has been 'scaled to 0' (ie. a 'hidden' panel).

If anyone has an explanation (on why the open back up does not work)
please let use know :-)

Shawnk

-----

The code to open the panel back up is:

void On_IDM_open_transform_via_width_amt_mth(
object p_sender_obj,
RoutedEventArgs p_evt
){
if ( m_status_panel_is_open_flg == false )
{
Transform_open_status_block_via_width_01_grd_sbd_ctr. Begin(
Status_bar_06_grd_ctr );

m_status_stack_panel_is_open_flg = true;
}
}

The XAML code is:



<Grid Name = "Status_bar_06_grd_ctr"
HorizontalAlignment = "Stretch"
ShowGridLines = "True"
Height = "80"
Background = "Yellow"
>


<Grid.RenderTransform>
<ScaleTransform x:Name="Status_transform_grd_amt_ctr" ScaleX="1"
ScaleY="1" />
</Grid.RenderTransform>

<Grid.Triggers>

<EventTrigger RoutedEvent = "Button.Click" >
<BeginStoryboard x:Name =
"Transform_close_status_block_01_grd_amt_ctr" >
<Storyboard x:Name =
"Transform_close_status_block_01_grd_sbd_ctr" >
<DoubleAnimation
Storyboard.TargetName = "Status_transform_grd_amt_ctr"
Storyboard.TargetProperty = "(ScaleTransform.ScaleY)"
To="0.0" Duration="0:0:3"
/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>

<EventTrigger RoutedEvent = "Button.Click">
<BeginStoryboard x:Name =
"Transform_open_status_block_01_grd_amt_ctr" >
<Storyboard x:Name =
"Transform_open_status_block_01_grd_sbd_ctr" >
<DoubleAnimation
Storyboard.TargetName = "Status_transform_grd_amt_ctr"
Storyboard.TargetProperty = "(ScaleTransform.ScaleY)"
To="1.0" Duration="0:0:3"
/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>

<EventTrigger RoutedEvent = "Button.Click">
<BeginStoryboard>
<Storyboard x:Name =
"Transform_animate_status_block_01_grd_sbd_ctr" >
<DoubleAnimation
Storyboard.TargetName = "Status_transform_grd_amt_ctr"
Storyboard.TargetProperty = "(ScaleTransform.ScaleY)"
To="0.0" Duration="0:0:3"
AutoReverse="true"
/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>

</Grid.Triggers>
.... other code contained in grid
</Grid>


"Shawnk" wrote:

> I have storyboard animations that work well but
> I do not know how to set the From/To value targets
> for width and height to the 'Auto' value.
>
> In the XAML code below I would like the "80" value to be "Auto"
> but that won't compile.
>
> My XAML code is:
>
> <Grid Name = "My_grid_ctr" >
> <Grid.Triggers>
> <EventTrigger RoutedEvent="Button.Click" >
> <BeginStoryboard Name="My_grid_amt_ctr" >
> <Storyboard x:Name="My_grid_sbd_ctr" >
> <DoubleAnimation
> Storyboard.TargetName="My_grid_ctr"
> Storyboard.TargetProperty="Height"
> From="0" To="80" Duration="0:0:3" />
> </Storyboard>
> </BeginStoryboard>
> </EventTrigger>
> </Grid.Triggers>
> </Grid>
>
> In the event handler I have:
>
> My_grid_stb_ctr.Begin( My_grid_ctr );
>
> The animations work great for numeric fixed value targets (like To="80"
> above).
> How can I get them to target an 'Auto' width or height (in either From/To).
>
> Also - I have tryed to reset the UI elements to the auto value in code via:
>
> My_grid_ctr.Width = double.NaN; // Auto Width
> My_grid_ctr.Height = double.NaN; // Auto Height
> My_grid_ctr.InvalidateVisual(); // Redraw element
>
> But that does not seem to reset them.
>
> Thanks ahead of time.
>
> Shawnk
>
> PS. I searched all the WPF code in the SDK and did not find any 'Auto'
> animation targets.
>
>

Old 02-12-2007   #5 (permalink)
Shawnk
Guest


 

Re: How to animate To/From an Auto value?

Bill,

Just to let you know - None of the alternate approaches worked for us.

I am coding just from the Microsoft Documentation (no WPF - XAML books) just
yet.

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.

The lack of a 'Auto' and '*' targets in DoubleAnimations are also reflective
(it seems) of a 'control animation centric' design.

I'll post a general architecture question, relative to Animation Scope
Architecture Limits in this forum later on today.

Also note, I'm new to WPF - XAML so, hopefully, I'm wrong on the
architectural limitations of WPF-XAML.

Thanks again for your comments :-)

Shawnk

"Shawnk" wrote:

> Bill,
>
> Thanks much for the advice.
>
> We tryed dropping the From and to (Just use From or To by itself) - It did
> not work. With the code below:
>
> <EventTrigger RoutedEvent="Button.Click"
> >

> <BeginStoryboard
> Name="Close_status_block_via_width_01_skp_amt_ctr" >
> <Storyboard
> x:Name="Close_status_block_via_width_01_skp_sbd_ctr" >
> <DoubleAnimation
> Storyboard.TargetName="Status_block_03_skp_ctr"
> Storyboard.TargetProperty="Width"
> To="0" Duration="0:0:3" />
> </Storyboard>
> </BeginStoryboard>
> </EventTrigger>
>
> We received the exception.
>
> "'System.Windows.Media.Animation.DoubleAnimation' cannot use default
> origin value of 'NaN'."
>
> I tryed some permutations/variations all with bad results.
>
> I finally found an alternate approach that seems to be working. I'll post
> the solution once it passes all the testing.
>
> Thanks again for your helpful advice. I think that soultion (To alone/From
> alone) may work in other situations but it died on my system (XP with .NET
> 3.0 RTM, XAML, C#, VS Studio 2005).
>
> Shawnk
>
>
> "Bill Henning" wrote:
>
> > You don't need to set both the From and To if you don't want.
> >
> > For instance, if you leave From blank and fill in To, it will animate from
> > the default height to the "To" value. Whereas if you leave To blank and
> > fill in From, I believe it will animate from the "From" value to the default
> > height. I have only tried the former myself and not the latter but I
> > believe it would work.
> >
> > --
> >
> > Bill Henning
> > Actipro Software
> >
> > WPF Wizard Control -
> > http://www.actiprosoftware.com/Produ...d/Default.aspx
> >
> >
> >
> > "Shawnk" <Shawnk@discussions.microsoft.com> wrote in message
> > news:45093EAC-32EF-445B-BE8D-898C478532CC@microsoft.com...
> > >I have storyboard animations that work well but
> > > I do not know how to set the From/To value targets
> > > for width and height to the 'Auto' value.
> > >
> > > In the XAML code below I would like the "80" value to be "Auto"
> > > but that won't compile.
> > >
> > > My XAML code is:
> > >
> > > <Grid Name = "My_grid_ctr" >
> > > <Grid.Triggers>
> > > <EventTrigger RoutedEvent="Button.Click" >
> > > <BeginStoryboard Name="My_grid_amt_ctr" >
> > > <Storyboard x:Name="My_grid_sbd_ctr" >
> > > <DoubleAnimation
> > > Storyboard.TargetName="My_grid_ctr"
> > > Storyboard.TargetProperty="Height"
> > > From="0" To="80" Duration="0:0:3" />
> > > </Storyboard>
> > > </BeginStoryboard>
> > > </EventTrigger>
> > > </Grid.Triggers>
> > > </Grid>
> > >
> > > In the event handler I have:
> > >
> > > My_grid_stb_ctr.Begin( My_grid_ctr );
> > >
> > > The animations work great for numeric fixed value targets (like To="80"
> > > above).
> > > How can I get them to target an 'Auto' width or height (in either
> > > From/To).
> > >
> > > Also - I have tryed to reset the UI elements to the auto value in code
> > > via:
> > >
> > > My_grid_ctr.Width = double.NaN; // Auto Width
> > > My_grid_ctr.Height = double.NaN; // Auto Height
> > > My_grid_ctr.InvalidateVisual(); // Redraw element
> > >
> > > But that does not seem to reset them.
> > >
> > > Thanks ahead of time.
> > >
> > > Shawnk
> > >
> > > PS. I searched all the WPF code in the SDK and did not find any 'Auto'
> > > animation targets.
> > >
> > >

> >
> >
> >

Old 02-12-2007   #6 (permalink)
Stoitcho Goutsev \(100\)
Guest


 

Re: How to animate To/From an Auto value?

Bill,

That was the solution that first popped in my head, but I tried it and it
doesn't work. The problem is that for Auto the use double.NaN. If one of the
limits for the animation is NaN they cannot calculate the internidiate
values for the property over the given period of time. This is the reason it
doesn't work with Auto


--
Stoitcho Goutsev (100)

"Bill Henning" <no_spam@hotmail.com> wrote in message
news:uayj9H$SHHA.4832@TK2MSFTNGP04.phx.gbl...
> You don't need to set both the From and To if you don't want.
>
> For instance, if you leave From blank and fill in To, it will animate from
> the default height to the "To" value. Whereas if you leave To blank and
> fill in From, I believe it will animate from the "From" value to the
> default height. I have only tried the former myself and not the latter
> but I believe it would work.
>
> --
>
> Bill Henning
> Actipro Software
>
> WPF Wizard Control -
> http://www.actiprosoftware.com/Produ...d/Default.aspx
>
>
>
> "Shawnk" <Shawnk@discussions.microsoft.com> wrote in message
> news:45093EAC-32EF-445B-BE8D-898C478532CC@microsoft.com...
>>I have storyboard animations that work well but
>> I do not know how to set the From/To value targets
>> for width and height to the 'Auto' value.
>>
>> In the XAML code below I would like the "80" value to be "Auto"
>> but that won't compile.
>>
>> My XAML code is:
>>
>> <Grid Name = "My_grid_ctr" >
>> <Grid.Triggers>
>> <EventTrigger RoutedEvent="Button.Click" >
>> <BeginStoryboard Name="My_grid_amt_ctr" >
>> <Storyboard x:Name="My_grid_sbd_ctr" >
>> <DoubleAnimation
>> Storyboard.TargetName="My_grid_ctr"
>> Storyboard.TargetProperty="Height"
>> From="0" To="80" Duration="0:0:3" />
>> </Storyboard>
>> </BeginStoryboard>
>> </EventTrigger>
>> </Grid.Triggers>
>> </Grid>
>>
>> In the event handler I have:
>>
>> My_grid_stb_ctr.Begin( My_grid_ctr );
>>
>> The animations work great for numeric fixed value targets (like To="80"
>> above).
>> How can I get them to target an 'Auto' width or height (in either
>> From/To).
>>
>> Also - I have tryed to reset the UI elements to the auto value in code
>> via:
>>
>> My_grid_ctr.Width = double.NaN; // Auto Width
>> My_grid_ctr.Height = double.NaN; // Auto Height
>> My_grid_ctr.InvalidateVisual(); // Redraw element
>>
>> But that does not seem to reset them.
>>
>> Thanks ahead of time.
>>
>> Shawnk
>>
>> PS. I searched all the WPF code in the SDK and did not find any 'Auto'
>> animation targets.
>>
>>

>
>



Old 02-13-2007   #7 (permalink)
Bill Henning
Guest


 

Re: How to animate To/From an Auto value?

Sorry I didn't reply sooner but haven't checked the ng in a few days. Now
that I'm trying out sample code I see what you mean. My suggestion works in
other areas but doesn't seem to work for this because of the NaN.

I've tried all kinds of things just trying to store the "expanded" size
somehow but am having a lot of trouble. If you can get the expanded size
into a dependency property then perhaps you can bind to that property and
use it as the To value for expanding.

--

Bill Henning
Actipro Software

WPF Wizard Control -
http://www.actiprosoftware.com/Produ...d/Default.aspx



"Shawnk" <Shawnk@discussions.microsoft.com> wrote in message
news:BFEBA8BE-CED5-4425-A7ED-345B858B7B87@microsoft.com...
> Bill,
>
> Just to let you know - None of the alternate approaches worked for us.
>
> I am coding just from the Microsoft Documentation (no WPF - XAML books)
> just
> yet.
>
> 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.
>
> The lack of a 'Auto' and '*' targets in DoubleAnimations are also
> reflective
> (it seems) of a 'control animation centric' design.
>
> I'll post a general architecture question, relative to Animation Scope
> Architecture Limits in this forum later on today.
>
> Also note, I'm new to WPF - XAML so, hopefully, I'm wrong on the
> architectural limitations of WPF-XAML.
>
> Thanks again for your comments :-)
>
> Shawnk
>
> "Shawnk" wrote:
>
>> Bill,
>>
>> Thanks much for the advice.
>>
>> We tryed dropping the From and to (Just use From or To by itself) - It
>> did
>> not work. With the code below:
>>
>> <EventTrigger RoutedEvent="Button.Click"
>> >

>> <BeginStoryboard
>> Name="Close_status_block_via_width_01_skp_amt_ctr" >
>> <Storyboard
>> x:Name="Close_status_block_via_width_01_skp_sbd_ctr" >
>> <DoubleAnimation
>> Storyboard.TargetName="Status_block_03_skp_ctr"
>> Storyboard.TargetProperty="Width"
>> To="0" Duration="0:0:3" />
>> </Storyboard>
>> </BeginStoryboard>
>> </EventTrigger>
>>
>> We received the exception.
>>
>> "'System.Windows.Media.Animation.DoubleAnimation' cannot use
>> default
>> origin value of 'NaN'."
>>
>> I tryed some permutations/variations all with bad results.
>>
>> I finally found an alternate approach that seems to be working. I'll post
>> the solution once it passes all the testing.
>>
>> Thanks again for your helpful advice. I think that soultion (To
>> alone/From
>> alone) may work in other situations but it died on my system (XP with
>> .NET
>> 3.0 RTM, XAML, C#, VS Studio 2005).
>>
>> Shawnk
>>
>>
>> "Bill Henning" wrote:
>>
>> > You don't need to set both the From and To if you don't want.
>> >
>> > For instance, if you leave From blank and fill in To, it will animate
>> > from
>> > the default height to the "To" value. Whereas if you leave To blank
>> > and
>> > fill in From, I believe it will animate from the "From" value to the
>> > default
>> > height. I have only tried the former myself and not the latter but I
>> > believe it would work.
>> >
>> > --
>> >
>> > Bill Henning
>> > Actipro Software
>> >
>> > WPF Wizard Control -
>> > http://www.actiprosoftware.com/Produ...d/Default.aspx
>> >
>> >
>> >
>> > "Shawnk" <Shawnk@discussions.microsoft.com> wrote in message
>> > news:45093EAC-32EF-445B-BE8D-898C478532CC@microsoft.com...
>> > >I have storyboard animations that work well but
>> > > I do not know how to set the From/To value targets
>> > > for width and height to the 'Auto' value.
>> > >
>> > > In the XAML code below I would like the "80" value to be "Auto"
>> > > but that won't compile.
>> > >
>> > > My XAML code is:
>> > >
>> > > <Grid Name = "My_grid_ctr" >
>> > > <Grid.Triggers>
>> > > <EventTrigger RoutedEvent="Button.Click" >
>> > > <BeginStoryboard Name="My_grid_amt_ctr" >
>> > > <Storyboard x:Name="My_grid_sbd_ctr" >
>> > > <DoubleAnimation
>> > > Storyboard.TargetName="My_grid_ctr"
>> > > Storyboard.TargetProperty="Height"
>> > > From="0" To="80" Duration="0:0:3" />
>> > > </Storyboard>
>> > > </BeginStoryboard>
>> > > </EventTrigger>
>> > > </Grid.Triggers>
>> > > </Grid>
>> > >
>> > > In the event handler I have:
>> > >
>> > > My_grid_stb_ctr.Begin( My_grid_ctr );
>> > >
>> > > The animations work great for numeric fixed value targets (like
>> > > To="80"
>> > > above).
>> > > How can I get them to target an 'Auto' width or height (in either
>> > > From/To).
>> > >
>> > > Also - I have tryed to reset the UI elements to the auto value in
>> > > code
>> > > via:
>> > >
>> > > My_grid_ctr.Width = double.NaN; // Auto Width
>> > > My_grid_ctr.Height = double.NaN; // Auto Height
>> > > My_grid_ctr.InvalidateVisual(); // Redraw element
>> > >
>> > > But that does not seem to reset them.
>> > >
>> > > Thanks ahead of time.
>> > >
>> > > Shawnk
>> > >
>> > > PS. I searched all the WPF code in the SDK and did not find any
>> > > 'Auto'
>> > > animation targets.
>> > >
>> > >
>> >
>> >
>> >



Old 02-13-2007   #8 (permalink)
Shawnk
Guest


 

Re: How to animate To/From an Auto value?

Bill,

FYI : Our 'alternate' approach was to use a ScaleTransform instead of a
Storyboard From To approach. It did not work.

The ScaleTransform (between 1 and 0) would animate (With autorevers) and
close (scale to 0) but once scaled to 0 it would not 'open' back up to a
scale of 1.

We tryed the 'Transform' approach for both a StackPanel and the Grid
contained within it. The code for the stackpanel 'Transform' is below.

Perhaps you could come up with an alternate animation that works.

<!--==3=A== StackPanel : Animation : Via Scale Transform
=================================================:_:==-->

<StackPanel.RenderTransform>
<ScaleTransform x:Name="Status_transform_skp_amt_ctr" ScaleX="1"
ScaleY="1" />
</StackPanel.RenderTransform>

<StackPanel.Triggers>

<EventTrigger RoutedEvent = "Button.Click">
<BeginStoryboard x:Name =
"Transform_animate_status_block_01_skp_amt_ctr" >
<Storyboard x:Name =
"Transform_animate_status_block_01_skp_sbd_ctr" >
<DoubleAnimation
Storyboard.TargetName = "Status_transform_skp_amt_ctr"
Storyboard.TargetProperty = "(ScaleTransform.ScaleY)"
To="0.0" Duration="0:0:3"
AutoReverse="true"
/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>

<EventTrigger RoutedEvent = "Button.Click">
<BeginStoryboard x:Name =
"Transform_close_status_block_01_skp_amt_ctr" >
<Storyboard x:Name =
"Transform_close_status_block_01_skp_sbd_ctr" >
<DoubleAnimation
Storyboard.TargetName = "Status_transform_skp_amt_ctr"
Storyboard.TargetProperty = "(ScaleTransform.ScaleY)"
To="0.0" Duration="0:0:3"
/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>

<EventTrigger RoutedEvent = "Button.Click">
<BeginStoryboard x:Name =
"Transform_open_status_block_01_skp_amt_ctr" >
<Storyboard x:Name =
"Transform_open_status_block_01_skp_sbd_ctr" >
<DoubleAnimation
Storyboard.TargetName = "Status_transform_skp_amt_ctr"
Storyboard.TargetProperty = "(ScaleTransform.ScaleY)"
To="0.0" Duration="0:0:3"
/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>



"Bill Henning" wrote:

> Sorry I didn't reply sooner but haven't checked the ng in a few days. Now
> that I'm trying out sample code I see what you mean. My suggestion works in
> other areas but doesn't seem to work for this because of the NaN.
>
> I've tried all kinds of things just trying to store the "expanded" size
> somehow but am having a lot of trouble. If you can get the expanded size
> into a dependency property then perhaps you can bind to that property and
> use it as the To value for expanding.
>
> --
>
> Bill Henning
> Actipro Software
>
> WPF Wizard Control -
> http://www.actiprosoftware.com/Produ...d/Default.aspx
>
>
>
> "Shawnk" <Shawnk@discussions.microsoft.com> wrote in message
> news:BFEBA8BE-CED5-4425-A7ED-345B858B7B87@microsoft.com...
> > Bill,
> >
> > Just to let you know - None of the alternate approaches worked for us.
> >
> > I am coding just from the Microsoft Documentation (no WPF - XAML books)
> > just
> > yet.
> >
> > 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.
> >
> > The lack of a 'Auto' and '*' targets in DoubleAnimations are also
> > reflective
> > (it seems) of a 'control animation centric' design.
> >
> > I'll post a general architecture question, relative to Animation Scope
> > Architecture Limits in this forum later on today.
> >
> > Also note, I'm new to WPF - XAML so, hopefully, I'm wrong on the
> > architectural limitations of WPF-XAML.
> >
> > Thanks again for your comments :-)
> >
> > Shawnk
> >
> > "Shawnk" wrote:
> >
> >> Bill,
> >>
> >> Thanks much for the advice.
> >>
> >> We tryed dropping the From and to (Just use From or To by itself) - It
> >> did
> >> not work. With the code below:
> >>
> >> <EventTrigger RoutedEvent="Button.Click"
> >> >
> >> <BeginStoryboard
> >> Name="Close_status_block_via_width_01_skp_amt_ctr" >
> >> <Storyboard
> >> x:Name="Close_status_block_via_width_01_skp_sbd_ctr" >
> >> <DoubleAnimation
> >> Storyboard.TargetName="Status_block_03_skp_ctr"
> >> Storyboard.TargetProperty="Width"
> >> To="0" Duration="0:0:3" />
> >> </Storyboard>
> >> </BeginStoryboard>
> >> </EventTrigger>
> >>
> >> We received the exception.
> >>
> >> "'System.Windows.Media.Animation.DoubleAnimation' cannot use
> >> default
> >> origin value of 'NaN'."
> >>
> >> I tryed some permutations/variations all with bad results.
> >>
> >> I finally found an alternate approach that seems to be working. I'll post
> >> the solution once it passes all the testing.
> >>
> >> Thanks again for your helpful advice. I think that soultion (To
> >> alone/From
> >> alone) may work in other situations but it died on my system (XP with
> >> .NET
> >> 3.0 RTM, XAML, C#, VS Studio 2005).
> >>
> >> Shawnk
> >>
> >>
> >> "Bill Henning" wrote:
> >>
> >> > You don't need to set both the From and To if you don't want.
> >> >
> >> > For instance, if you leave From blank and fill in To, it will animate
> >> > from
> >> > the default height to the "To" value. Whereas if you leave To blank
> >> > and
> >> > fill in From, I believe it will animate from the "From" value to the
> >> > default
> >> > height. I have only tried the former myself and not the latter but I
> >> > believe it would work.
> >> >
> >> > --
> >> >
> >> > Bill Henning
> >> > Actipro Software
> >> >
> >> > WPF Wizard Control -
> >> > http://www.actiprosoftware.com/Produ...d/Default.aspx
> >> >
> >> >
> >> >
> >> > "Shawnk" <Shawnk@discussions.microsoft.com> wrote in message
> >> > news:45093EAC-32EF-445B-BE8D-898C478532CC@microsoft.com...
> >> > >I have storyboard animations that work well but
> >> > > I do not know how to set the From/To value targets
> >> > > for width and height to the 'Auto' value.
> >> > >
> >> > > In the XAML code below I would like the "80" value to be "Auto"
> >> > > but that won't compile.
> >> > >
> >> > > My XAML code is:
> >> > >
> >> > > <Grid Name = "My_grid_ctr" >
> >> > > <Grid.Triggers>
> >> > > <EventTrigger RoutedEvent="Button.Click" >
> >> > > <BeginStoryboard Name="My_grid_amt_ctr" >
> >> > > <Storyboard x:Name="My_grid_sbd_ctr" >
> >> > > <DoubleAnimation
> >> > > Storyboard.TargetName="My_grid_ctr"
> >> > > Storyboard.TargetProperty="Height"
> >> > > From="0" To="80" Duration="0:0:3" />
> >> > > </Storyboard>
> >> > > </BeginStoryboard>
> >> > > </EventTrigger>
> >> > > </Grid.Triggers>
> >> > > </Grid>
> >> > >
> >> > > In the event handler I have:
> >> > >
> >> > > My_grid_stb_ctr.Begin( My_grid_ctr );
> >> > >
> >> > > The animations work great for numeric fixed value targets (like
> >> > > To="80"
> >> > > above).
> >> > > How can I get them to target an 'Auto' width or height (in either
> >> > > From/To).
> >> > >
> >> > > Also - I have tryed to reset the UI elements to the auto value in
> >> > > code
> >> > > via:
> >> > >
> >> > > My_grid_ctr.Width = double.NaN; // Auto Width
> >> > > My_grid_ctr.Height = double.NaN; // Auto Height
> >> > > My_grid_ctr.InvalidateVisual(); // Redraw element
> >> > >
> >> > > But that does not seem to reset them.
> >> > >
> >> > > Thanks ahead of time.
> >> > >
> >> > > Shawnk
> >> > >
> >> > > PS. I searched all the WPF code in the SDK and did not find any
> >> > > 'Auto'
> >> > > animation targets.
> >> > >
> >> > >
> >> >
> >> >
> >> >

>
>
>

Old 02-13-2007   #9 (permalink)
Bill Henning
Guest


 

Re: How to animate To/From an Auto value?

Good idea on the scale transform.... got it working, and even with a neat
fade in/out effect... stick this code in a StackPanel:

<StackPanel x:Name="MyPanel" Opacity="0">
<StackPanel.LayoutTransform>
<ScaleTransform x:Name="ScaleTrans" ScaleY="0" />
</StackPanel.LayoutTransform>
<Button Content="Button 1" />
<Button Content="Button 2" />
<Button Content="Button 3" />
<Button Content="Button 4" />
</StackPanel>
<Button Content="Expand">
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="ScaleTrans"
Storyboard.TargetProperty="ScaleY" To="1" />
<DoubleAnimation Storyboard.TargetName="MyPanel"
Storyboard.TargetProperty="Opacity" To="1" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
</Button>
<Button Content="Collapse">
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="ScaleTrans"
Storyboard.TargetProperty="ScaleY" To="0" />
<DoubleAnimation Storyboard.TargetName="MyPanel"
Storyboard.TargetProperty="Opacity" To="0" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
</Button>

--

Bill Henning
Actipro Software

WPF Wizard Control -
http://www.actiprosoftware.com/Produ...d/Default.aspx


Old 02-15-2007   #10 (permalink)
Shawnk
Guest


 

Re: How to animate To/From an Auto value?

Bill,

Sorry it took so long to get back on this.

I tryed your code - works great!
Love the niffy opacity fade out and in to match the panel collapse.

I see you moved the (1) animation and (2) triggers out of the animation
target object (the stackpanel) and into the controling object (the button).

I didn't you could that :-)

Thanks so much for the solution. If I have any problems integrating this
into the full application I'll post back here.

Shawnk

"Bill Henning" wrote:

> Good idea on the scale transform.... got it working, and even with a neat
> fade in/out effect... stick this code in a StackPanel:
>
> <StackPanel x:Name="MyPanel" Opacity="0">
> <StackPanel.LayoutTransform>
> <ScaleTransform x:Name="ScaleTrans" ScaleY="0" />
> </StackPanel.LayoutTransform>
> <Button Content="Button 1" />
> <Button Content="Button 2" />
> <Button Content="Button 3" />
> <Button Content="Button 4" />
> </StackPanel>
> <Button Content="Expand">
> <Button.Triggers>
> <EventTrigger RoutedEvent="Button.Click">
> <EventTrigger.Actions>
> <BeginStoryboard>
> <Storyboard>
> <DoubleAnimation Storyboard.TargetName="ScaleTrans"
> Storyboard.TargetProperty="ScaleY" To="1" />
> <DoubleAnimation Storyboard.TargetName="MyPanel"
> Storyboard.TargetProperty="Opacity" To="1" />
> </Storyboard>
> </BeginStoryboard>
> </EventTrigger.Actions>
> </EventTrigger>
> </Button.Triggers>
> </Button>
> <Button Content="Collapse">
> <Button.Triggers>
> <EventTrigger RoutedEvent="Button.Click">
> <EventTrigger.Actions>
> <BeginStoryboard>
> <Storyboard>
> <DoubleAnimation Storyboard.TargetName="ScaleTrans"
> Storyboard.TargetProperty="ScaleY" To="0" />
> <DoubleAnimation Storyboard.TargetName="MyPanel"
> Storyboard.TargetProperty="Opacity" To="0" />
> </Storyboard>
> </BeginStoryboard>
> </EventTrigger.Actions>
> </EventTrigger>
> </Button.Triggers>
> </Button>
>
> --
>
> Bill Henning
> Actipro Software
>
> WPF Wizard Control -
> http://www.actiprosoftware.com/Produ...d/Default.aspx
>
>
>

Closed Thread

Thread Tools
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Animate Min/Max windows turns itself off Q Vista performance & maintenance 6 02-21-2008 01:31 AM
animate the dialup icon? Jrz Vista General 4 12-13-2007 04:07 PM
How do I animate Canvas.Left in code? Jeremy Chaney Avalon 1 07-21-2007 05:31 AM
Q: Tray | Connections -> Animations. Can't get mine to animate??? Mike Vista General 3 03-10-2007 05:17 AM
Cannot animate a transform in a data template viliescu Avalon 6 01-10-2006 03:52 PM








Vistax64.com is an independent web site and has not been authorized,
sponsored, or otherwise approved by Microsoft Corporation.
"Windows Vista", the Start Orb, and related materials are trademarks of Microsoft Corp.
© Designer Media 2005-2008

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50