Ist es möglich, ein PolyLineSegment in Silverlight zu animieren, d.h. die PointCollection?

Question

Ich beschneide ein Canvas mit einem rautenförmigen PolyLineSegment in einem PathGeometry . Ich versuche, die PointCollection davon aber zu animieren, und kann nicht scheinen, um die TargetProperty aufzulösen. Dies ist die einzige andere Referenz alle Google gefunden, die ziemlich genau das ist, was ich versuche zu tun und das gleiche PropertyPath : http://forums.silverlight.net/forums/p/22239/78225.aspx

Ist es überhaupt möglich, eine Point von einer PointCollection um seine Werte in einer Animation zu ändern?

Answer 1

Leider glaube ich nicht, dass es möglich ist, die Polyline.Points zu animieren...

Diese Punkte sind von "System.Windows.Point" und das Problem ist, dass ihre "X" und "Y" Eigenschaften keine Abhängigkeitseigenschaften sind. Leider gibt es keine Möglichkeit, eine Eigenschaft, die keine Abhängigkeitseigenschaft ist, mit einer DoubleAnimation zu animieren.

In dem von Ihnen angeführten Beispiel basiert die Animation auf einem PathFigure-Segment (das Abhängigkeitseigenschaften hat) und nicht auf einem System.Windows.Point.

Ich würde versuchen, die Verwendung des PolyLineSegement in Ihrem Pfad zu vermeiden, wenn Sie diese animieren möchten.

Answer 2

Sie könnten die Punktesammlung wie folgt animieren:

      <Canvas Background="Tan" Width="100" Height="300" Margin="5,0,0,0">
        <Path Stroke="RosyBrown" StrokeThickness="4" >
          <Path.Data>
            <PathGeometry>
              <PathGeometry.Figures>
                <PathFigure StartPoint="5,50">
                  <PolyLineSegment x:Name="PLS" ></PolyLineSegment>
                </PathFigure>
              </PathGeometry.Figures>
            </PathGeometry>
          </Path.Data>
        </Path>
        <Canvas.Triggers>
          <EventTrigger RoutedEvent="Canvas.Loaded" >
            <BeginStoryboard>
              <Storyboard x:Name="sbPathUpDown" BeginTime="0:0:0">
                <ObjectAnimationUsingKeyFrames x:Name="objAni"
                                  Duration="0:0:2"
                                 AutoReverse="True"  RepeatBehavior="Forever"
                                  Storyboard.TargetName="PLS"
                                  Storyboard.TargetProperty="Points"  >
                  <DiscreteObjectKeyFrame Value="10,50 90,50" KeyTime="0:0:0.05"></DiscreteObjectKeyFrame>
                  <DiscreteObjectKeyFrame Value="10,60 90,50" KeyTime="0:0:0.5"></DiscreteObjectKeyFrame>
                  <DiscreteObjectKeyFrame Value="10,70 105,50" KeyTime="0:0:0.9"></DiscreteObjectKeyFrame>
                  <DiscreteObjectKeyFrame Value="10,60 100,40" KeyTime="0:0:1.2"></DiscreteObjectKeyFrame>
                  <DiscreteObjectKeyFrame Value="10,50 100,50" KeyTime="0:0:1.5"></DiscreteObjectKeyFrame>
                  <DiscreteObjectKeyFrame Value="10,60 90,50" KeyTime="0:0:1.7" ></DiscreteObjectKeyFrame>
                </ObjectAnimationUsingKeyFrames>
              </Storyboard>
            </BeginStoryboard>
          </EventTrigger>
        </Canvas.Triggers>
      </Canvas>

(animiert einige Linienpunkte - sieht schlecht aus, verdeutlicht aber den Punkt :o)

Und wenn Sie die Punkte berechnen und glatter machen wollen, können Sie sie in Code einfügen:

  objAni.KeyFrames.Clear();
  double offsetx = 10.0; double offsety = 50;
  double w = 40; double h = 40;
  for (int i = 0; i < 20; i++)
  {
    var scale = i * 0.1;
    var ww = w * scale;
    var hh = h * scale;
    var pts = new PointCollection();
    pts.Add(new Point(offsetx, offsety));
    pts.Add(new Point(offsetx + ww, offsety));
    pts.Add(new Point(offsetx + ww, offsety + hh));
    pts.Add(new Point(offsetx, offsety + hh));
    pts.Add(new Point(offsetx, offsety));

    objAni.KeyFrames.Add(new DiscreteObjectKeyFrame { Value = pts, KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(i / 10.0)) });
  }

Zeichnet einen Kasten, der seine Größe ändert - Sie können beliebige Punkte hinzufügen und so den gewünschten Effekt mehr oder weniger erzielen.