0

我随机生成两个矩形，第一个矩形保持在原位，但我想移动/动画第二个矩形，使其右下角等于第一个矩形左上角占据的位置，atm 我已经基本上得到的是；

if(count != 300)
{
    rect2.X = count + (rect1.X - 100);
    rect2.Y = count + (rect1.Y - 100);
    count +=2
}

这是在计时器事件中，但显然不是我想要的，我已经尝试了上述的多种变体，但似乎没有一个可以完成这项工作。

我敢肯定会有一个烦人的简单答案。

提前致谢。

4

2 回答 2

2

假设屏幕的左上角是{0,0}，右下角是{screenWidth, screenHeight} 我在这里也假设浮点坐标（即 Rect.X 是 adouble或float）。如果不是，您需要在下面的第 2 步中做一些工作，以确保在每个步骤中移动均匀数量的像素。

这是基本算法，伪代码：

  1. 计算动画矩形左上角的最终位置：finalPos = {r1.x + r1.width, r1.y+r1.width}
  2. 决定你想要多少步，并计算矩形每一步应该移动多远。让我们以 100 步为例。dx = r2.x - finalPos.x / 100,dy = r2.y - finalPos.y / 100
  3. 在每个计时器事件中，您只需将dx和添加dy到动画矩形的位置：

像这样：

if (currentStep < 300)
{
    r2.x += dx;
    r2.y += dy;
    currentStep++;
}
else
{
    // We're done
    timer.Stop();
}

当然，如果您使用图形框架来绘制东西，您可能已经可以访问可以为您完成上述工作的动画框架。

于 2012-05-31T15:13:59.443 回答
0

如果您能够使用 WPF，这非常简单：

在窗口 xaml 中：

<Window x:Class="WpfApplication6.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="600" Width="600">
    <Window.Triggers>
        <EventTrigger RoutedEvent="Window.Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation
                      Storyboard.TargetName="AnimatedRect"
                      Storyboard.TargetProperty="(Canvas.Left)"
                      To="{Binding ElementName=FixedRect, Path=(Canvas.Left)}" Duration="0:0:1"/>
                    <DoubleAnimation
                      Storyboard.TargetName="AnimatedRect"
                      Storyboard.TargetProperty="(Canvas.Top)"
                      To="{Binding ElementName=FixedRect, Path=(Canvas.Top)}" Duration="0:0:1"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Window.Triggers>

    <Canvas>
        <Rectangle Name="FixedRect"
                   StrokeThickness="2"
                   Stroke="Black"
                   Width="{Binding R1.Width}"
                   Height="{Binding R1.Height}"
                   Canvas.Left="{Binding R1.X}"
                   Canvas.Top="{Binding R1.Y}"/>
        <Rectangle Name="AnimatedRect"
                   StrokeThickness="2"
                   Stroke="Black"
                   Width="{Binding R2.Width}"
                   Height="{Binding R2.Height}"
                   Canvas.Left="{Binding R2.X}"
                   Canvas.Top="{Binding R2.Y}"/>
    </Canvas>
</Window>

代码隐藏：

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();

        Random rnd = new Random();

        Rect r1 = new Rect();
        r1.X = rnd.Next(500);
        r1.Y = rnd.Next(500);
        r1.Width = rnd.Next(50,100);
        r1.Height = rnd.Next(50, 100);
        R1 = r1;

        Rect r2 = new Rect();
        r2.X = rnd.Next(500);
        r2.Y = rnd.Next(500);
        r2.Width = rnd.Next(50, 100);
        r2.Height = rnd.Next(50, 100);
        R2 = r2;


        DataContext = this;
    }

    public Rect R1 { get; set; }
    public Rect R2 { get; set; }

}
于 2012-05-31T15:33:11.807 回答