<wp8>_______关键帧动画(DoubleAnimationUsingKeyFrames)、自定义对话框

最新推荐文章于 2024-08-09 17:30:00 发布

转载最新推荐文章于 2024-08-09 17:30:00 发布 · 754 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/qq278360339/archive/2013/03/29/2988611.html

文章标签：

#shell

本文介绍如何在C#中实现一个自定义的Popup控件，该控件包含遮罩、主体区域和内容区域，支持自动关闭、显示故事和对话框等功能。通过使用XAML和WPF相关的API，实现了一个功能丰富的Popup组件，适用于Windows Phone应用开发。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<UserControl x:Class="CustCtrlClassLibrary.PopupView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="480" d:DesignWidth="480" mc:Ignorable="d">

    <Grid x:Name="LayoutRoot">
        <Rectangle x:Name="mask" Fill="{StaticResource PhoneForegroundBrush}" Opacity="0" MouseLeftButtonDown="mask_MouseLeftButtonDown"/>
        <Grid x:Name="popupArea" VerticalAlignment="Center">
            <Grid.RenderTransform>
                <CompositeTransform x:Name="popupTransform"/>
            </Grid.RenderTransform>
            <Grid x:Name="contentArea" RenderTransformOrigin="0.5,0.5" Background="{StaticResource PhoneBackgroundBrush}">
                <Grid.RenderTransform>
                    <CompositeTransform/>
                </Grid.RenderTransform>
            </Grid>
        </Grid>
    </Grid>
    
</UserControl>

using System;
using System.Windows;
using System.Windows.Media;
using System.Windows.Input;
using Microsoft.Phone.Shell;
using System.Windows.Controls;
using Microsoft.Phone.Controls;
using System.Windows.Media.Animation;
using System.Windows.Controls.Primitives;

namespace CustCtrlClassLibrary
{
    public partial class PopupView : UserControl
    {
        #region Constructor
        private bool IsAutoClose = true;
        private int storyType = 0;

        public PopupView(PhoneApplicationPage basePage, bool isAutoClose, int storytype = 0)
        {
            InitializeComponent();
            this.Loaded += new RoutedEventHandler(PopupCotainer_Loaded);
            _BasePage = basePage; IsAutoClose = isAutoClose; storyType = storytype;
            _BasePage.BackKeyPress += BasePage_BackKeyPress;
        }

        #endregion

        #region Property

        private PhoneApplicationPage _BasePage;
        private FrameworkElement _PopupContent { get; set; }
        Popup _Popup;
        CubicEase _EasingFunction = new CubicEase() { EasingMode = EasingMode.EaseInOut };

        public bool IsShown
        {
            get
            {
                return _Popup.IsOpen;
            }
        }

        #endregion

        #region Private Method

        private void PopupCotainer_Loaded(object sender, RoutedEventArgs e)
        {
            if (_BasePage.ApplicationBar != null)
                _BasePage.ApplicationBar.IsVisible = false;
            if (storyType == 0) {
                PrepareShowStory().Begin();
            } else if (storyType == 1) {
                LaunchDialog().Begin();
            }
        }

        private void BasePage_BackKeyPress(object sender, System.ComponentModel.CancelEventArgs e)
        {
            this.Close();
            e.Cancel = true;
        }

        private Storyboard PrepareShowStory()
        {
            contentArea.Children.Add(_PopupContent);
            UpdateLayout();

            Storyboard story = new Storyboard();
            DoubleAnimation animation;
            animation = new DoubleAnimation();
            animation.From = 0 - popupArea.ActualHeight;
            animation.To = SystemTray.IsVisible ? 32 : 0;
            animation.Duration = new Duration(TimeSpan.FromMilliseconds(300));
            animation.EasingFunction = _EasingFunction;
            Storyboard.SetTarget(animation, popupTransform);
            Storyboard.SetTargetProperty(animation, new PropertyPath("TranslateY"));
            story.Children.Add(animation);

            animation = new DoubleAnimation();
            animation.From = 0;
            animation.To = 0.5;
            animation.Duration = new Duration(TimeSpan.FromMilliseconds(300));
            Storyboard.SetTarget(animation, mask);
            Storyboard.SetTargetProperty(animation, new PropertyPath("(UIElement.Opacity)"));
            story.Children.Add(animation);

            return story;
        }
        private Storyboard PrepareCloseStory()
        {
            Storyboard story = new Storyboard();
            DoubleAnimation animation;

            story.Completed += new EventHandler(StoryReverse_Completed);
            animation = new DoubleAnimation();
            animation.From = popupTransform.TranslateY;
            animation.To = 0 - popupArea.ActualHeight;
            animation.Duration = new Duration(TimeSpan.FromMilliseconds(300));
            animation.EasingFunction = _EasingFunction;
            Storyboard.SetTarget(animation, popupTransform);
            Storyboard.SetTargetProperty(animation, new PropertyPath("TranslateY"));
            story.Children.Add(animation);

            animation = new DoubleAnimation();
            animation.From = mask.Opacity;
            animation.To = 0;
            animation.Duration = new Duration(TimeSpan.FromMilliseconds(300));
            Storyboard.SetTarget(animation, mask);
            Storyboard.SetTargetProperty(animation, new PropertyPath("(UIElement.Opacity)"));
            story.Children.Add(animation);

            return story;
        }

        private Storyboard LaunchDialog()
        {
            contentArea.Children.Add(_PopupContent);
            UpdateLayout();

            //装载DoubleAnimationUsingKeyFrames动画的故事板
            Storyboard keyFrameboard = new Storyboard();

            #region 后台代码添加DoubleAnimationUsingKeyFrames动画
            DoubleAnimationUsingKeyFrames dakeyframe = new DoubleAnimationUsingKeyFrames();
            //设置border矩形控件的Opacity透明度，并且开始动画事件为0秒的时候。
            Storyboard.SetTarget(dakeyframe, contentArea);
            Storyboard.SetTargetProperty(dakeyframe, new PropertyPath("UIElement.Opacity"));
            dakeyframe.BeginTime = new TimeSpan(0, 0, 0);

            //添加一个在第0.05秒的时候Opacity透明度值为1的关键帧
            SplineDoubleKeyFrame SKeyFrame = new SplineDoubleKeyFrame();
            SKeyFrame.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0.03));
            SKeyFrame.Value = 1;
            dakeyframe.KeyFrames.Add(SKeyFrame);

            keyFrameboard.Children.Add(dakeyframe);
            #endregion

            #region 后台代码添加DoubleAnimationUsingKeyFrames动画
            DoubleAnimationUsingKeyFrames dakeyscaleX = new DoubleAnimationUsingKeyFrames();
            //设置border矩形控件的ScaleX透明度，并且开始动画事件为0秒的时候。
            Storyboard.SetTarget(dakeyscaleX, contentArea);
            Storyboard.SetTargetProperty(dakeyscaleX, new PropertyPath("(UIElement.RenderTransform).(CompositeTransform.ScaleX)"));
            dakeyscaleX.BeginTime = new TimeSpan(0, 0, 0);

            //添加一个在第0秒的时候ScaleX透明度值为0.5的关键帧
            EasingDoubleKeyFrame EKeyFrameX = new EasingDoubleKeyFrame();
            EKeyFrameX.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0));
            EKeyFrameX.Value = 0.5;
            dakeyscaleX.KeyFrames.Add(EKeyFrameX);

            //添加一个在第0.15秒的时候ScaleX透明度值为1.1的关键帧
            EKeyFrameX = new EasingDoubleKeyFrame();
            EKeyFrameX.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0.1));
            EKeyFrameX.Value = 1.1;
            dakeyscaleX.KeyFrames.Add(EKeyFrameX);

            //添加一个在第0.25秒的时候ScaleX透明度值为0.9的关键帧
            EKeyFrameX = new EasingDoubleKeyFrame();
            EKeyFrameX.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0.2));
            EKeyFrameX.Value = 0.9;
            dakeyscaleX.KeyFrames.Add(EKeyFrameX);

            //添加一个在第0.3秒的时候ScaleX透明度值为0.9的关键帧
            EKeyFrameX = new EasingDoubleKeyFrame();
            EKeyFrameX.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0.25));
            EKeyFrameX.Value = 1.0;
            dakeyscaleX.KeyFrames.Add(EKeyFrameX);

            keyFrameboard.Children.Add(dakeyscaleX);
            #endregion

            #region 后台代码添加DoubleAnimationUsingKeyFrames动画
            DoubleAnimationUsingKeyFrames dakeyscaleY = new DoubleAnimationUsingKeyFrames();
            //设置border矩形控件的ScaleY透明度，并且开始动画事件为0秒的时候。
            Storyboard.SetTarget(dakeyscaleY, contentArea);
            Storyboard.SetTargetProperty(dakeyscaleY, new PropertyPath("(UIElement.RenderTransform).(CompositeTransform.ScaleY)"));
            dakeyscaleY.BeginTime = new TimeSpan(0, 0, 0);

            //添加一个在第0秒的时候ScaleX透明度值为0.5的关键帧
            EasingDoubleKeyFrame EKeyFrameY = new EasingDoubleKeyFrame();
            EKeyFrameY.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0));
            EKeyFrameY.Value = 0.5;
            dakeyscaleY.KeyFrames.Add(EKeyFrameY);

            //添加一个在第0.15秒的时候ScaleX透明度值为1.1的关键帧
            EKeyFrameY = new EasingDoubleKeyFrame();
            EKeyFrameY.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0.1));
            EKeyFrameY.Value = 1.1;
            dakeyscaleY.KeyFrames.Add(EKeyFrameY);

            //添加一个在第0.25秒的时候ScaleX透明度值为0.9的关键帧
            EKeyFrameY = new EasingDoubleKeyFrame();
            EKeyFrameY.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0.2));
            EKeyFrameY.Value = 0.9;
            dakeyscaleY.KeyFrames.Add(EKeyFrameY);

            //添加一个在第0.3秒的时候ScaleX透明度值为0.9的关键帧
            EKeyFrameY = new EasingDoubleKeyFrame();
            EKeyFrameY.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0.25));
            EKeyFrameY.Value = 1.0;
            dakeyscaleY.KeyFrames.Add(EKeyFrameY);

            keyFrameboard.Children.Add(dakeyscaleY);
            #endregion

            return keyFrameboard;
        }
        private Storyboard CloseDialog()
        {
            Storyboard keyFrameboard = new Storyboard();
            keyFrameboard.Completed += new EventHandler(StoryReverse_Completed);

            DoubleAnimation animation = new DoubleAnimation();
            //设置border矩形控件的Opacity透明度，并且开始动画事件为0秒的时候。
            Storyboard.SetTarget(animation, contentArea);
            Storyboard.SetTargetProperty(animation, new PropertyPath("UIElement.Opacity"));

            animation.From = 1; animation.To = 0.1;
            animation.Duration = new Duration(TimeSpan.FromSeconds(0.1));

            keyFrameboard.Children.Add(animation);

            return keyFrameboard;
        }

        private void StoryReverse_Completed(object sender, EventArgs e)
        {
            ClosePopup();
        }

        private void ClosePopup()
        {
            contentArea.Children.Clear();
            _PopupContent = null;
            _BasePage = null;

            Popup parent = this.Parent as Popup;
            if (parent != null)
            {
                parent.IsOpen = false;
            }
        }

        private void mask_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            if (IsAutoClose)
                Close();
        }

        #endregion

        #region Public Method

        public void Show(FrameworkElement popupContent)
        {
            _PopupContent = popupContent;
            _Popup = new Popup();
            _Popup.Child = this;
            _Popup.IsOpen = true;
        }

        public event PopUpClosed nPopUpClosed;

        public void Close()
        {
            _BasePage.BackKeyPress -= BasePage_BackKeyPress;
            if (storyType == 0) {
                PrepareCloseStory().Begin();
            } else if (storyType == 1) {
                CloseDialog().Begin();
            }
            if (_BasePage.ApplicationBar != null)
                _BasePage.ApplicationBar.IsVisible = true;
            if (nPopUpClosed != null)
                nPopUpClosed();
        }

        #endregion

        public void SetBackgroundColor(Brush aBrush)
        {
            contentArea.Background = aBrush;
        }
    }
}

CustCtrl parm = new CustCtrl();
PopupView pc = new PopupView(this, false, 1);
pc.Height = this.ActualHeight; pc.Width = this.ActualWidth;
SolidColorBrush nBrush = new SolidColorBrush(Color.FromArgb(25, 68, 68, 68));
pc.SetBackgroundColor(nBrush); 
pc.Show(parm);