Анимация по дуге в WPF

132
24 июня 2019, 22:40

Подскажите как сделать анимацию летящей вращающейся картинки по дуге? В моем случае нужно сделать вращение елочной игрушки по заданной траектории

Саму дугу я сделаю бесцветной (для наглядности пока стоит)

На метаните видел реализацию бегающего по канвасу шарика, но не смог подстроить под себя. Все через code behind

Сама дуга ниже:

                Point btn1Point = ((Button)sender).TransformToAncestor(main).Transform(new Point(-25, 0));
            Line l = new Line();
            l.X1 = btn1Point.X + ((Button)sender).ActualWidth;
            l.Y1 = btn1Point.Y + ((Button)sender).ActualHeight / 2;
            System.Windows.Shapes.Path snowball_path = new System.Windows.Shapes.Path()
            {
                Stroke = Brushes.LightBlue,
                StrokeThickness = 6.0,
                StrokeStartLineCap = System.Windows.Media.PenLineCap.Round,
                StrokeEndLineCap = System.Windows.Media.PenLineCap.Round
            };
            Canvas cnv = new Canvas();
            PathFigureCollection pfc = new PathFigureCollection();
            PathGeometry pg = new PathGeometry();
            PathFigure pf = new PathFigure();
            pf.StartPoint = new Point(l.X1, l.Y1);
            ArcSegment a = new ArcSegment(new Point(1600, 150), new Size(1, 2), 87, true, SweepDirection.Clockwise, true);


            cnv.Children.Add(snowball_path);
            snowball_path.Data = pg;
            pfc.Add(pf);
            pg.Figures = pfc;
            pf.Segments.Add(a);
            main.Children.Insert(0, cnv);

Сейчас застрял на таком моменте: У меня есть PathGeometry дуги, как по ней запустить картинку?

Image snowball = new Image();
snowball.Source = new BitmapImage(new Uri(System.IO.Path.Combine(Environment.CurrentDirectory, "images/snowball.png")));
DoubleAnimationUsingPath animation = new DoubleAnimationUsingPath
{
     PathGeometry = pg,
     Duration = new TimeSpan(5)
};
snowball.BeginAnimation(Image.WidthProperty, animation);

Что писать в

snowball.BeginAnimation(Image.WidthProperty, animation);

сейчас ничего по дуге не проходит, а хотелось бы картинку

**

Последняя наработка:

**

                DoubleAnimationUsingPath animation1 = new DoubleAnimationUsingPath
            {
                PathGeometry = pg,
                Duration = new Duration(TimeSpan.FromSeconds(5)),
                RepeatBehavior = RepeatBehavior.Forever,
                AutoReverse = true,
                SpeedRatio = 1
            };
            snowball.BeginAnimation(Canvas.LeftProperty, animation1);

Шарик бегает по верхней границе экрана, не по дуге

Последняя наработка 2.0_Final

                Rectangle r = new Rectangle();
            r.Name = "snowball";
            r.Width = 60;
            r.Height = 60;
            r.Margin = (sender as Button).Margin;
            r.Fill = new ImageBrush
            {
                ImageSource = new BitmapImage(new Uri(System.IO.Path.Combine(Environment.CurrentDirectory, "images/snowball.png")))
            };
            ThicknessAnimation snowball_throw_animation = new ThicknessAnimation();
            snowball_throw_animation.To = new Thickness(1250, -800, 0, 0);
            snowball_throw_animation.Duration = new Duration(TimeSpan.FromSeconds(1.5));
            snowball_throw_animation.Completed += new EventHandler(snowball_throw_animation_Completed);
            r.BeginAnimation(Rectangle.MarginProperty, snowball_throw_animation);
            main.Children.Add(r);

Сделал по прямой линии, может кому пригодится (*с дугой не получилось)

Последняя наработка 3.0_Final_2.0

Ответ для дуги: как писал @Андрей NOP в комментариях

а нужно анимировать TranslateTransform.XProperty и TranslateTransform.YProperty

Добавьте еще RotateProperty для Rectangle (собственно, у него можно сделать .Fill картинку) и будет счастье! Я все-таки сделал по дуге (ну как сделал, я увидел, что летит не по прямой, а дальше мне было лень координаты задавать).

READ ALSO
Можно ли задампить Expression'ы и Сериализаторы?

Можно ли задампить Expression'ы и Сериализаторы?

Сериализаторы и Expression'ы генерят сборки, которые хранятся в памяти

114
Работа с строковым типом данных

Работа с строковым типом данных

Помогите, пожалуйста с задачей: Дана строка символовСформировать новую строку, в которую включить все символы исходной строки, стоящие на четных...

125