2016-09-09 2 views
1

Ich bin ein Rang Amateur wenn es um WPF kommt und ich arbeite an den Aufbau einer Benutzeroberfläche mit meinem Jungen für seine Lego Mindstorms Roboter.Lenkrad transformieren mit WPF

Er hat mich gebeten, ein Lenkrad anstelle von Richtungstasten zu setzen, und während ich das tun kann, einschließlich der Rotationstransformation, weiß ich nicht, wie man diese Transformation bei einem Mauser/Drag-Ereignis relativ bewegen kann die Richtung des Ziehens.

Die XAML ich bisher habe, ist dies:

<Image x:Name="steering" HorizontalAlignment="Left" Height="146" Margin="253,67,0,0" 
      VerticalAlignment="Top" Width="146" Source="images/steering-wheel.png" RenderTransformOrigin="0.5,0.5"> 
     <Image.RenderTransform> 
      <RotateTransform CenterX="0.5" CenterY="0.5" /> 
     </Image.RenderTransform> 
     <Image.Triggers> 
      <EventTrigger RoutedEvent="Loaded"> 
       <BeginStoryboard> 
        <Storyboard RepeatBehavior="Forever"> 
         <DoubleAnimation Storyboard.TargetProperty="(Image.RenderTransform).(RotateTransform.Angle)" 
             From="0" To="360" Duration="0:0:2" /> 
        </Storyboard> 
       </BeginStoryboard> 
      </EventTrigger> 
     </Image.Triggers> 
    </Image> 

Was ich bin nach Erkennen, wenn der Benutzer das Lenkrad nach links oder rechts wird „Ziehen“ und die Umwandlung des entsprechenden Drehwinkels des Bildes. Wo soll ich anfangen?

Antwort

1

ich etwas ähnliches

Sie Punkte müssen zwei Referenz getan haben die Rotation der Mitte des Lenkrads und die Position der Maus zu berechnen dies geschehen ist als

private void Steering_MouseMove(object sender, MouseEventArgs e) 
{ 
    if (e.LeftButton == MouseButtonState.Pressed) 
    { 
     var control = sender as Ellipse; 
     var point = e.GetPosition(control); 
     var centre = new Point(control.Width/2, control.Height/2); 
     var vector = point - centre 
     Steering.Angle = (Math.Atan2(vector.X,vector.Y) * 180/Math.PI); 
     //note default behaviour of Atan2 is Angle 0 = East and Anti Clockwise is a positive angle, 
     //by swapping X and Y north is now 0 angle and clockwise is positive 
    } 
} 

Sie folgt dann nur müssen die Rotation

<Ellipse 
    MouseMove="Steering_MouseMove" > 
    <Ellipse.RenderTransform> 
     <RotateTransform Angle="{Binding Steering.Angle}" CenterX="0.5" CenterY="0.5"/> 
    </Ellipse.RenderTransform> 
</Ellipse> 
+0

I angewendet, um eine etwas andere Variation davon binden: 'RotateTransform drehen = new RotateTransform ((Math.atan2 (vector.X , vector.Y) * 180/Math.PI)); steering.RenderTransform = drehen; ' Ansonsten, danke - das war genug, um mich zu starten. –