windows phone内置的messagebox弹出窗口局限性太大，不能满足各种个性化的弹出窗口的需求，即使使用第三方的控件库也会有一些局限性，又或者封装的东西太多了，那么这时候就需要自己去根据自己的需求去自定义一个弹出窗口了。
大概的原理就是使用popup控件来实现弹出窗的效果，popup控件可以把包含在其中的控件显示在最外面，从而可以把当前页面的控件都给盖住了，再加点半透明的效果，若隐若现的，一个弹窗就出来了。好吧，下面来看一下demo。
先看一下demo的结构。
generic.xaml
<resourcedictionary
xmlns=""
xmlns:x=""
xmlns:local="clr-namespace:messagecontrol;assembly=messagecontrol"
xmlns:d=""
xmlns:mc=""
mc:ignorable="d"
>
<style targettype="local:mymessage">
<setter property="fontfamily" value="{staticresource phonefontfamilynormal}"/>
<setter property="fontsize" value="{staticresource phonefontsizenormal}"/>
<setter property="foreground" value="{staticresource phoneforegroundbrush}"/>
<setter property="background" value="snow"/>
<setter property="width" value="480" />
<setter property="height" value="800" />
<!--定义模板的template-->
<setter property="template">
<setter.value>
<controltemplate targettype="local:mymessage">
<grid verticalalignment="stretch">
<rectangle x:name="backgroundrect" grid.row="0" fill="black" opacity="0.7"/>
<border
verticalalignment="top"
borderthickness="3"
borderbrush="black">
<stackpanel margin="0">
<contentpresenter x: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
{
public class mymessage : contentcontrol
{
private system.windows.controls.contentpresenter body;
private system.windows.shapes.rectangle backgroundrect;
private object content;
public mymessage()
{
//这将类的stylekey设置为mymessage,这样在模板中的style才能通过targettype="local:mymessage"与之相互绑定
this.defaultstylekey = typeof(mymessage);
}
//重写onapplytemplate()方法获取模板样式的子控件
public override void onapplytemplate()
{
base.onapplytemplate();
this.body = this.gettemplatechild("body") as contentpresenter;
this.backgroundrect = this.gettemplatechild("backgroundrect") as rectangle;
initializemessageprompt();
}
//使用popup控件来制作弹窗
internal popup childwindowpopup
{
get;
private set;
}
//获取当前应用程序的ui框架phoneapplicationframe
private static phoneapplicationframe rootvisual
{
get
{
return application.current == null ? null : application.current.rootvisual as phoneapplicationframe;
}
}
//弹窗的内容，定义为object，可以赋值为各种各样的控件
public object messagecontent
{
get
{
return this.content;
}
set
{
this.content = value;
}
}
//隐藏弹窗
public void hide()
{
if (this.body != null)
{
//关闭popup控件
this.childwindowpopup.isopen = false;
}
}
//判断弹窗是否打开
public bool isopen
{
get
{
return childwindowpopup != null && childwindowpopup.isopen;
}
}
//打开弹窗
public void 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;
}
}
//初始化弹窗
private void initializemessageprompt()
{
if (this.body == null)
return;
this.backgroundrect.visibility = system.windows.visibility.visible;
//把模板中得body控件内容赋值为你传过来的控件
this.body.content = messagecontent;
this.height = 800;
}
}
}
简单地创建有一个控件作为弹窗的内容，测试一下弹窗的效果，当然弹窗的控件你可以定义为你想要的各种内容。
windowsphonecontrol1.xaml
<usercontrol x:class="testmessagecontrol.windowsphonecontrol1"
xmlns=""
xmlns:x=""
xmlns:d=""
xmlns:mc=""
mc:ignorable="d"
fontfamily="{staticresource phonefontfamilynormal}"
fontsize="{staticresource phonefontsizenormal}"
foreground="{staticresource phoneforegroundbrush}"
d:designheight="250" d:designwidth="480">
<grid x:name="layoutroot" background="lightblue">
<button content="是" height="72" horizontalalignment="left" margin="40,169,0,0" name="button1" verticalalignment="top" width="160" />
<button content="关闭" height="72" horizontalalignment="left" margin="254,169,0,0" name="button2" verticalalignment="top" width="160" click="button2_click" />
<textblock height="53" horizontalalignment="left" margin="54,72,0,0" name="textblock1" text="《深入浅出windows phone 7应用开发》" verticalalignment="top" width="369" />
</grid>
</usercontrol>
using system.windows;
using system.windows.controls;
namespace testmessagecontrol
{
public partial class windowsphonecontrol1 : usercontrol
{
public windowsphonecontrol1()
{
initializecomponent();
}
private void button2_click(object sender, routedeventargs e)
{
(app.current as app).mymessage.hide();
}
}
}
在app.xaml.cs中定义为全局弹窗
namespace testmessagecontrol
{
public partial class app : application
{
……
public mymessage mymessage = new mymessage { messagecontent = new windowsphonecontrol1() };
……
}
}
mainpage.xaml.cs
单击事件
using microsoft.phone.controls;
using messagecontrol;
namespace testmessagecontrol
{
public partial class mainpage : phoneapplicationpage
{
public mainpage()
{
initializecomponent();
}
private void button1_click(object sender, routedeventargs e)
{
(app.current as app).mymessage.show();
}
}
}
好了，来看一下运行的效果吧。
摘自 加菲猫
如对本文有疑问， 点击进行留言回复！！
【程序】Marvell 88W8686 WiFi模块（WM-G-MR-09）创建或连接热点，并使用lwip2.0.2建立http服务器（20171030版）
我要评论
网友评论