Question

我对javafx布局有疑问，以下是我可以直接运行代码的代码：

import javafx.scene.Scene;
import javafx.scene.control.Button;

import javafx.scene.layout.VBox;
import javafx.scene.control.TextBox;
import javafx.scene.layout.HBox;
import javafx.scene.paint.Color;

import javafx.scene.Group;
import javafx.scene.shape.Rectangle;

import javafx.stage.Stage;

/**
 * @author Administrator
 */
var headerHeight: Number = 50;
var header: Group = Group {
            var searchBox: HBox;
            content: [
                Rectangle {
                    width: bind scene.width;
                    height: bind headerHeight;
                    fill: Color.BLUE
                },
                searchBox = HBox {
                            spacing: 10
                            layoutY: bind (headerHeight - searchBox.layoutBounds.height) / 2;
                            layoutX: bind scene.width - searchBox.layoutBounds.width - 20;
                            var textBox: TextBox;
                            content: [
                                textBox = TextBox {
                                            promptText: "please input search key"
                                            columns: 20
                                            selectOnFocus: true
                                        }, Button {
                                    text: "search"
                                    strong: true
                                    action: function() {
                                        println("Button  clicked");
                                    }
                                }]
                        }
            ]
        }
var rect = Rectangle {
            width: bind 400;
            height: bind 80;
            fill: Color.YELLOW
        }
var footerHeight: Number = 50;
var footer: Group = Group {
            var bounds: Rectangle;
            content: [
                bounds = Rectangle {
                            width: bind scene.width;
                            height: bind footerHeight;
                            fill: Color.RED
                        }
            ]
        }
var scene: Scene = Scene {
            content: [
                VBox {
                    content: [
                        header,
                        rect,
                        footer
                    ]
                }
            ]
        }

function run() {
    Stage {
        scene: scene
    }
}

场景的高度不正常。页脚高度为50，但似乎只有30左右。

什么是错的，有什么建议吗？

感谢。

Answer 1

由于某种原因，场景没有调整大小以适应全部内容。我不知道为什么，但你可以通过设置scene.height = headerHeight + 80 + footerHeight来解决这个问题。

Answer 2

尝试绑定Stage而不是Scene。

关于JavaFx布局

2 个答案: