ImageBlur Effect : ImageBrush « Graphics « Silverlight






ImageBlur Effect

    

<UserControl x:Class='SilverlightApplication3.MainPage'
    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:DesignWidth='640' d:DesignHeight='480'>
  <UserControl.Resources>
    <Storyboard x:Name="CanvasFlower_MouseEnter">
      <DoubleAnimation Duration="00:00:00.50" To="0.65" Storyboard.TargetName="CanvasFlower" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"/>
        <DoubleAnimation Duration="00:00:00.50" To="0.65" Storyboard.TargetName="CanvasFlower" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"/>
      <DoubleAnimation Duration="00:00:00.50" To="1" Storyboard.TargetName="Flower" Storyboard.TargetProperty="(UIElement.Opacity)"/>
    </Storyboard>
    <Storyboard x:Name="CanvasFlower_MouseLeave">
      <DoubleAnimation Duration="00:00:00.50" To="0.5" Storyboard.TargetName="CanvasFlower" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"/>
        <DoubleAnimation Duration="00:00:00.50" To="0.5" Storyboard.TargetName="CanvasFlower" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"/>
      <DoubleAnimation Duration="00:00:00.50" To="0" Storyboard.TargetName="Flower" Storyboard.TargetProperty="(UIElement.Opacity)"/>
    </Storyboard>
  </UserControl.Resources>

  <Canvas x:Name="LayoutRoot" Background="White" >
    <Canvas Height="480" Width="640" Canvas.Left="80" Canvas.Top="60" x:Name="CanvasFlower" RenderTransformOrigin="0.5,0.5" Cursor="Hand" MouseEnter="Flower_MouseEnter" MouseLeave="Flower_MouseLeave">
      <Canvas.RenderTransform>
        <TransformGroup>
          <ScaleTransform ScaleX="0.5" ScaleY="0.5"/>
          <SkewTransform/>
          <RotateTransform/>
          <TranslateTransform/>
        </TransformGroup>
      </Canvas.RenderTransform>
      <Image Height="480" x:Name="FlowerBlur" Width="640" Source="c:/image.jpg"/>
      <Image Height="480" x:Name="Flower" Width="640" Source="c:/image.jpg" Opacity="0"/>
    </Canvas>
  </Canvas>
</UserControl>

//File: Page.xaml.cs
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace SilverlightApplication3
{
    public partial class MainPage : UserControl
    {

    public MainPage()
    {
      // Required to initialize variables
      InitializeComponent();
    }

        private void Flower_MouseEnter(object sender, MouseEventArgs e)
        {
            CanvasFlower_MouseEnter.Begin();
        }

        private void Flower_MouseLeave(object sender, MouseEventArgs e)
        {
            CanvasFlower_MouseLeave.Begin();
        }
  }
}

   
    
    
    
  








Related examples in the same category

1.Use ImageBrush as the TextBox BackgroundUse ImageBrush as the TextBox Background
2.Image BrushesImage Brushes
3.ImageBrush Opacity from 1 to 0ImageBrush Opacity from 1 to 0
4.ImageBrush Stretch StyleImageBrush Stretch Style
5.Using an ImageBrush
6.RotateTransform an ImageBrushRotateTransform an ImageBrush
7.Image Brush DemoImage Brush Demo
8.An example of an ImageBrushAn example of an ImageBrush
9.Specifying a Stretch of None for ImageBrush