Attached Properties and mouse event

Question

Hello.

I need to do:

create attached property  who work with any type of control. What that the attached property does is when you move the mouse over the control (event MouseEnter) is increased by 10%. When leaving the control (MouseLeave) he returns to the previous size.

A) which property should be applied to change the size?
B) I can not return to the previous size of the element.

namespace MyFilm
{
    class MyHelper
    {
        #region My mouse move Region

        
        public static bool GetMouseOver(DependencyObject obj)
        {
            return (bool)obj.GetValue(MouseOverProperty);
        }

        public static void SetMouseOver(DependencyObject obj, bool value)
        {
            obj.SetValue(MouseOverProperty, value);
        }

       
        public static readonly DependencyProperty MouseOverProperty =
            DependencyProperty.RegisterAttached("MouseOver", typeof(bool), typeof(MyHelper), new FrameworkPropertyMetadata(MyMouseOver) { Inherits = true, AffectsMeasure=true, AffectsParentMeasure=true });
      

        private static void MyMouseOver(DependencyObject sender, DependencyPropertyChangedEventArgs args)
        {
            var myControl = sender as TextBlock;
            if (myControl != null)
            {
                var boolValue = (bool)args.NewValue;
                if (boolValue)
                {
                    myControl.MouseEnter += myControl_MouseEnter;
                    myControl.MouseLeave += myControl_MouseLeave;
                }
                else
                {
                   //  ..........???
                }
            }
        }

        static void myControl_MouseLeave(object sender, RoutedEventArgs e)
        {
            var myControl = (TextBlock)sender;
            myControl.FontSize = myControl.FontSize/3;
        }

        static void myControl_MouseEnter(object sender, RoutedEventArgs e) // MouseEventArgs
        {
            var myControl = (TextBlock)sender;
            myControl.FontSize = myControl.FontSize*3;
        }

       

        #endregion

    }
}

(in the attached code works only with textblock and only increase the text size)

Answer 1

Hi Violetta,

I came up with an idea that should give you what you want, I used the element's RenderTransform to scale it to the right size and back again. I hope that's what you want.

class MyHelper
{
  public static void SetEnlarge(UIElement element, bool value)
  {
    element.SetValue(EnlargeProperty, value);
  }
  public static bool GetEnlarge(UIElement element)
  {
    return (Boolean)element.GetValue(EnlargeProperty);
  }

  public static readonly DependencyProperty EnlargeProperty =
    DependencyProperty.RegisterAttached("Enlarge", typeof(bool), typeof(UIElement),
                                        new PropertyMetadata(false, EnlargeChanged));

  private static void EnlargeChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
  {
    var element = d as UIElement;

    var newVal = (bool) e.NewValue;
    var oldVal = (bool) e.OldValue;

    // Register to MouseEnter and MouseLeave events
    if(newVal && !oldVal)
    {
      element.MouseEnter += element_MouseEnter;
      element.MouseLeave += element_MouseLeave;
    }
    
    if(!newVal && oldVal)
    {
      element.MouseEnter -= element_MouseEnter;
      element.MouseLeave -= element_MouseLeave;
    }
  }

  static void element_MouseLeave(object sender, System.Windows.Input.MouseEventArgs e)
  {
    var element = sender as UIElement;

    ScaleTransform scale;

    if(element.RenderTransform is TransformGroup)
    {
      scale = (element.RenderTransform as TransformGroup).Children.First(x => x is ScaleTransform) as ScaleTransform;

    }
    else
    {
      scale = element.RenderTransform as ScaleTransform;
    }

    scale.ScaleX = 1;
    scale.ScaleY = 1;
  }

  static void element_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)
  {
    var element = sender as UIElement;

    var scale = new ScaleTransform(1.5, 1.5, element.RenderSize.Width/2, element.RenderSize.Height/2);

    if (element.RenderTransform is TransformGroup)
    {
      (element.RenderTransform as TransformGroup).Children.Add(scale);
    }
    else
    {
      element.RenderTransform = scale;
    }
  }
}

Regards

Yoni

Answer 2

Violetta, did you solve the issue?

Answer 3

Hi,

actually, the easiest way to do that would be to set the RenderTransform (as already suggested), but not in an attached property, but simply in a Trigger on IsMouseOver=True. When the trigger condition isn't met any longer, the RenderTransform will revert to its previous setting.

---

http://wpfglue.wordpress.com