Question

我正在尝试使用PathTransition转换JavaFX控件。在执行中，控件移动不规律（我使它适用于矩形）。

附加的样本会尝试根据另外两个标签的位置将Label从一个位置移动到另一个位置。标签会立即跳转到低于其假定起点的点，然后转换到预定目标位置下方的另一个位置。

调试信息表示标签从（50,50）开始，偏移量为（0,0），目标是（200,50）的新位置。当动画完成时，我相信它应该位于（50,50）位置，偏移量为（150,0）;实际上，它的位置为（50,50），偏移量为（148,38.5）。

我做错了什么？

感谢您的帮助。

package fxsort;

import javafx.animation.PathTransition;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.paint.Color;
import javafx.scene.shape.ArcTo;
import javafx.scene.shape.MoveTo;
import javafx.scene.shape.Path;
import javafx.scene.text.Font;
import javafx.stage.Stage;
import javafx.util.Duration;

public class Test4
    extends Application
{
    private final Label   statLabel1        =
        getLabel( "Jehosaphat", 50, 50, Color.gray( .85 ) );
    private final Label   statLabel2        =
        getLabel( "Jehosaphat", 200, 50, Color.gray( .85 ) );
    private final Label   periLabel    =
        getLabel( "Jehosaphat", 50, 50, Color.RED );

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

@Override
public void start(Stage stage) throws Exception
{
    Button  start               = new Button( "Start" );

    start.relocate( 250, 125 );
    start.setOnAction(
        new EventHandler<ActionEvent>()
        {
            @Override
            public void handle( ActionEvent evt )
            {
                PathTransition  transition  = getTransition();
                transition.play();
            }
        }
    );

    Group   root    =
        new Group( statLabel1, statLabel2, periLabel, start );
    stage.setScene( new Scene( root, 350, 200 ) ) ;
    stage.show();
}

private Label
getLabel( String text, double xco, double yco, Color color )
{
    Label   label   = new Label( text );
    label.relocate( xco, yco );
    label.setTextFill( color );
    label.setFont( Font.font( "Arial", 20 ) );

    return label;
}
private PathTransition
getTransition()
{
    Label       from        = statLabel1;
    Label       too         = statLabel2;
    Duration    duration    = Duration.millis( 3000 );
    double      startX      = from.getLayoutX();// + 30;
    double      startY      = from.getLayoutY();// + 30;
    System.out.println( "From Layout: " + startX + ", " + startY );
    System.out.println( "From Offset: " + from.getTranslateX()
                         + ", " + from.getTranslateX() );

    double      endX        = too.getLayoutX();// + 30;
    double      endY        = too.getLayoutY();// + 30;
    System.out.println( "To Layout: " + endX + ", " + endY );
    System.out.println( "To Offset: " + too.getTranslateX()
                         + ", " + too.getTranslateX() );

    MoveTo      start       = new MoveTo( startX, startY );
    System.out.println( "MoveTo: " + start.getX() + ", " + start.getY() );

    ArcTo       end     = new ArcTo();
    end.setX( endX );
    end.setY( endY );
    end.setRadiusX( 100 );
    end.setRadiusY( 100 );
    System.out.println( "ArcTo: " + end.getX() + ", " + end.getY() );

    System.out.println( "**********" );

    Path    path    = new Path();
    path.getElements().addAll( start, end );

    PathTransition  transition  = new PathTransition();
    transition.setDuration( duration );
    transition.setPath( path );
    transition.setNode( periLabel );

    transition.setOnFinished(
        new EventHandler<ActionEvent>()
        {
            public void handle( ActionEvent evt )
            {
                System.out.println( "Landed: " + periLabel.getLayoutX()
                                    + ", " + periLabel.getLayoutY() );
                System.out.println( "Offset: " + periLabel.getTranslateX()
                                    + ", " + periLabel.getTranslateY() );
            }
        }
    );

    return transition;
}
}

Answer 1

您的代码有两个问题：

PathTransition在其自己的坐标系中移动Node。因此，如果您的节点的布局X / Y设置为50,50 periLabel，则它将被移位。
PathTransition按节点的中心移动Node，而不是左上角。

下一个代码将解决您的问题：

private PathTransition getTransition() {
    Label from = statLabel1;
    Label too = statLabel2;
    Duration duration = Duration.millis(3000);

    // fix problem (1)
    periLabel.relocate(0, 0);
    // fix problem (2)
    double startX = from.getLayoutX() + from.getBoundsInLocal().getWidth() / 2;
    double startY = from.getLayoutY() + from.getBoundsInLocal().getHeight() / 2;

    double endX = too.getLayoutX() + too.getBoundsInLocal().getWidth() / 2;
    double endY = too.getLayoutY() + too.getBoundsInLocal().getHeight() / 2;

转换控件时JavaFX动画错误

1 个答案: