Javafx GridPane ColumnConstraints在需要重叠的地方导致剪切

时间:2018-08-03 05:24:44

标签: image javafx transparency gridpane

我正在用数字键盘登录屏幕。我为按钮背景创建了自己的按钮图像。此按钮图像中有阴影,实际上只是半透明的黑暗模糊。我已经将这些按钮安排在GridPane中,在其中使用ColumnConstraints将它们打包在比阴影默认超出的多余空间更紧密的位置。我也以相同的方式使用了RowConstraints。这些行似乎可以按原样排列在一起,但是对于列,我注意到每个按钮右侧的阴影都被剪掉,为它们提供了一条清晰的边缘。

buttonSize是一个变量,它是屏幕最短尺寸之间的距离的1/6。我这样做是为了使按钮可以缩放以适合不同的屏幕尺寸。

ColumnConstraints col0 = new ColumnConstraints(buttonSize * .95);
ColumnConstraints col1 = new ColumnConstraints(buttonSize * .95);
ColumnConstraints col2 = new ColumnConstraints(buttonSize * .95);
numberPad.getColumnConstraints().addAll(col0, col1, col2);

RowConstraints row0 = new RowConstraints(buttonSize * .95);
RowConstraints row1 = new RowConstraints(buttonSize * .95);
RowConstraints row2 = new RowConstraints(buttonSize * .95);
numberPad.getRowConstraints().addAll(row0, row1, row2);

enter image description here

从堆栈溢出的色彩鲜艳的页面上可能很难看到,但是金线上方的数字键盘使用ColumnConstraints,而金线下方的数字键盘则没有。您可以看到按键右侧的阴影被剪切在顶部数字键盘上时存在于底部数字键盘中。 如何在不修剪按钮阴影的情况下将它们拉近一点?

如果我的代码中可能还有其他部分值得关注,我可以添加任何内容。为了简洁起见,我只是简而言之。

编辑01:

此功能是我将按钮传递到其中以与图像一起显示的功能。

private void drawButtonImage(Button button){
        FileInputStream button01FileInputStream = null;
        try{
            button01FileInputStream = new FileInputStream("F:\\Programming\\Professional\\Merchant\\Images\\Button01.png");

            Image buttonImage = new Image(button01FileInputStream);
            BackgroundImage backgroundImage = new BackgroundImage(
                    buttonImage,
                    BackgroundRepeat.REPEAT,
                    BackgroundRepeat.NO_REPEAT,
                    BackgroundPosition.DEFAULT,
                    new BackgroundSize(buttonSize, buttonSize, false, false, false, false)
            );

            Background background = new Background(backgroundImage);
            button.setBackground(background);

        } catch (FileNotFoundException | NullPointerException e){
            e.printStackTrace();
        } finally {
            if (button01FileInputStream != null){
                try{
                    button01FileInputStream.close();
                } catch (IOException e){
                    e.printStackTrace();
                }
            }
        }
        button.setTextFill(Color.WHITE);
    }

1 个答案:

答案 0 :(得分:0)

受Zephyr的建议启发,我删除了ColumnConstraints并将hgap设置为buttonSize * -0.05。现在,按钮图像可以按我的意愿挤在一起,而不会发生剪裁。