Windows Phone 7 玻璃框消息提示

在上一篇博客《Windows Phone 7 最新的开发工具库》中介绍了Phoney项目，其中就有介绍到一个淡入淡出的消息提示，本文将扩展下这个消息提示，即让提示消息出现玻璃边框，类似于Windows 7窗体的效果。

先来看下运行后的效果：

其实说穿了无非就是给弹出框加上玻璃样式。

具体的改法如下：

打开PhoneyTools项目下的FadingMessage.cs文件，找到其中的StandardMessage方法，添加如下代码即可

1. #region 边框  
2.         LinearGradientBrush brush = new LinearGradientBrush();  
3.         brush.EndPoint = new Point(0.5, 1);  
4.         brush.StartPoint = new Point(0.5, 0);  
5.         GradientStop gs1 = new GradientStop();  
6.         gs1.Color = Color.FromArgb(58, 11, 32, 45);  
7.         gs1.Offset = 0;  
8.  
9.         GradientStop gs2 = new GradientStop();  
10.         gs2.Color = Color.FromArgb(62, 255, 255, 255);  
11.         gs2.Offset = 0.25;  
12.  
13.         GradientStop gs3 = new GradientStop();  
14.         gs3.Color = Color.FromArgb(255, 255, 255, 255);  
15.         gs3.Offset = 0.5;  
16.  
17.         GradientStop gs4 = new GradientStop();  
18.         gs4.Color = Color.FromArgb(62, 255, 255, 255);  
19.         gs4.Offset = 0.75;  
20.  
21.         GradientStop gs5 = new GradientStop();  
22.         gs5.Color = Color.FromArgb(191, 255, 255, 255);  
23.         gs5.Offset = 1;  
24.  
25.         GradientStopCollection gsc = new GradientStopCollection();  
26.         gsc.Add(gs1);  
27.         gsc.Add(gs2);  
28.         gsc.Add(gs3);  
29.         gsc.Add(gs4);  
30.         gsc.Add(gs5);  
31.  
32.         brush.GradientStops = gsc;  
33.         #endregion  
34.  
35.         #region 背景  
36.         LinearGradientBrush brushForbg = new LinearGradientBrush();  
37.         brushForbg.EndPoint = new Point(0.5, 1);  
38.         brushForbg.StartPoint = new Point(0.5, 0);  
39.         GradientStop gsBg1 = new GradientStop();  
40.         gsBg1.Color = Color.FromArgb(33, 255, 255, 255);  
41.         gsBg1.Offset = 0;  
42.  
43.         GradientStop gsBg2 = new GradientStop();  
44.         gsBg2.Color = Color.FromArgb(192, 255, 255, 255);  
45.         gsBg2.Offset = 0.287;  
46.  
47.         GradientStop gsBg3 = new GradientStop();  
48.         gsBg3.Color = Color.FromArgb(255, 255, 255, 255);  
49.         gsBg3.Offset = 0.683;  
50.  
51.         GradientStop gsBg4 = new GradientStop();  
52.         gsBg4.Color = Color.FromArgb(33, 255, 255, 255);  
53.         gsBg4.Offset = 1;  
54.  
55.         GradientStopCollection gsc2 = new GradientStopCollection();  
56.         gsc2.Add(gsBg1);  
57.         gsc2.Add(gsBg2);  
58.         gsc2.Add(gsBg3);  
59.         gsc2.Add(gsBg4);  
60.  
61.         brushForbg.GradientStops = gsc2;  
62.         #endregion  
63.  
64.           
65.  
66.  
67.       var theContainer = new Border()  
68.       {  
69.         //Background = PhoneBrushes.PhoneContrastBackgroundBrush,  
70.         //BorderBrush = PhoneBrushes.PhoneBorderBrush,  
71.         Background =brushForbg,//修改为透明背景  
72.         BorderBrush = brush,//修改为玻璃边框  
73.         BorderThickness = PhoneThicknesses.PhoneBorderThickness,  
74.         CornerRadius = new CornerRadius(5)  
75.       }; 

其中就是把原来的笔刷换成自己用C#代码写的笔刷即可。

另共享一个很不错的Silverlight玻璃效果的按钮样式。

1. <Style x:Key="GlassBorderStyle" TargetType="Border"> 
2.             <Setter Property="BorderThickness" Value="2"/> 
3.             <Setter Property="Padding" Value="5"/> 
4.             <Setter Property="Background"> 
5.                 <Setter.Value> 
6.                     <LinearGradientBrush EndPoint="0.75,1" StartPoint="0.25,0"> 
7.                         <GradientStop Color="#33FFFFFF" Offset="0"/> 
8.                         <GradientStop Color="#C0FFFFFF" Offset="0.287"/> 
9.                         <GradientStop Color="#4011322D" Offset="0.683"/> 
10.                         <GradientStop Color="#33FFFFFF" Offset="1"/> 
11.                     </LinearGradientBrush> 
12.                 </Setter.Value> 
13.             </Setter> 
14.             <Setter Property="BorderBrush"> 
15.                 <Setter.Value> 
16.                     <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
17.                         <GradientStop Color="#5811322D" Offset="0"/> 
18.                         <GradientStop Color="#3EFFFFFF" Offset="0.25"/> 
19.                         <GradientStop Color="#FFFFFFFF" Offset="0.5"/> 
20.                         <GradientStop Color="#3EFFFFFF" Offset="0.75"/> 
21.                         <GradientStop Color="#BFFFFFFF" Offset="1"/> 
22.                     </LinearGradientBrush> 
23.                 </Setter.Value> 
24.             </Setter> 
25.             <Setter Property="Effect"> 
26.                 <Setter.Value> 
27.                     <DropShadowEffect BlurRadius="3" ShadowDepth="3" Opacity="0.5"/> 
28.                 </Setter.Value> 
29.             </Setter> 
30.         </Style> 

使用方法：

1. <Border x:Name="GlassBorder" Height="100" Width="250" CornerRadius="10" Style="{StaticResource GlassBorderStyle}"> 
2.             <Button Content="Glass Border Style"/> 
3.         </Border>