Scaled ellipse over button, button not clickable

Question

Hi,

I'm scaling an ellipse in an animation with the following code:

        ScaleTransform myScTransform = new ScaleTransform();
        TransformGroup myTransGroup = new TransformGroup();
        myTransGroup.Children.Add(myScTransform);
        newPHRadio.RenderTransform = myTransGroup;
        newPHRadio.RenderTransformOrigin = new Point(0.5, 0.5);

        Storyboard story = new Storyboard();
        DoubleAnimation xAnimation = new DoubleAnimation(1, ph.Bereik, new Duration(TimeSpan.FromSeconds(2)));
        DoubleAnimation yAnimation = new DoubleAnimation(1, ph.Bereik, new Duration(TimeSpan.FromSeconds(2)));
        DoubleAnimation doorzichtig = new DoubleAnimation(1, 0, new Duration(TimeSpan.FromSeconds(2)));

        Storyboard.SetTarget(xAnimation, newPHRadio);
        Storyboard.SetTarget(yAnimation, newPHRadio);
        Storyboard.SetTarget(doorzichtig, newPHRadio);

        DependencyProperty[] propertyChainX = new DependencyProperty[] {
           Ellipse.RenderTransformProperty, 
           TransformGroup.ChildrenProperty,
           ScaleTransform.ScaleXProperty
        };

        DependencyProperty[] propertyChainY = new DependencyProperty[] {
           Ellipse.RenderTransformProperty, 
           TransformGroup.ChildrenProperty,
           ScaleTransform.ScaleYProperty
        };

        string thePath = "(0).(1)[0].(2)";

        Storyboard.SetTargetProperty(xAnimation, new PropertyPath(thePath, propertyChainX));
        Storyboard.SetTargetProperty(yAnimation, new PropertyPath(thePath, propertyChainY));
        Storyboard.SetTargetProperty(doorzichtig, new PropertyPath(Ellipse.OpacityProperty));

        story.Children.Add(xAnimation);
        story.Children.Add(yAnimation);
        story.Children.Add(doorzichtig);

        story.Duration = new Duration(TimeSpan.FromSeconds(60 / ph.Frequentie));
        story.RepeatBehavior = RepeatBehavior.Forever;
        story.Begin();

The ellipse is constructed with the following code:

        Ellipse newPHRadio = new Ellipse();

        newPHRadio.Width = 1;
        newPHRadio.Height = 1;
        newPHRadio.SetValue(Canvas.LeftProperty, ph.xPositie + 7);
        newPHRadio.SetValue(Canvas.TopProperty, ph.yPositie + 7);
        newPHRadio.SetValue(Canvas.ZIndexProperty, 3);

        newPHRadio.Stroke = new SolidColorBrush(Colors.Black);
        newPHRadio.StrokeThickness = 0.03;

Now the ellipse is scaled over an button which has a z-index of 1. With a static ellipse and no fill, the button is clickable. Now there is no fill as well but the button is not clickable. Can someone tell me how to fix this?

Answer 1

With the code you provided the button is clickable.

But if you set the Fill of the ellipse to anything but null, even to Brushes.Transparent, the click will not make it to the button anymore.

Try explicitly setting the Fill of the ellipse to null:

newPHRadio.Fill = null;