Question

我有一张WPF图片。我将在其中渲染方向盘。我想模拟方向盘的旋转。用户应触摸方向盘中的任何位置。它应顺时针和逆时针旋转。范围为0至400度和0至-400度。它与普通汽车完全相同。

任何想法开始？请举一个合乎逻辑的例子，我是开发人员，但不是数学家，所以我不知道如何计算旋转角度。

我的目标设备是基于触摸的Windows平板电脑。

-Rajeevan

Answer 1

WPF中的动画很简单......我们不需要任何人成为数学家。您可以使用RotateTransform Class和UIElement.RenderTransform Property非常轻松地轮播任何UIElement：

<Ellipse StrokeThickness="5" Stroke="Black" Width="100" Height="50">
    <Ellipse.RenderTransform>
        <RotateTransform />
    </Ellipse.RenderTransform>
</Ellipse>

现在为RotateTransform制作动画，我们可以使用Storyboard Class（必须进入BeginStoryboard元素：

<BeginStoryboard>
    <Storyboard RepeatBehavior="Forever">
        <DoubleAnimation Storyboard.TargetProperty="(Ellipse.RenderTransform).
(RotateTransform.Angle)" From="0" To="360" Duration="0:0:2" />
    </Storyboard>
</BeginStoryboard>

最后，我们可以在加载控件时触发此动画：

<Ellipse StrokeThickness="5" Stroke="Black" Width="100" Height="50" 
    RenderTransformOrigin="0.5,0.5">
    <Ellipse.Triggers>
        <EventTrigger RoutedEvent="Loaded">
            <BeginStoryboard>
                <Storyboard RepeatBehavior="Forever">
                    <DoubleAnimation Storyboard.TargetProperty="
                        (Ellipse.RenderTransform).(RotateTransform.Angle)" 
                        From="0" To="360" Duration="0:0:2" />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Ellipse.Triggers>
    <Ellipse.RenderTransform>
        <RotateTransform />
    </Ellipse.RenderTransform>
</Ellipse>

通过这些示例，我相信您将按照链接了解如何完成您的要求，而不是要求我所有您的工作。

Answer 2

你需要这个：

http://msdn.microsoft.com/en-us/library/system.windows.media.rotatetransform(v=vs.110).aspx

和此：

http://msdn.microsoft.com/en-us/library/system.windows.media.animation.storyboard(v=vs.110).aspx

旋转方向盘 - WPF

2 个答案: