Silverlightbuttonピクチャ切替スタイルインスタンスコード

今までWPFをやっていたので、Slilverlightに触れている感じがします.
今日はButtonのリクエストをします
2つのピクチャがあり、buttonにはデフォルトで1つのピクチャがあり、マウスoverで別のピクチャを使用します.
wpfで作るときにtemplateを書くのは簡単ですが、silverlightとwpfは違います
記録しておきます.大体2つのイメージマウスMouseOverの時に1つのVisibleと1つのCollapsed
カスタムコントロール、コード、皮膚の分離、簡単なdemoと書かれています.
コードのダウンロード:ImageButtonTest.rar
buttonから継承されたimagebuttonクラスを先に書きます

 
  
using System; 
  
using System.Collections.Generic; 
  
using System.Linq; 
  
using System.Net; 
  
using System.Windows; 
  
using System.Windows.Controls; 
  
using System.Windows.Documents; 
  
using System.Windows.Input; 
  
using System.Windows.Media; 
  
using System.Windows.Media.Animation; 
  
using System.Windows.Shapes; 
   
  
namespace ImageButtonTest
{
    /// 

    /// build by lp
    /// 

    public class MyImageButton : Button
    {

        public static readonly DependencyProperty ImageNormalProperty =
            DependencyProperty.Register("ImageNormal",
                                        typeof(ImageSource),
                                        typeof(MyImageButton),
                                        new PropertyMetadata(null));
 
  
        public static readonly DependencyProperty ImageHoverProperty =
            DependencyProperty.Register("ImageHover",
                                        typeof(ImageSource),
                                        typeof(MyImageButton),
                                        new PropertyMetadata(null));
        // 
        public ImageSource ImageHover
        {
            get { return (ImageSource)GetValue(ImageHoverProperty); }
            set { SetValue(ImageHoverProperty, value); }
        }
        // 
        public ImageSource ImageNormal
        {
            get { return (ImageSource)GetValue(ImageNormalProperty); }
            set { SetValue(ImageNormalProperty, value); }
        }

        public MyImageButton()
        {
            this.DefaultStyleKey = typeof(MyImageButton);
        }
    }
}
 
 

1つはマウスを上に移動するimageSource 1つはデフォルトのsourceです
スタイルを見てsotryboardで制御
マウスMouseOverの場合はVisible 1個Collapsed

 
  
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  
    xmlns:local="clr-namespace:ImageButtonTest" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> 
   
  

    

 
 

これで使えます
ページで呼び出しましょう

 
  
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
  
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
  
    xmlns:local="clr-namespace:ImageButtonTest" x:Class="ImageButtonTest.MainPage" 
  
    mc:Ignorable="d" 
  
    d:DesignHeight="300" d:DesignWidth="400">