前一阵在用WPF写一个硬件测试程序，想把界面做的漂亮一点(毛玻璃效果)，在网上找了半天，结果发现了个OpacityMask这个属性，随之便研究了一下。发现了点意想不到的效果。使用此属性可以达到做网页时按钮hover改变背景图片的功能，而且使用的只是一张图片，不是两张图片。具体效果请看下图:

程序中使用到的按钮图片: 1.       2.

程序很简单，就是5个按钮。程序结构图如下:

================ 开发环境 ================ 系统: Win7 sp1 32位 IDE: Microsoft Visual Studio 2015 Enterprise 工程: .Net Framework 4.6 =========================================

程序中涉及到了几个技术要点:

1. 按钮样式的绑定

2. 按钮自定义样式

3. 按钮自定义样式的触发条件设置

4. 参考文章: 

<
    <不透明遮罩概述>
     > https://msdn.microsoft.com/zh-cn/library/ms743320.aspx
    

具体程序如下所示:

1 
      
        2         
        3         
       10         
       15     
      16 
      
       17         
       
        18             
        19                 20             21             
        
         贴图按钮
        22         
       23         
       
        24             
        25                 
         
          26                     
          27                 
         28             29             
        
         蒙板遮罩
        30         
       31         
       
        32             
        33                 
         
          34                     
          35                 
         36                 37             38             
        
         贴图蒙板遮罩
        39         
       40         
       
        41             
        42                 
         
          43                     
          
           44                         
           
            45 
            46 
           47                         
           
            48 
            
             49 
             50 
            51 
            
             52 
             
              53 
              
               54 
               55 
              56 
             57 
            58 
            
             59 
             60 
            61 
           62                     
          63                 
         64             65             
        
         Hover变色
        66         
       67         
       
        68             
        69                 
         
          70                     
          
           71                         
           
            72 
            73 
           74                         
           
            75 
            
             76 
             
              77 
              
               78 
               79 
              80 
             81 
            82 
            
             83 
             84 
            85 
           86                     
          87                 
         88             89             
        
         Hover变色
        90         
       91 
      

 

5个按钮中第三个按钮[贴图蒙板遮罩]这个按钮是图片1和OpacityMask效果叠加产生的，具体能应用到的地方还未知，也许你能发现呢?

原博客: http://blog.csdn.net/xchicken 被盗，故换坑到此。