日期:2014-05-17  浏览次数:20751 次

新时尚Windows8开发(17):自己也来做一做弹出对话框

Windows Store应用程序有点像Web页面,一般而言,我们只有一个窗口,不会像传统的桌面应用程序那样,使用多个子窗体。

前面我们也讨论过MessageDialog类用来弹出对话框,但是,它只能显示文本信息,如果一些复杂的内容,就不能满足我们的要求了。本来考虑Windows.UI.Core命名空间下的CoreWindowDialog类,但,后来发现这个类貌似一个空壳子,反正我是不知道这个类是怎么用的,那么,咋办呢,有没有其它方法呢?

其实所谓的弹出层,说白了,其本质就是一个控件,这个控件我们如果玩过WPF,会觉得灰常熟悉,谁呢?就是这位帅哥——Popup(位于Windows.UI.Xaml.Controls.Primitives下),怎么样,似曾相识吧?

 

我们总结,每个弹出层,无论其内容是什么,都有以下共同特点:

1、有一个半透明的层覆盖在现有UI上,以阻止用户操作弹出对话框下的UI元素。

2、除了内容不同,弹出层的大小位置以及背景都是一个样的。

 

这样的话,我们不妨自己来写一个控件,这个控件具有内容模型,这样,在弹出框中需要什么内容,我们只需设置其Content就行了。

 

下面,我们就实地演练一下吧。

1、用动VS,新建一个空白页面项目。

2、在“解决方案资源管理器”上右击,从菜单中选择“添加”-“新建项”。

 

在接下来的窗口中选择“模板化控件”,输入控件名字,确定。

 

让后你会看到下面这个。

 

3、打开Generic.xaml,先为控件定义好模板。

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1">

    <Style TargetType="local:PopControl">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:PopControl">
                    <Grid>
                        <Rectangle Canvas.ZIndex="0" Fill="Black" Opacity="0.4"/>
                        <ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" ContentTemplate="{TemplateBinding ContentTemplate}" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>


模板一点也不复杂,接下来是核心部分,就是控件的逻辑代码。

using System;
using System.Collections.Generic;
using System.Linq;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Documents;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Media.Animation;

namespace App1
{
    public class PopControl : ContentControl
    {
        Popup m_pop = null;

        public PopControl()
        {
            this.DefaultStyleKey = typeof(PopControl);
            // 弹出层的宽度等于窗口的宽度
            this.Width = Window.Current.Bounds.Width;
            // 弹出层的高度等于窗口的高度
            this.Height = Window.Current.Bounds.Height;
            this.HorizontalContentAlignment = Windows.UI.Xaml.HorizontalAlignment.Stretch;
            this.m_pop = new Popup();
            // 将当前控件作为Popup的Child
            this.m_pop.Child = this;
        }

        /// <summary>
        /// 获取Popup的ChildTransitions集合
        /// </summary>
        public TransitionCollection PopTransitions
        {
            get
            {
                if (m_pop.ChildTransitions == null)
                {
                    m_pop.ChildTransitions = new TransitionCollection();
                }
                return m_pop.ChildTransitions;
            }
        }

        /// <summary>
        /// 显示弹出层
        /// </summary>
        public virtual void ShowPop()
        {
            if (this.m_pop != null)
            {
                this.m_pop.IsOpen = true;
            }
        }
        /// <summary>
        /// 隐藏弹出层
        /// </summary>
        public virtual void HidePop()
        {
            if (this.m_pop != null)
            {