WPF 以视频为背景的登录界面

---

前言

好的开始是成功的一半。对于软件来说好的登录页面也同样重要。如何制作一个动态背景的登录页面呢？那么今天它来了。

---

一、编写BackgroundPlayer工具类

using System;
using System.Windows;
using System.Windows.Controls;

namespace DRS.Components
{
    public class BackgroundPlayer : Control
    {
        static BackgroundPlayer() {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(BackgroundPlayer),
                new FrameworkPropertyMetadata(typeof(BackgroundPlayer)));
        }

        public string Source{
            get { return (string)GetValue(SourceProperty); }
            set { SetValue(SourceProperty, value); }
        }

        public static readonly DependencyProperty SourceProperty =
            DependencyProperty.Register("Source", typeof(string), typeof(BackgroundPlayer), new FrameworkPropertyMetadata("", (a, b) =>
            {
                BackgroundPlayer bp = a as BackgroundPlayer;
                if (bp.Player != null)
                {
                    bp.Player.Source = new Uri(b.NewValue.ToString().Replace("~", AppDomain.CurrentDomain.BaseDirectory), UriKind.RelativeOrAbsolute);
                }
            }));

        private MediaElement _player;

        public MediaElement Player
        {
            get { return _player; }
            set { _player = value; }
        }

        public override void OnApplyTemplate()
        {
            Player = GetTemplateChild("Media") as MediaElement;
            if (null == Player)
                throw new ArgumentNullException("Media");

            Player.LoadedBehavior = MediaState.Manual;
            Player.MediaEnded += Player_MediaEnded;
            Player.MediaOpened += Player_MediaOpened;
            Player.MediaFailed += Player_MediaFailed;
            Player.Loaded += Player_Loaded;
            if (!string.IsNullOrEmpty(Source))
            {
                Player.Source = new Uri(Source.Replace("~", AppDomain.CurrentDomain.BaseDirectory), UriKind.RelativeOrAbsolute);
                Player.Play();
            }
            base.OnApplyTemplate();
        }

        void Player_Loaded(object sender, RoutedEventArgs e)
        {
        }

        void Player_MediaFailed(object sender, ExceptionRoutedEventArgs e)
        {
        }

        void Player_MediaOpened(object sender, RoutedEventArgs e)
        {
            //Player.Play();
        }

        void Player_MediaEnded(object sender, RoutedEventArgs e)
        {
            Player.Position = TimeSpan.FromMilliseconds(1);
            Player.Play();
        }
    }
}

二、使用

1.在资源字典中引入

代码如下（示例）：

  <!--视频背景-->
    <Style TargetType="loacl:BackgroundPlayer">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="loacl:BackgroundPlayer">
                    <MediaElement x:Name="Media" Stretch="Fill"></MediaElement>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

2.页面中使用

1、引入资源字典：

 	<ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Resource/xaml/MainStyle.xaml"></ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>

2、加入视频背景

<Grid.Background>
	<VisualBrush>
		<VisualBrush.Visual>
			<loacl:BackgroundPlayer Source="Resource/video/sky.mp4"></loacl:BackgroundPlayer>
		</VisualBrush.Visual>
	</VisualBrush>
</Grid.Background>

3、效果展示

桌端视频背景的登录页面

总结

好了，你现在就已经拥有了一个视频背景的登录页面了。加油，打工人！！！