Animated background control in WPF?

Question

In my WPF application, I want to have an ambient animated background similar to Media Center's background. Is there a free control that offers this?

Referenced in [.NET Rocks, episode 952](http://www.dotnetrocks.com/default.aspx?showNum=952), 03 min 52 secs - 05 min 35 secs. — Peter Mortensen, Feb 21 '14 at 01:19

score 9 · Answer 1 · edited Feb 20 '14 at 23:23

9

A way to animate the background is:

It is also possible to set the TargetProperty to "(Background).(SolidColorBrush.Color)" as in this example:

<ColorAnimation
    Storyboard.TargetName = "lblSubGroup" 
    Storyboard.TargetProperty = "(Background).(SolidColorBrush.Color)"
    From = "White"
    To = "Navy"
    Duration = "0:0:3"
    AutoReverse = "True"/>

edited Feb 20 '14 at 23:23

Peter Mortensen

30,738
21
105
131

answered Nov 21 '11 at 17:12

Björn

3,098
2
26
40

score 8 · Accepted Answer · edited Feb 20 '14 at 23:21

I would prefer to animate the background of a border via storyboard. It's pretty easy and you can build a animation as complex as you like. Here is a short example:

<Window x:Class="WpfApplication1.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300">
    <Window.Triggers>
        <EventTrigger RoutedEvent="Window.Loaded">
            <BeginStoryboard>
                <Storyboard AutoReverse="True" BeginTime="0" >
                    <DoubleAnimation Storyboard.TargetName="Foo"
                                     Storyboard.TargetProperty="Offset"
                                     From="0.2" To="0.8" Duration="0:0:10"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Window.Triggers>
    <Border>
        <Border.Background>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                    <GradientStop Color="Yellow" Offset="0"/>
                    <GradientStop Color="Orange" Offset="0.2"  x:Name="Foo"/>
                    <GradientStop Color="Red" Offset="1"/>               
            </LinearGradientBrush>
        </Border.Background>
    <!-- put your windowcontent(grid etc.) here -->
    </Border>
</Window>

You should also see the MSDN article Animation Overview.

score 1 · Answer 3 · answered Aug 29 '09 at 07:58

1

You can use a Grid and put a video element in last z order, and let its width and height be auto and you can have a video played in it and put your container in front of it.

In Grid you can put objects in specified z order, you can create your custom animation control and let it run as first control added in grid.

Currently there is no Background property offering any animation, they can only load pictures.

answered Aug 29 '09 at 07:58

Akash Kava

39,066
20
121
167

Then my quesiton is this: where can i get such a video? :) – RCIX Aug 29 '09 at 08:21
Well there are iStockPhoto and such similar royaltee free content selling websites, you can use one of them, they arent that expensive and you can get rich variety of background videos. – Akash Kava Aug 29 '09 at 09:31

score 1 · Answer 4 · answered Sep 03 '09 at 11:38

1

I'd try and use vector animations if possible, playing a video (that has to automatically scale) is not optimal (in terms of processing, image scaling etc).

Using vector shapes/brushes (even 3D?) would be much better in my view.

answered Sep 03 '09 at 11:38

Darknight

2,460
2
22
26

score -16 · Answer 5 · answered Sep 03 '09 at 11:35

-16

Google "background animation". You'll get 18,500,000 hits.

answered Sep 03 '09 at 11:35

David Veeneman

18,912
32
122
187

Animated background control in WPF?

5 Answers5

Linked