Particle smoke effect

Having just finished a basic particle engine I thought I would quickly use this as a basis to make a smoke / fog effect.

Read more

Free Useful Visual Studio 2012 Plugins

What do you do when you find yourself struggling to write even the most basic of code having been using Resharper with VS2010 and you really don’t want to spend any money on a license?

Luckily there is free stuff out there to help (some of which is also available for 2010):

Read more

Random effect based on Particle system

Just a small update with a random effect I created based on my particle engine. A fiddle of the effect is here.

Particle System backlog

Features I plan to do as enhancements for by basic particle engine. Please add comments / vote on what you would like to see in the comments.
  • Use multiple technologies to render the particles but keep the engine inside JavaScript
  • Particle lifespans
  • Particle colouring / size throughout lifespan (lerp)
  • Use image as particle + rotate
  • Emitters (line, panel, angled)
  • Gravitational fields
  • Flocking
  • Repulsion fields
  • Collision detection between particles.
  • Some sort of performance benchmark (maybe swap to use dojo)
  • Smoke effects
  • Fire effects

Unhandling previously handled events in Silverlight

What?

You may well find yourself wanting to attach to an event which has already been handled inside a control with no way to override and prevent the event from being handled. As seen in my prior post to this, you can make use of the AddHandler method. I am going to use the Backspace key down in a TextBox as an example, the event is only raised and not handled when the TextBox is empty. (This can be seen in the sample application in the output coming from the behavior)

Read more

Detect whether the mouse is down in Silverlight

After recently searching for a way to do this and finding nothing I thought I would share a solution. It involves using the ever useful AddHandler method on the UIElement you wish to detect the mouse down on and simply setting a flag. Job done.

It is worth noting that popups and child windows may appear on top of the UIElement which the handler is attached to.

Read more

Using Silverlight and JavaScript to prevent leaving a webpage

Recently I have been thinking about applications with data input and the problems of being in a browser. One of the perils of being in a browser is that a user may have some unsaved data input tasks. The data can be easily lost by accidently navigating to a different webpage, closing the browser or closing the tab.

Preventing this is relatively easy making use of Silverlight and JavaScript communication in conjunction with the window.onbeforeunload function. See below for example and code snippets. 😀

Read more

Normal mapping in Silverlight

This is a port of a shader I wrote a long time ago at University to Silverlight. It was originally written it Direct X and C++. I am not going to go into too much detail about the implementation but will mention key points I came across.

Read more

Double Click behavior, mvvm compliant

Often when creating an application you will want a secondary mechanism for executing a command, the primary mechanism will often be a button click (e.g. Opening a record). In MVVM the backing ViewModel will expose an ICommand which is bound to the Button’s Command. This behavior executes the same command when a double click occurs.

Sample Application:

Install Microsoft Silverlight

How:

  • Register to the Mouse Up event on the AssociatedObject, we use the Mouse Up event so that we can attach the behavior to DataGrid / ListBox templates as the Mouse Down events are swallowed by these.
  • Create a dependancy property for the ICommand and the ClickInterval (this will commonly be hard coded by exists for demonstration purposes)
  • Set up a DispatcherTimer with the desired interval, also attach the Tick event and stop the timer.
  • When Mouse Up occurs event occurs the first time we start the DispatcherTimer.
  • For a double click to occur the Mouse Up event must be raised while the timer is active, if it is then we execute the Command and stop the timer.

Code:

public class DoubleClickBehavior : Behavior<UIElement>
{
    private readonly DispatcherTimer _timer = new DispatcherTimer();

    protected override void OnAttached()
    {
        base.OnAttached();
        AssociatedObject.MouseLeftButtonUp += AssociatedObjectMouseLeftButtonUp;
        _timer.Tick += new EventHandler(_timerTick);
        _timer.Interval = TimeSpan.FromSeconds(ClickInterval);
    }

    protected override void OnDetaching()
    {
        base.OnDetaching();
        AssociatedObject.MouseLeftButtonUp -= AssociatedObjectMouseLeftButtonUp;
    }

    private void _timerTick(object sender, EventArgs e)
    {
        _timer.Stop();
    }

    private void AssociatedObjectMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
    {
        if (!_timer.IsEnabled)
        {
            // If the timer is not already running then start it.
            _timer.Start();
        }
        else
        {
            _timer.Stop();
            if(CommandToExecute != null)
            {
                // If the timer is active there has been a second event so execute the command.
                CommandToExecute.Execute(this);

            }
        }
    }

    public static readonly DependencyProperty IntervalProperty =
        DependencyProperty.Register("ClickInterval",
        typeof(double),
        typeof(DoubleClickBehavior),
        new PropertyMetadata(0.25,
            new PropertyChangedCallback(OnClickIntervalChanged)));

    private static void OnClickIntervalChanged(DependencyObject sender, DependencyPropertyChangedEventArgs args)
    {
        var doubleClick = (DoubleClickBehavior)sender;
        doubleClick._timer.Interval = TimeSpan.FromSeconds(doubleClick.ClickInterval);
    }

    public double ClickInterval
    {
        get { return (double)GetValue(IntervalProperty); }
        set { SetValue(IntervalProperty, value); }
    }

    public static readonly DependencyProperty CommandProperty =
        DependencyProperty.Register("CommandToExecute",
        typeof(ICommand),
        typeof(DoubleClickBehavior),
        new PropertyMetadata(null));

    public ICommand CommandToExecute
    {
        get { return (ICommand)GetValue(CommandProperty); }
        set { SetValue(CommandProperty, value); }
    }
}

Update:

xaml

Xaml

Source

Download solution

public class DoubleClickBehavior : Behavior<UIElement>
{
private readonly DispatcherTimer _timer = new DispatcherTimer();protected override void OnAttached()
{
base.OnAttached();
AssociatedObject.MouseLeftButtonUp += AssociatedObjectMouseLeftButtonUp;
_timer.Tick += new EventHandler(_timerTick);
_timer.Interval = TimeSpan.FromSeconds(ClickInterval);
}protected override void OnDetaching()
{
base.OnDetaching();
AssociatedObject.MouseLeftButtonUp -= AssociatedObjectMouseLeftButtonUp;
}private void _timerTick(object sender, EventArgs e)
{
_timer.Stop();
}private void AssociatedObjectMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
if (!_timer.IsEnabled)
{
// If the timer is not already running then start it.
_timer.Start();
}
else
{
if(CommandToExecute != null)
{
// If the timer is active there has been a second event so execute the command.
CommandToExecute.Execute(this);
}
}
}public static readonly DependencyProperty IntervalProperty =
DependencyProperty.Register(“ClickInterval”,
typeof(double),
typeof(DoubleClickBehavior),
new PropertyMetadata(0.25,
new PropertyChangedCallback(OnClickIntervalChanged)));

private static void OnClickIntervalChanged(DependencyObject sender, DependencyPropertyChangedEventArgs args)
{
var doubleClick = (DoubleClickBehavior)sender;
doubleClick._timer.Interval = TimeSpan.FromSeconds(doubleClick.ClickInterval);
}

public double ClickInterval
{
get { return (double)GetValue(IntervalProperty); }
set { SetValue(IntervalProperty, value); }
}

public static readonly DependencyProperty CommandProperty =
DependencyProperty.Register(“CommandToExecute”,
typeof(ICommand),
typeof(DoubleClickBehavior),
new PropertyMetadata(null));

public ICommand CommandToExecute
{
get { return (ICommand)GetValue(CommandProperty); }
set { SetValue(CommandProperty, value); }
}
}

Behavior to process an Image Drop from file system to Image Source

This behavior is used to set the source of a silverlight image control when an image is dropped from the file system onto a UIElement in the Silverlight application.
Sample Application:

Install Microsoft Silverlight

How:

  • Register to the Drop event on the AssociatedObject.
  • The dropped file is processed to a bitmap image from a filestream. I took advantage of using the extension method for processing a file drop which can be seen here.
  • Set the Source of the TargetImage to be the dropped image.

Code:

public class ImageDropBehavior : Behavior<UIElement>
    {
        protected override void OnAttached()
        {
            base.OnAttached();
            AssociatedObject.Drop +=
                new DragEventHandler(AssociatedObject_Drop);
        }

        protected override void OnDetaching()
        {
            base.OnDetaching();
            AssociatedObject.Drop -=
                new DragEventHandler(AssociatedObject_Drop);
        }

        private void AssociatedObject_Drop(object sender, DragEventArgs e)
        {
            Func<FileStream, BitmapImage> func = (stream) =>
            {
                BitmapImage bitmapImage = new BitmapImage();
                bitmapImage.SetSource(stream);

                return bitmapImage;
            };

            var droppedImage =
                e.ProcessDragEventArgsTo<BitmapImage>(func, _ => { });
            if (droppedImage != null)
            {
                TargetImage.Source = droppedImage;
            }
        }

        public static readonly DependencyProperty TargetImageProperty =
            DependencyProperty.Register("TargetImage",
            typeof(Image),
            typeof(ImageDropBehavior),
            new PropertyMetadata(null));

        public Image TargetImage
        {
            get { return (Image)GetValue(TargetImageProperty); }
            set { SetValue(TargetImageProperty, value); }
        }
    }
}

Using the behavior:

  • Attach the behavior to a UIElement.
  • The AllowDrop property needs to be set to true on the UIElement the behavior is attached to else the Drop event will never be raised.
  • Element bind the TargetImage property on the behavior to an Image.
  • See the behavior being used in blend:

Notes:

  • If the target image has data binding, this behavior will remove the binding when it sets the image source.
  • Will only work for Silverlight supported images. At the point of writing these are jpg and png.
public class ImageDropBehavior : Behavior<UIElement>
{
protected override void OnAttached()
{
base.OnAttached();
AssociatedObject.Drop += new DragEventHandler(AssociatedObject_Drop);
}

protected override void OnDetaching()
{
base.OnDetaching();
AssociatedObject.Drop -= new DragEventHandler(AssociatedObject_Drop);
}

private void AssociatedObject_Drop(object sender, DragEventArgs e)
{
Func<FileStream, BitmapImage> func = (stream) =>
{
BitmapImage bitmapImage = new BitmapImage();
bitmapImage.SetSource(stream);

return bitmapImage;
};

var droppedImage = e.ProcessDragEventArgsTo<BitmapImage>(func, _ => { });
if (droppedImage != null)
{
TargetImage.Source = droppedImage;
}
}

public static readonly DependencyProperty TargetImageProperty =
DependencyProperty.Register(“TargetImage”,
typeof(Image),
typeof(ImageDropBehavior),
new PropertyMetadata(null));

public Image TargetImage
{
get { return (Image)GetValue(TargetImageProperty); }
set { SetValue(TargetImageProperty, value); }
}
}

Return top