Windows Phone内置的MessageBox弹出窗口局限性太大,不能满足各种个性化的弹出窗口的需求,即使使用第三方的控件库也会有一些局限性,又或者封装的东西太多了,那么这时候就需要自己去根据自己的需求去自定义一个弹出窗口了。大概的原理就是使用Popup控件来实现弹出窗的效果,Popup控件可以把包含在其中的控件显示在最外
Windows Phone内置的MessageBox弹出窗口局限性太大,不能满足各种个性化的弹出窗口的需求,即使使用第三方的控件库也会有一些局限性,又或者封装的东西太多了,那么这时候就需要自己去根据自己的需求去自定义一个弹出窗口了。
大概的原理就是使用Popup控件来实现弹出窗的效果,Popup控件可以把包含在其中的控件显示在最外面,从而可以把当前页面的控件都给盖住了,再加点半透明的效果,若隐若现的,一个弹窗就出来了。好吧,下面来看一下Demo。
先看一下demo的结构。
Generic.xaml
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:MessageControl;assembly=MessageControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
>
<StyleTargetType="local:MyMessage">
<SetterProperty="FontFamily" Value="{StaticResource PhoneFontFamilyNormal}"/>
<SetterProperty="FontSize" Value="{StaticResource PhoneFontSizeNormal}"/>
<SetterProperty="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
<SetterProperty="Background" Value="Snow"/>
<SetterProperty="Width" Value="480"/>
<SetterProperty="Height" Value="800"/>
<!--定义模板的Template-->
<SetterProperty="Template">
<Setter.Value>
<ControlTemplateTargetType="local:MyMessage">
<GridVerticalAlignment="Stretch">
<Rectanglex:Name="backgroundRect" Grid.Row="0"Fill="Black" Opacity="0.7"/>
<Border
VerticalAlignment="Top"
BorderThickness="3"
BorderBrush="Black">
<StackPanelMargin="0">
<ContentPresenterx:Name="body"/>
</StackPanel>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
using System.Windows;
using System.Windows.Controls;
using System.Windows.Shapes;
using System.Windows.Controls.Primitives;
using Microsoft.Phone.Controls;
namespace MessageControl
{
publicclass MyMessage : ContentControl
{
privateSystem.Windows.Controls.ContentPresenter body;
privateSystem.Windows.Shapes.Rectangle backgroundRect;
privateobject content;
publicMyMessage()
{
//这将类的styleKey设置为MyMessage,这样在模板中的style才能通过TargetType="local:MyMessage"与之相互绑定
this.DefaultStyleKey=typeof(MyMessage);
}
//重写OnApplyTemplate()方法获取模板样式的子控件
publicoverridevoid OnApplyTemplate()
{
base.OnApplyTemplate();
this.body=this.GetTemplateChild("body")as ContentPresenter;
this.backgroundRect=this.GetTemplateChild("backgroundRect")as Rectangle;
InitializeMessagePrompt();
}
//使用Popup控件来制作弹窗
internalPopup ChildWindowPopup
{
get;
privateset;
}
//获取当前应用程序的UI框架PhoneApplicationFrame
privatestatic PhoneApplicationFrame RootVisual
{
get
{
returnApplication.Current ==null ? null :Application.Current.RootVisualas PhoneApplicationFrame;
}
}
//弹窗的内容,定义为object,可以赋值为各种各样的控件
publicobject MessageContent
{
get
{
returnthis.content;
}
set
{
this.content= value;
}
}
//隐藏弹窗
publicvoid Hide()
{
if (this.body !=null)
{
//关闭Popup控件
this.ChildWindowPopup.IsOpen=false;
}
}
//判断弹窗是否打开
publicbool IsOpen
{
get
{
returnChildWindowPopup !=null && ChildWindowPopup.IsOpen;
}
}
//打开弹窗
publicvoid Show()
{
if (this.ChildWindowPopup ==null)
{
this.ChildWindowPopup=new Popup();
this.ChildWindowPopup.Child=this;
}
if (this.ChildWindowPopup !=null && Application.Current.RootVisual!=null)
{
InitializeMessagePrompt();
this.ChildWindowPopup.IsOpen=true;
}
}
//初始化弹窗
privatevoid InitializeMessagePrompt()
{
if (this.body ==null)
return;
this.backgroundRect.Visibility= System.Windows.Visibility.Visible;
//把模板中得body控件内容赋值为你传过来的控件
this.body.Content= MessageContent;
this.Height =800;
}
}
}
简单地创建有一个控件作为弹窗的内容,测试一下弹窗的效果,当然弹窗的控件你可以定义为你想要的各种内容。