使用 JavaFX 在 HBox 的组中旋转图像或形状

Question

我想旋转组中的图像并将组放在 HBox 中而没有明显的“弹跳”效果。上图是使用 JavaFX 形状而不是图像的示例，但最终结果是相同的。顶部的 HBox 包含一个旋转的矩形，看起来很好。底部的 HBox 在同一组中包含一个矩形和一个圆，但旋转矩形会导致“弹跳”副作用。为什么会弹跳？这是我的代码：

public class RotateImage extends Application {

    @Override
    public void start( Stage primaryStage ) {
        Pane root = new Pane();
        HBox hbox = new HBox();
        hbox.setLayoutX( 10 );
        hbox.setLayoutY( 10 );
        Rectangle square = new Rectangle( 50, 50, Color.RED );
        hbox.getChildren().add( square );
        RotateTransition rt = new RotateTransition( Duration.millis( 1000 ), square );
        rt.setByAngle( 360 );
        rt.setCycleCount( Animation.INDEFINITE );
        rt.setInterpolator( Interpolator.LINEAR );
        rt.play();

        HBox hbox2 = new HBox();
        hbox2.setLayoutX( 10 );
        hbox2.setLayoutY( 100 );
        Rectangle square2 = new Rectangle( 50, 50, Color.RED );
        Circle circle2 = new Circle( 25, 25, 12.5, Color.BLUE );
        Group group = new Group( square2, circle2 );
        hbox2.getChildren().add( group );
        RotateTransition rt2 = new RotateTransition( Duration.millis( 1000 ), square2 );
        rt2.setByAngle( 360 );
        rt2.setCycleCount( Animation.INDEFINITE );
        rt2.setInterpolator( Interpolator.LINEAR );
        rt2.play();

        root.getChildren().addAll( hbox, hbox2 );
        Scene scene = new Scene( root, 100, 200, Color.BLACK );
        primaryStage.setScene( scene );
        primaryStage.setTitle( "Rotate Transition example" );
        primaryStage.show();
    }

    public static void main( String[] args ) {
        launch( args );
    }
}

Answer 1

如果您想要平滑旋转，请将旋转应用到组，而不是其 children 之一。
替换
RotateTransition rt2 = new RotateTransition( Duration.millis( 1000 ), square2 );

和
RotateTransition rt2 = new RotateTransition( Duration.millis( 1000 ), group );

如果您必须在组内旋转 child，您可以在组中添加一个大的“占位符”形状。形状（下例中的圆形）的作用是使组足够大，以便方形旋转不会改变组边界：

import javafx.animation.*;
import javafx.application.Application;
import javafx.scene.*;
import javafx.scene.layout.HBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.*;
import javafx.stage.Stage;
import javafx.util.Duration;

public class RotateImage extends Application {

    @Override
    public void start( Stage primaryStage ) {

        //big circle to keep group bounds big enough for the square to rotate inside
        Circle dummyCircle = new Circle(25,25,100, Color.BLACK );
        Rectangle square2 = new Rectangle( 50, 50, Color.RED );
        Circle circle2 = new Circle( 25, 25, 12.5, Color.BLUE );
        Group group = new Group(dummyCircle,square2, circle2 );

        RotateTransition rt2 = new RotateTransition( Duration.millis( 1000 ), square2 );
        rt2.setByAngle( 360 );
        rt2.setCycleCount( Animation.INDEFINITE );
        rt2.setInterpolator( Interpolator.LINEAR );
        rt2.play();

        Scene scene = new Scene(new HBox(group), 200, 200, Color.BLACK );
        primaryStage.setScene( scene );
        primaryStage.show();
    }

    public static void main( String[] args ) {
        launch( args );
    }
}

使用 JavaFX 在 HBox 的组中旋转图像或形状

Rotating an image or shape in a Group in a HBox with JavaFX

javafx