zoukankan      html  css  js  c++  java
  • windows phone 自动隐藏的Popup from http://www.cnblogs.com/LoveJenny/archive/2011/07/14/2105869.html

    原理:使用Popup控件,并且设置Popup控件的位置居中
    1:新建自定义控件PopupBorder,作为Popup的child。代码如下:
    <UserControl x:Class="SLStudy.PopupBorder"
       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"
        mc:Ignorable="d">
        <UserControl.Resources>
            <Storyboard x:Name="myStoryboard">
                <DoubleAnimation
                    Storyboard.TargetName="LayoutRoot"
                    Storyboard.TargetProperty="Opacity"
                        From="1.0" To="0" Duration="0:0:1"
                        AutoReverse="True" />
            </Storyboard>
        </UserControl.Resources>
    
        <Grid x:Name="LayoutRoot" >
            <!--<Border Background="#FFCC0D0D" BorderThickness="0" CornerRadius="5">-->
            <Border BorderThickness="0" CornerRadius="5">
                <Border.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF27A3D7" Offset="0.51"/>
                        <GradientStop Color="#FF76C2E1" Offset="0.004"/>
                        <GradientStop Color="#FF27A3D7" Offset="1"/>
                    </LinearGradientBrush>
                </Border.Background>
                <Border.Effect>
                    <DropShadowEffect BlurRadius="10" Color="#FFCC0D0D" ShadowDepth="0"/>
                </Border.Effect>
                <TextBlock x:Name="txtMessage" HorizontalAlignment="Center" Margin="10" VerticalAlignment="Center"
                           FontSize="28" Foreground="White" FontFamily="Comic Sans MS"
                           >This is a Simple Example</TextBlock>
            </Border>
        </Grid>
    </UserControl>

    image

    新建PopupDemo页面,代码如下:
    <Grid x:Name="LayoutRoot">
            <StackPanel>
                <Button Content="Show" Click="ShowPopup_Clicked"></Button>
            </StackPanel>
        </Grid>
     
    后台cs代码为:
    private void ShowPopup_Clicked(object sender, RoutedEventArgs e)
            {
                Popup popup = new Popup();
    
                //设置popup的Child属性为自定义的用户控件。
                 popup.Child = new PopupBorder();
                popup.IsOpen = true;
            }

    运行,效果如下:

    clip_image002
     

    注册popUp的LayoutUpdated事件,在触发LayoutUpdated事件时,设置popUp的Margin属性:

    popUp.LayoutUpdated += delegate
                {
                    popUp.Margin = new Thickness(
                            (App.Current.Host.Content.ActualWidth - pborder.ActualWidth) / 2,
                            (App.Current.Host.Content.ActualHeight - pborder.ActualHeight) / 2,
                            0,
                            0);
                };

    完整的代码如下:

    PopupBorder pborder = new PopupBorder();
    
    Popup popUp = new Popup();
    
    //设置popup的Child属性为自定义的用户控件。
    popUp.Child = pborder;
    popUp.LayoutUpdated += delegate
    {
        popUp.Margin = new Thickness(
                (App.Current.Host.Content.ActualWidth - pborder.ActualWidth) / 2,
                (App.Current.Host.Content.ActualHeight - pborder.ActualHeight) / 2,
                0,
                0);
    };
    popUp.IsOpen = true;

    运行可以发现弹出的消息已经居中了,那么如何让它自动消失呢??,

    要想自动消失还得使用定时器,过了一段时间后定时器将popUp控件的 IsOpen属性设置为false,这样窗口就关闭了。

    于是在LayoutUpdated中增加定时器代码:

    popUp.LayoutUpdated += delegate
                {
                    popUp.Margin = new Thickness(
                            (App.Current.Host.Content.ActualWidth - pborder.ActualWidth) / 2,
                            (App.Current.Host.Content.ActualHeight - pborder.ActualHeight) / 2,
                            0,
                            0);
    
                    System.Threading.Timer timer = new System.Threading.Timer(
                        (state) =>
                        {
                            popUp.Dispatcher.BeginInvoke(() =>
                            {
                                popUp.IsOpen = false;
                            });
                        }, null, 500, 500);
                };

    在过了500秒后,将popUp. IsOpen设置为false。

    运行可以发现窗口可以自动消失了。

    可以看到弹出窗口一下就关闭了,那么能不能慢慢的渐变的消失呢??

    为了实现渐变的消失,那么就应该使用动画了。

    首先在PopupBorder中增加

    <UserControl.Resources>
            <Storyboard x:Name="myStoryboard">
                <DoubleAnimation
                    Storyboard.TargetName="LayoutRoot"
                    Storyboard.TargetProperty="Opacity"
                        From="1.0" To="0" Duration="0:0:1"
                        AutoReverse="True" />
            </Storyboard>
        </UserControl.Resources>

    当然上面的PopupBorder代码中已经有了这段代码了,动画使用了DoubleAnimation,设置LayoutRoot 对象的Opacity属性在1秒的时间内从1,变到0。

    接着在PopupDemo页面的按钮事件里面在popUp.Child = pborder;后面增加如下代码来执行动画:

    //设置popup的Child属性为自定义的用户控件。
    popUp.Child = pborder;
    
    pborder.myStoryboard.Completed += delegate
    {
        popUp.IsOpen = false;
    };
    pborder.myStoryboard.Begin();

    然后将Clicked中的代码进行重构。

    新建MessageBoxHelper类:

    代码如下:

    public class MessageBoxHelper
    {
        #region 提示消?息¡é
    
        /// <summary>
        /// 弹出提示消息标题为提示,按钮为确定
        /// </summary>
        /// <param name="msg"></param>
        public static void ShowMessage(string msg)
        {
            //ShowFriendMessage(msg, "提示", MessageBoxButton.OK);
    
            PopupBorder pborder = new PopupBorder();
            pborder.txtMessage.Text = " " + msg + " ";
    
            pborder.UpdateLayout();
    
            Popup popUp = new Popup();
            popUp.Child = pborder;
    
    
            pborder.myStoryboard.Completed += delegate
            {
                popUp.IsOpen = false;
            };
            pborder.myStoryboard.Begin();
    
    
            popUp.InvokeOnLayoutUpdated(() =>
            {
                popUp.Margin = new Thickness(
                    (App.Current.Host.Content.ActualWidth - pborder.ActualWidth) / 2,
                    (App.Current.Host.Content.ActualHeight - pborder.ActualHeight) / 2,
                    0,
                    0);
    
                System.Threading.Timer timer = new System.Threading.Timer(
                    (state) =>
                    {
                        popUp.Dispatcher.BeginInvoke(() =>
                        {
                            popUp.IsOpen = false;
                        });
                    }, null, 500, 500);
            });
            popUp.IsOpen = true;
    
        }
    
        /// <summary>
        /// 弹出提示消息按钮为确定
        /// </summary>
        /// <param name="msg"></param>
        public static void ShowMessage(string msg, string title)
        {
            ShowMessage(msg, title, MessageBoxButton.OK);
        }
    
        /// <summary>
        /// 弹出提示消息
        /// </summary>
        /// <param name="msg"></param>
        public static void ShowMessage(string msg, string title, MessageBoxButton buttons)
        {
            MessageBox.Show(msg, title, buttons);
        }
    
        #endregion
    }

    使用的时候只需要MessageBoxHelper.ShowMessage(“Hello World”);就可以了。注意别忘记了PopupBorder控件。

  • 相关阅读:
    开源爬虫综述
    html页面工具-htmlUnit
    Html JavaScript网页制作与开发完全学习手册
    移动互联网之路-李晓斌
    算法图解
    游戏编程算法与技巧
    一秒解决CentOS下service 功能 不能使用 bash: service: command not found
    LINUX企业应用案例精解 第2版 李晨光
    深入分析GCC
    嵌入式LINUX基础教程 第2版
  • 原文地址:https://www.cnblogs.com/songtzu/p/2670023.html
Copyright © 2011-2022 走看看