BorderPane中的JavaFX-8 Canvas

时间:2014-01-07 09:42:19

标签: javafx-8

我对这整个JavaFX事情都很陌生,你可能会说。这是我最近在玩Canvas节点时遇到的一个问题。我有一个BorderPane作为我的根节点,我想让Canvas占据其中心的所有可用空间。但是,我在实现这种确切行为时遇到了一些麻烦。以下是我一直在尝试的内容:

public void start(Stage stage){
    BorderPane root=new BorderPane();
    Canvas canvas=new Canvas(250,250);
    //canvas.widthProperty().bind(root.widthProperty());
    //canvas.heightProperty().bind(root.heightProperty());
    GraphicsContext gc=canvas.getGraphicsContext2D();
    new AnimationTimer(){
        @Override
        public void handle(long l){
            double width=canvas.getWidth(),height=canvas.getHeight();
            gc.clearRect(0,0,width,height);
            gc.strokeRect(0,0,width,height);
            gc.strokeLine(0,0,width,height);
            gc.strokeLine(0,height,width,0);
        }
    }.start();
    root.setCenter(canvas);
    root.setBottom(new Button("Placeholder"));
    root.setTop(new Button("Placeholder"));
    stage.setScene(new Scene(root));
    stage.show();
}

而不是像Pane那样扩展,我的Canvas只是保持在其中心,保留其原始大小。如果重新添加顶部附近的两条注释行,则Canvas会像Pane那样增长和缩小,但不考虑其中心的尺寸(如预期的那样)。有没有办法将这种绑定行为应用到BorderPane的中心,或者可能是另一种完全不知道的方式呢?

1 个答案:

答案 0 :(得分:1)

编辑:今天刚刚找到一个 更好的 解决方案(19.05.2014):

http://fxexperience.com/2014/05/resizable-grid-using-canvas/

比我的更容易和更短 - .-


现在我原来的方法

我遇到了和你一样的问题。

我发现你可以使用非常难看的解决方法,但也许还有另一种方法可以做到这一点......

我的解决方法:

class MyCanvas {

    private Canvas cv;
    private StackPane box;

    public MyCanvas(Stage stg) {
        cv = new Canvas(500, 500);
        box = new StackPane();

        box.getChildren().add(cv);

        //When the Stage size changes, the canvas size becomes resetted
        //but the Hbox expandes automatically to fit the with again
        //and so the canvas become resized to fit the HBox
        stg.widthProperty().addListener(new ChangeListener<Number>() {
            @Override
            public void changed(ObservableValue<? extends Number> arg0, Number arg1, Number arg2) {
             resize();
            }
        });

        stg.heightProperty().addListener(new ChangeListener<Number>() {
            @Override
            public void changed(ObservableValue<? extends Number> arg0, Number arg1, Number arg2) {
            resize();
            }
        }); 

        box.widthProperty().addListener(new ChangeListener<Number>() {
            @Override
            public void changed(ObservableValue<? extends Number> arg0, Number arg1, Number arg2) {
            adapt();
            }
        });

        box.heightProperty().addListener(new ChangeListener<Number>() {
            @Override
            public void changed(ObservableValue<? extends Number> arg0, Number arg1, Number arg2) {
            adapt();
            }
        });

        paint();
    }

    private void paint(){
        //Paint something ....
        GraphicsContext ctx = cv.getGraphicsContext2D();

        double w = cv.getWidth();
        double h = cv.getHeight();

        ctx.clearRect(0, 0, w, h);

        ctx.setFill(Color.BLUE);
        ctx.fillRect(0, 0, w, h);
    }

    //Add this HBox to your content pane
    public StackPane getBox() {
        return box;
    }

    public void resize(){
        cv.setWidth(50);
        cv.setHeight(50);
    }

    private void adapt(){
        cv.setHeight(box.getHeight());
        cv.setWidth(box.getWidth());
        paint();
    }
}

在你的主要地方:

public class Root extends Application{
    public static void main(String[] args){ launch(args); }

    public void start(Stage stg){
        MyCanvas cv = new MyCanvas(stg);
        BorderPane pane = new BorderPane();
        pane.setCenter(pane.getBox());
        stg.setScene(new Scene(pane));
        stg.show();
    }
}

希望这可以帮助您解决问题。

nZeloT