Animated background control in WPF?

2019-03-09 13:07发布

问题:

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?

回答1:

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.



回答2:

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"/>


回答3:

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.



回答4:

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.



回答5:

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