2

Всем привет. Есть элемент класса Polygon, у него есть 4 точки, две из которых необходимо анимированно переместить. Не могу понять как анимировать отдельные точки (с использованием BeginAnimation). Код на C#. На картинке показана трансформация фигуры.

Трансформация фигуры

[Update]

Фигуру создал так:

<Polygon x:Name="_polygon" Fill="AliceBlue" Points="0,0 10,10 90,10 100,0"></Polygon>

Без анимации перемещаю так:

_polygon.Points[1] = new Point(0, 50);
_polygon.Points[2] = new Point(100, 50);
1
  • 1
    разместите ваш код в теле вопроса, и вам быстрее ответят!
    – Monomax
    30 авг 2018 в 11:47

1 ответ 1

2

Можно, не вопрос. Только точки в Polygon'е анимировать сложно (хотя и можно), так что мы пойдём более простым путём, и будем анимировать Path.

Вот вам код, изучайте:

<Grid Background="Black">
    <Grid Width="100" Height="50">
        <Path Fill="AliceBlue" VerticalAlignment="Top">
            <Path.Data>
                <PathGeometry>
                    <PathGeometry.Figures>
                        <PathFigure StartPoint="0,0">
                            <LineSegment x:Name="S1" Point="0,50"/>
                            <LineSegment x:Name="S2" Point="100,50"/>
                            <LineSegment Point="100,0"/>
                        </PathFigure>
                    </PathGeometry.Figures>
                </PathGeometry>
            </Path.Data>
            <Path.Triggers>
                <EventTrigger RoutedEvent="Loaded">
                    <BeginStoryboard>
                        <Storyboard>
                            <PointAnimation
                                Storyboard.TargetName="S1" 
                                Storyboard.TargetProperty="Point"
                                From="10,10" Duration="0:0:2" 
                                AutoReverse="True" RepeatBehavior="Forever" />
                            <PointAnimation
                                Storyboard.TargetName="S2" 
                                Storyboard.TargetProperty="Point"
                                From="90,10" Duration="0:0:2" 
                                AutoReverse="True" RepeatBehavior="Forever" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Path.Triggers>
        </Path>
    </Grid>
</Grid>

Результат:

замечательно выходит!


Если вам почему-то хочется создавать анимации в code-behind (зачем?), можно воспользоваться таким кодом:

var a1 = new PointAnimation()
{
    From = new Point(10, 10),
    Duration = new Duration(TimeSpan.FromSeconds(2)),
    AutoReverse = true,
    RepeatBehavior = RepeatBehavior.Forever
};
Storyboard.SetTargetName(a1, "S1");
Storyboard.SetTargetProperty(a1, new PropertyPath("Point"));
var a2 = new PointAnimation()
{
    From = new Point(90, 10),
    Duration = new Duration(TimeSpan.FromSeconds(2)),
    AutoReverse = true,
    RepeatBehavior = RepeatBehavior.Forever
};
Storyboard.SetTargetName(a2, "S2");
Storyboard.SetTargetProperty(a2, new PropertyPath("Point"));
var sb = new Storyboard()
{
    Children = { a1, a2 }
};
sb.Begin(this);

Указание this в sb.Begin нужно для разрешения имён, оно используется как NameScope.

2
  • Спасибо! А как это транслировать в C# код? Интересует именно анимация, т.к. с созданием Patch проблем нет
    – Ивано
    31 авг 2018 в 8:29
  • @Ивано: Дополнил ответ.
    – VladD
    31 авг 2018 в 18:39

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.