Silverlight1.0的Button的实现

     众所周知,在Silverlight1.0中,不存在Button类,如果要实现button效果,MouseEnter,MouseLeave,MouseLeftDown,MouseLeftUp,需要使用三张Image图片:Img_Name,Img_Click,Img_Over来表示Button状态。
     鼠标事件对应关系:
     MouseEnter 对应 Img_Over;MouseLeave对应Img_Name;MouseLeftDown对应Img_Click;MouseLeftUp对应Img_Over;
     这三张图片需要放在一个Canvas类中,最重要的一点要让三张图片IsTestHit=false,而Canvas的IsTestHit=true。
最重要的Canvas的Background的#01FFFFFF  (必须设置背景色,否则不能触发点击事件)

     实例代码:
     XAML的代码

  <Canvas Canvas.Left="0" Canvas.Top="64"
          Width
="39" Height="360" 
          x:Name
="Pre" IsHitTestVisible="True"
          Background
="#01FFFFFF">
      
<Image Source="SilverlightImg/PrevArrow.png" 
           x:Name
="Img_Pre" 
           Width
="36" Height="358" 
           Canvas.Top
="5" Canvas.Left="-5" 
           IsHitTestVisible
="False"/>
    
<Image  IsHitTestVisible="False" 
            Width
="36" Height="358" 
            Source
="SilverlightImg/PrevArrow_Over.png" 
            Stretch
="Fill" Canvas.Left="-5" Canvas.Top="5" 
            x:Name
="Img_Pre_Over" Visibility="Collapsed"/>
    
<Image  IsHitTestVisible="False" 
            Width
="36" Height="358" 
            Canvas.Top
="5" Source="SilverlightImg/PrevArrow_Click.png" 
            Stretch
="Fill" x:Name="Img_Pre_Click" 
            Canvas.Left
="-8" Visibility="Collapsed"/>
  
</Canvas>

    绑定事件:

    this.next.addEventListener("MouseEnter",handlePreNextMouseEnter);
        
this.next.addEventListener("MouseLeftButtonDown",handlePreNextMouseDown);
        
this.next.addEventListener("MouseLeftButtonUp",handlePreNextMouseUp);
        
this.next.addEventListener("MouseLeave",handlePreNextMouseLeave);

    处理事件代码:

    function handlePreNextMouseDown(sender, eventArgs) 
    
{
        
var imgName = "Img_"+sender.Name+"_Click"
        
var imgButton = sender.findName(imgName);
        imgButton.visibility 
= "Visible"
        imgName 
= "Img_"+sender.Name+"_Over";
        imgButton 
= sender.findName(imgName);
        imgButton.visibility 
= "Collapsed"
    }

    
    
function handlePreNextMouseUp(sender, eventArgs) 
    
{
        
var imgName = "Img_"+sender.Name+"_Click"
        
var imgButton = sender.findName(imgName);
        imgButton.visibility 
= "Collapsed"
        imgName 
= "Img_"+sender.Name+"_Over";
        imgButton 
= sender.findName(imgName);
        imgButton.visibility 
= "Visible"
    }

    
    
function handlePreNextMouseLeave(sender, eventArgs) 
    
{
        handleMouseLeave(sender,eventArgs);
        
var imgName = "Img_"+sender.Name+"_Click";
        
var imgButton = sender.findName(imgName);
        
        
if(imgButton != null)
        
{
            imgButton.visibility 
= "Collapsed";
        }

    }

    
    
function handleMouseEnter(sender,eventArgs)
    
{
        
var imgName = "Img_"+sender.Name+"_Over";
        
var imgButton = sender.findName(imgName);
        imgButton.visibility 
= "Visible"
        
        imgName 
= "Img_"+sender.Name;
        imgButton 
= sender.findName(imgName);
        imgButton.visibility 
= "Collapsed";
    }

    
    
function handleMouseLeave(sender,eventArgs)
    
{
        
var imgName = "Img_"+sender.Name+"_Over";
        
var imgButton = sender.findName(imgName);
        imgButton.visibility 
= "Collapsed";
        
        imgName 
= "Img_"+sender.Name;
        imgButton 
= sender.findName(imgName);
        imgButton.visibility 
= "Visible"
    }




    这是Silverlight开发中总结的一个小经验,在这里记录一下

原文地址:https://www.cnblogs.com/GeeWu/p/1187588.html