最近闲着无事，自定义了一个图片控件，主要是图片放大显示方式，图片加载显示，单击传出BitmapImage数据
图片大小，我是写死了，因为我用的就是86×86的，腌就不管你们死活了！
废话少说，直接看代码
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:CustomControl;assembly=CustomControl"
xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
>
<Style TargetType="local:CustomImage">
<Setter Property="Width" Value="86"></Setter>
<Setter Property="Height" Value="86"></Setter>
<Setter Property="IsTabStop" Value="False" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:CustomImage">
<Canvas x:Name="canvas">
<vsm:VisualStateManager.VisualStateGroups>
<vsm:VisualStateGroup x:Name="MouseOverStates">
<vsm:VisualStateGroup.Transitions>
<vsm:VisualTransition GeneratedDuration="0:0:0.1" />
</vsm:VisualStateGroup.Transitions>
<vsm:VisualState x:Name="Normal">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="border2" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" From="1"
To="0.4" Duration="0:0:0" AutoReverse="False" RepeatBehavior="1x" />
<DoubleAnimation Storyboard.TargetName="border2" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" From="1"
To="0.4" Duration="0:0:0" AutoReverse="False" RepeatBehavior="1x" />
<DoubleAnimation Storyboard.TargetName="image2" Storyboard.TargetProperty="Opacity" From="1"
To="0.2" Duration="0:0:0" AutoReverse="False" RepeatBehavior="1x" />
<DoubleAnimation Storyboard.TargetName="border2" Storyboard.TargetProperty="Opacity" From="1"
To="0.2" Duration="0:0:0" AutoReverse="False" RepeatBehavior="1x" />
</Storyboard>
</vsm:VisualState>
<vsm:VisualState x:Name="MouseOver">
<Storyboard x:Name="myStoryboard">
<DoubleAnimation Storyboard.TargetName="border2" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" From="0.5"
To="1.6" Duration="0:0:0.3" AutoReverse="False" RepeatBehavior="1x" />
<DoubleAnimation Storyboard.TargetName="image2" Storyboard.TargetProperty="Opacity" From="0.2"
To="1" Duration="0:0:0.3" AutoReverse="False" RepeatBehavior="1x" />
<DoubleAnimation Storyboard.TargetName="border2" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" From="0.5"
To="1.6" Duration="0:0:0.3" AutoReverse="False" RepeatBehavior="1x" />
<DoubleAnimation Storyboard.TargetName="border2" Storyboard.TargetProperty="Opacity" From="0.2"
To="1" Duration="0:0:0.3" AutoReverse="False" RepeatBehavior="1x" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="border2" Storyboard.TargetProperty="BorderThickness" Duration="0">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Thickness>0.3,0.3,0.3,0.3</Thickness>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</vsm:VisualState>
</vsm:VisualStateGroup>
</vsm:VisualStateManager.VisualStateGroups>
<Border Canvas.ZIndex="1" x:Name="border1" Width="86" Height="86" Background="White" CornerRadius="2"
BorderBrush="#999999"
BorderThickness="0">
<Border.Style>
<Style TargetType="Border">
<Setter Property="Effect">
<Setter.Value>
<DropShadowEffect ShadowDepth="2" Direction="315" Opacity="0.5" x:Name="myDropShadowEffect" />
</Setter.Value>
</Setter>
</Style>
</Border.Style>
<Image x:Name="image1" Stretch="UniformToFill" Margin="1,1,1,1"></Image>
</Border>
<Border x:Name="border2" Width="86" Height="86" Background="White" CornerRadius="2"
BorderBrush="#999999"
BorderThickness="0">
<Border.Style>
<Style TargetType="Border">
<Setter Property="RenderTransform">
<Setter.Value>
<TransformGroup>
<ScaleTransform CenterX="43" CenterY="43" ></ScaleTransform>
</TransformGroup>
</Setter.Value>
</Setter>
</Style>
</Border.Style>
<Image x:Name="image2">
<Image.Style>
<Style TargetType="Image">
<Setter Property="Stretch" Value="Uniform"></Setter>
<Setter Property="HorizontalAlignment" Value="Center"></Setter>
<Setter Property="Margin" Value="1,1,1,1"></Setter>
<Setter Property="VerticalAlignment" Value="Center"></Setter>
<Setter Property="RenderTransform">
<Setter.Value>
<TransformGroup>
<ScaleTransform CenterX="43" CenterY="43" ></ScaleTransform>
</TransformGroup>
</Setter.Value>
</Setter>
</Style>
</Image.Style>
</Image>
</Border>
<Border Canvas.ZIndex="2" x:Name="borderLoad" Width="86" Height="86" Background="White" Opacity="0.4" CornerRadius="2">
<TextBlock x:Name="textBlockLoad" HorizontalAlignment="Center" Opacity="1" VerticalAlignment="Center" Height="20" Width="20" Text="0%"></TextBlock>
</Border>
</Canvas>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
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;
using System.Windows.Media.Imaging;
namespace CustomControl
{
[TemplatePart(Name = "border1", Type = typeof(Border))]
[TemplatePart(Name = "border2", Type = typeof(Border))]
[TemplatePart(Name = "image1", Type = typeof(Image))]
[TemplatePart(Name = "image2", Type = typeof(Image))]
[TemplatePart(Name = "borderLoad", Type = typeof(Border))]
[TemplatePart(Name = "textBlockLoad", Type = typeof(TextBlock))]
[TemplateVisualState(Name = "Normal", GroupName = "MouseOverStates")]
[TemplateVisualState(Name = "MouseOver", GroupName = "MouseOverStates")]
public class CustomImage : Control
{
#region 私有属性
private bool isMouseOver = false;
private BitmapImage imageData = new BitmapImage();
#endregion
#region 构造函数
public CustomImage()
{
this.DefaultStyleKey = typeof(CustomImage);
imageData.DownloadProgress += new EventHandler<DownloadProgressEventArgs>(imageData_DownloadProgress);
}
#endregion
#region 依赖项属性
public static readonly DependencyProperty SourceProperty =
DependencyProperty.Register("Source", typeof(string), typeof(CustomImage),
new PropertyMetadata(new PropertyChangedCallback(SourceChangedCallback)));
private static void SourceChangedCallback(DependencyObject obj, DependencyPropertyChangedEventArgs args)
{
//"http://localhost:8001/{0}",
CustomImage ctl = (CustomImage)obj;
string newValue = args.NewValue.ToString();
ctl.imageData.UriSource = new Uri(newValue, UriKind.RelativeOrAbsolute);
if (ctl.Image1 != null)
{
ctl.Image1.Source = ctl.imageData;
}
if (ctl.Image2 != null)
{
ctl.Image2.Source = ctl.imageData;
}
ctl.UpdateStates(true);
}
public string Source
{
get { return GetValue(SourceProperty).ToString(); }
set { SetValue(SourceProperty, value); }
}
#endregion
#region 子控件属性
private Border borderLoad;
private Border BorderLoad
{
get { return borderLoad; }
set
{
borderLoad = value;
}
}
private TextBlock textBlockLoad;
private TextBlock TextBlockLoad
{
get { return textBlockLoad; }
set
{
if (!string.IsNullOrEmpty(Source))
{
imageData.UriSource = new Uri(Source, UriKind.RelativeOrAbsolute);
Image1.Source = imageData;
Image2.Source = imageData;
}
textBlockLoad = value;
}
}
protected void imageData_DownloadProgress(object o, DownloadProgressEventArgs e)
{
if (textBlockLoad != null)
{
Canvas.SetZIndex(BorderLoad, 2);
textBlockLoad.Text = string.Format("{0}%", e.Progress);
if (e.Progress == 100)
{
Canvas.SetZIndex(BorderLoad, 0);
}
}
}
private Image image1;
private Image Image1
{
get { return image1; }
set
{
image1 = value;
}
}
private Image image2;
private Image Image2
{
get { return image2; }
set
{
if (image2 != null)
{
image2.MouseLeftButtonDown -=new MouseButtonEventHandler(image2_MouseLeftButtonDown);
}
image2 = value;
if (image2 != null)
{
image2.MouseLeftButtonDown += new MouseButtonEventHandler(image2_MouseLeftButtonDown);
}
}
}
private void image2_MouseLeftButtonDown(object o, MouseButtonEventArgs e)
{
Image obj = o as Image;
BitmapImage imageData = obj.Source as BitmapImage;
if (imageData != null)
{
ImageClickEventArgs arg = new ImageClickEventArgs(imageData);
OnClick(arg);
}
}
private Border border1;
private Border Border1
{
get { return border1; }
set { border1 = value; }
}
private Border border2;
private Border Border2
{
get { return border2; }
set
{
border2 = value;
}
}
#endregion
#region 控件重写事件
protected override void OnMouseEnter(MouseEventArgs e)
{
base.OnMouseEnter(e);
Canvas.SetZIndex(this, 100);
isMouseOver = true;
UpdateStates(true);
Canvas.SetZIndex(Border2, 1);
}
protected override void OnMouseLeave(MouseEventArgs e)
{
base.OnMouseLeave(e);
Canvas.SetZIndex(this, 0);
isMouseOver = false;
UpdateStates(false);
Canvas.SetZIndex(Border2, 0);
}
public override void OnApplyTemplate()
{
Image1 = GetTemplateChild("image1") as Image;
Image2 = GetTemplateChild("image2") as Image;
Border1 = GetTemplateChild("border1") as Border;
Border2 = GetTemplateChild("border2") as Border;
BorderLoad = GetTemplateChild("borderLoad") as Border;
TextBlockLoad = GetTemplateChild("textBlockLoad") as TextBlock;
UpdateStates(false);
}
#endregion
#region 更新状态
private void UpdateStates(bool useTransitions)
{
if (isMouseOver)
{
VisualStateManager.GoToState(this, "MouseOver", useTransitions);
}
else
{
VisualStateManager.GoToState(this, "Normal", useTransitions);
}
}
#endregion
#region 新添控件事件
public delegate void ClickEventHandler(object sender, ImageClickEventArgs e);
public event ClickEventHandler Click;
protected void OnClick(ImageClickEventArgs e)
{
ClickEventHandler handle = Click;
if (handle != null)
{
handle(this, e);
}
}
public class ImageClickEventArgs : EventArgs
{
private BitmapImage _bitmapImageData;
public ImageClickEventArgs(BitmapImage bi)
{
_bitmapImageData = bi;
}
public BitmapImage BitmapImageData
{
get { return _bitmapImageData; }
}
}
#endregion
}
}
玩技术，要学会忍受寂寞－－
