Animation via Code

Animation via XAML

WPF Tutorial Contents

APL  Home Page

Animation via Code

Define a simple form containing two buttons, the idea is that when the "Start" button is pressed, the other button grows...

    Title="Animated Buttons">
    <Button Name="btnStart" Content="Start" Width="100"/>
    <Button Name="btnA" Content="Button A" Width="100"/>

And the code, to display...

 foo w;⎕IO;⎕ML;frm;names;callbacks
⍝ Experiments with animation
 ⎕IO ⎕ML←0 3
 frm←#.UTIL.WPF.LoadXamlFile w
 frm.(btnStart btnA)←frm.FindName¨⊂¨'btnStart' 'btnA'

And the callback that implements the tasteful action...

 Start w;⎕IO;⎕ML;⎕USING;anim;path;progFiles
⍝ Start the animation
 ⎕IO ⎕ML←0 3
 progFiles←Environment.GetFolderPath Environment.SpecialFolder.ProgramFiles
 path←progFiles,'\Reference Assemblies\Microsoft\Framework\v3.0\'
 anim←⎕NEW DoubleAnimation
 frm.btnA.BeginAnimation(Button.WidthProperty anim)

As always, the tricky bit is finding out what goes into ⎕USING (no prizes awarded for this clunkiness).

Animation via XAML

If you don't like writing APL, you can get XAML to do it all for you, add this button definition to the Window definition above...

<Button Name="btnB" Content="Button B" Width="100">
    <EventTrigger RoutedEvent="Button.Click">
          <Storyboard TargetProperty="Width">
            <DoubleAnimation From="100" To="200" Duration="0:0:5" AutoReverse="True" />

Press Button B and watch what happens (this code taken from Nathan's wretched book)