The-Oliver.com

Eines der neuen Features von Silverlight 3 und Expression Blend 3 sind die Behaviors. Mit diesen Behaviors lassen sich sehr einfach “generische” Funktionalität erstellen, die man dann auf andere Objekte übertragen kann.

Das folgende Beispiel, soll mit Hilfe des Mausrades, Objekte vergrößern und verkleinern. Geht man mit der Maus auf ein bestimmtes Objekt und dreht dann am Mausrad, dann wird dieses Objekt größer oder kleiner. Verläßt die Maus den Fokus, dann wird das Objekt wieder auf Normalgröße gesetzt.

Vorher:

Nachher:

Damit man das ganze in Blend einfach verwenden kann, muss die unten beschriebene Klasse im aktuellen Projekt integriert oder referenziert sein.

Code für die Behavior-Klasse:

using System.Windows;
using System.Windows.Input;
using System.Windows.Interactivity;
using System.Windows.Media;

namespace Oliver.Behaviors
{
    public class MouseMagnifier : Behavior<FrameworkElement>
    {
        FrameworkElement _target;
        ScaleTransform _scale;

        private double _scaleFactor = 0.2;
        public double ScaleFactor
        {
            get { return _scaleFactor; }
            set { _scaleFactor = value; }
        }

        protected override void OnAttached()
        {
            _target = this.AssociatedObject;
            _target.MouseWheel += new MouseWheelEventHandler(_target_MouseWheel);
            _target.MouseLeave += new MouseEventHandler(_target_MouseLeave);

            _scale = new ScaleTransform();
            _target.RenderTransform = _scale;
            base.OnAttached();
        }

        void _target_MouseLeave(object sender, MouseEventArgs e)
        {
            _scale.ScaleX = 1;
            _scale.ScaleY = 1;
        }

        void  _target_MouseWheel(object sender, MouseWheelEventArgs e)
        {
            if (e.Delta > 0)
            {
                _scale.ScaleX += _scaleFactor;
                _scale.ScaleY += _scaleFactor;
            }
            else
            {
                _scale.ScaleX -= _scaleFactor;
                _scale.ScaleY -= _scaleFactor;
            }   
        }

    }
}

XAML-Code für die UI:

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" xmlns:Oliver_Behaviors="clr-namespace:Oliver.Behaviors;assembly=Oliver.Controls.Silverlight.Behaviors" x:Class="Oliver.Apps.ControlTester.Samples.MouseMagnifierBehaviorSample"
    Width="400" Height="300">
    <Grid x:Name="LayoutRoot" Background="White">

        <Rectangle Stroke="Black" Height="66" HorizontalAlignment="Left" Margin="29,56,0,0" VerticalAlignment="Top" Width="126">
            <i:Interaction.Behaviors>
                <Oliver_Behaviors:MouseMagnifier/>
            </i:Interaction.Behaviors>
            <Rectangle.Fill>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="Black" Offset="0"/>
                    <GradientStop Color="White" Offset="1"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>
        <Button Height="54" HorizontalAlignment="Right" Margin="0,56,69,0" VerticalAlignment="Top" Width="99" Content="Button">
            <i:Interaction.Behaviors>
                <Oliver_Behaviors:MouseMagnifier/>
            </i:Interaction.Behaviors>
        </Button>
        <TextBox Height="29" Margin="179,0,95,106" VerticalAlignment="Bottom" Text="TextBox" TextWrapping="Wrap">
            <i:Interaction.Behaviors>
                <Oliver_Behaviors:MouseMagnifier/>
            </i:Interaction.Behaviors>
        </TextBox>
        <TextBlock HorizontalAlignment="Left" VerticalAlignment="Top" Text="Use Mousewheel over Controls to resize them. " TextWrapping="Wrap"/>

    </Grid>
</UserControl>

Silverlight Behavior, Code, FAQ