SilverLight中ImageButton控件制作方法

SilverLight中ImageButton控件制作方法

----------------------------------------------------------------------------------

public partial class ImageButton : UserControl
    {
        public event EventHandler Click = null;
        public ImageButton()
        {
            InitializeComponent();

            this.MouseLeftButtonDown += new MouseButtonEventHandler(ImageButton_MouseLeftButtonDown);
            this.MouseLeftButtonUp += new MouseButtonEventHandler(ImageButton_MouseLeftButtonUp);
            this.MouseEnter += new MouseEventHandler(ImageButton_MouseEnter);
            this.MouseLeave += new MouseEventHandler(ImageButton_MouseLeave);
            this.SizeChanged += new SizeChangedEventHandler(ImageButton_SizeChanged);

            this.image1.Margin = new Thickness(0, 0, 0, 0);
            if (this.ImageSourceNormal != null)
            {
                this.image1.Source = this.ImageSourceNormal;
                //this.LayoutRoot.Background = this.ImageSourceNormal as DependencyObject;
            }
            ImageButton_SizeChanged(null, null);
        }

        private void ImageButton_SizeChanged(object sender, SizeChangedEventArgs e)
        {
            this.image1.Width = this.Width;
            this.image1.Height = this.Height;
        }
        private void ImageButton_MouseLeave(object sender, MouseEventArgs e)
        {
            if (this.ImageSourceNormal != null)
            {
                this.image1.Source = this.ImageSourceNormal;
            }
        }
        private void ImageButton_MouseEnter(object sender, MouseEventArgs e)
        {
            if (this.ImageSourceOverlap != null)
            {
                this.image1.Source = this.ImageSourceOverlap;
            }
        }
        private void ImageButton_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            if (this.ImageSourceDown != null)
            {
                this.image1.Source = this.ImageSourceDown;
            }
        }
        private void ImageButton_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
        {
            if (this.ImageSourceOverlap != null)
            {
                this.image1.Source = this.ImageSourceOverlap;
            }
            //单击事件
            if (this.Click != null)
            {
                this.Click(sender, e);
            }
        }

        //定义正常显示图片源
        public ImageSource ImageSourceNormal
        {
            get { return base.GetValue(ImageSourceNormalProperty) as ImageSource; }
            set 
            { 
                base.SetValue(ImageSourceNormalProperty, value);
                this.image1.Source = value;
            }
        }
        public static readonly DependencyProperty ImageSourceNormalProperty = DependencyProperty.Register("ImageSourceNormal", typeof(ImageSource), typeof(ImageButton), new PropertyMetadata(null));
        
        //定义Overlap显示图片源
        public ImageSource ImageSourceOverlap
        {
            get { return base.GetValue(ImageSourceOverlapProperty) as ImageSource; }
            set { base.SetValue(ImageSourceOverlapProperty, value); }
        }
        public static readonly DependencyProperty ImageSourceOverlapProperty = DependencyProperty.Register("ImageSourceOverlap", typeof(ImageSource), typeof(ImageButton), new PropertyMetadata(null));
        
        //定义Down显示图片源        
        public ImageSource ImageSourceDown
        {
            get { return base.GetValue(ImageSourceDownProperty) as ImageSource; }
            set { base.SetValue(ImageSourceDownProperty, value); }
        }
        public static readonly DependencyProperty ImageSourceDownProperty = DependencyProperty.Register("ImageSourceDown", typeof(ImageSource), typeof(ImageButton), new PropertyMetadata(null));
        
    }

 

ImageButton.xaml

------------------------------------------------------------

<UserControl x:Class="SlApp.Controls.ImageButton"
    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"
    mc:Ignorable="d"
    d:DesignHeight="227" d:DesignWidth="321">
    
    <Grid x:Name="LayoutRoot" Height="192" Width="278">
        <Image Height="168" HorizontalAlignment="Left" Margin="0,0,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="254" />
        <Grid.Background>
            <ImageBrush />
        </Grid.Background>
    </Grid>
</UserControl>