标签边框未对齐，不齐平 [英] Label borders not lining up, not flush

问题描述

这是我当前在JavaFX中的输出.

Here is my current output in JavaFX.

我希望所有标签和边框齐平.

I would like all of the labels and the borders to be flush.

我将所有Inset设置为相同，那么为什么所有内容都不对齐?

I have all of the Insets set the same, so why is everything not aligning?

另一个问题是边框的双重重叠在边框上创建了较暗的图像，我不确定在设置标签样式时如何解决该问题.该图片下方是相关代码.谢谢你.

Another issue is the double overlap of borders creating a darker image on the border, I am not sure how to fix that when setting the style for my labels. Below this picture is the relevant code. Thank you.

    public void buildUI() {
        HBox hbox = new HBox();                     // create Hbox
        hbox.setPadding(new Insets(20,20,40,215) ); // centers month name over Grid
        Label month = new Label ("October");        // create october label
        //hbox.setVgap(50.0);
        this.setTop(hbox);                          // set hbox to top of borderPane
        hbox.getChildren().addAll(month);           // add month to hbox

        this.setCenter(grid);                       // add gridPane to center of BorderPane

        grid.setPadding(new Insets(20,20,20,20) );  // add insets to gridPane for aesthetic


          // below makes S-M-T-W-T-F and green fill
        for (int i = 0; i <= weekDays.length - 1; i++) {
            Label daysOfWeek = new Label(weekDays[i]);
            grid.add(daysOfWeek, i + 1, 1);

            daysOfWeek.setPadding(new Insets(25,30,25,30) );
            daysOfWeek.setStyle("-fx-text-fill: white;" +
                         "-fx-background-color: green;" + "-fx-border-color:     black;");



        }// end for loop to cycle through days of week 


        //below are the days of the month 
        for (int i = 1; i <= FRAMES; i++) {
            int yPos = ((i - 1) / 7) + 2;
            int xPos = i - (7 * (yPos -2) );

            if (i < 32) {
                Label monthDays = new Label(String.valueOf(i) );
                grid.add(monthDays, xPos, yPos);

                monthDays.setPadding(new Insets(25,30,25,30) );
                monthDays.setStyle("-fx-border-color: black;");




            } else if (i > 32) {
               // below creating november labels days 1 -- 4
                Label nov1 = new Label("1");
                grid.add(nov1, 4, 6);
                Label nov2 = new Label("2");
                grid.add(nov2, 5, 6);
                Label nov3 = new Label("3");
                grid.add(nov3, 6, 6);
                Label nov4 = new Label("4");
                grid.add(nov4, 7, 6);


                // below padding and making borders for labels
                nov1.setPadding(new Insets(25,30,25,30) );
                nov1.setStyle("-fx-text-fill: white;" + "-fx-border-color: black;" + "-fx-background-color: grey;");
                nov2.setPadding(new Insets(25,30,25,30) );
                nov2.setStyle("-fx-text-fill: white;" + "-fx-border-color: black;" + "-fx-background-color: grey;");
                nov3.setPadding(new Insets(25,30,25,30) );
                nov3.setStyle("-fx-text-fill: white;" + "-fx-border-color: black;" + "-fx-background-color: grey;");
                nov4.setPadding(new Insets(25,30,25,30) );
                nov4.setStyle("-fx-text-fill: white;" + "-fx-border-color: black;" + "-fx-background-color: grey;");



            }


        }// end for loop to cycle through days of month 

    }

推荐答案

Label的最大大小与文本和填充所需的大小相匹配. GridPane不会将Label的大小调整为更大的大小，这是1位数字填充列所必需的.

Labels have a max size that matches the size required for the text and padding. The GridPane does not resize the Labels to a greater size which would be required for the 1-digit numbers to fill the column.

只需将最大大小设置为无穷大即可解决此问题.

Simply setting the max size to infinity fixes this problem.

要不绘制双边框，可以将顶部和右侧的边框大小设置为1，将底部和左侧的边框大小设置为0，将GridPane周围的边框的底部和左侧宽度为1，顶部和右侧宽度为0，将网格包裹在StackPane中进行填充:

For not drawing double borders you could set the border size the top and right to 1 and bottom and left to 0, surround the GridPane with a border with bottom and left widths of 1 and top and right widths of 0 and wrap the grid in a StackPane for the padding:

private static final Insets LABEL_PADDING = new Insets(25, 30, 25, 30);

private static Label createLabel(String text) {
    Label label = new Label(text);
    label.setMaxSize(Double.POSITIVE_INFINITY, Double.POSITIVE_INFINITY);
    label.setPadding(LABEL_PADDING);
    return label;
}

// below makes S-M-T-W-T-F and green fill
for (int i = 0; i <= weekDays.length - 1; i++) {
    Label daysOfWeek = createLabel(weekDays[i]);
    grid.add(daysOfWeek, i, 0);
    daysOfWeek.setStyle("-fx-text-fill: white;"
            + "-fx-background-color: green;" + "-fx-border-color: black;" + "-fx-border-width: 1 1 0 0;");

}// end for loop to cycle through days of week

final String otherMonthStyle = "-fx-text-fill: white;-fx-border-color: black;-fx-background-color: grey;-fx-border-width: 1 1 0 0;";

//below are the days of the month 
for (int i = 1; i <= FRAMES; i++) {
    int yPos = ((i - 1) / 7) + 1;
    int xPos = (i - 1) % 7;

    if (i < 32) {
        Label monthDays = createLabel(String.valueOf(i));
        grid.add(monthDays, xPos, yPos);

        monthDays.setStyle("-fx-border-color: black;-fx-border-width: 1 1 0 0;");

    } else if (i > 32) {
        // below creating november labels days 1 -- 4
        Label nov1 = createLabel("1");
        grid.add(nov1, 3, 5);
        Label nov2 = createLabel("2");
        grid.add(nov2, 4, 5);
        Label nov3 = createLabel("3");
        grid.add(nov3, 5, 5);
        Label nov4 = createLabel("4");
        grid.add(nov4, 6, 5);

        // below padding and making borders for labels
        nov1.setStyle(otherMonthStyle);
        nov2.setStyle(otherMonthStyle);
        nov3.setStyle(otherMonthStyle);
        nov4.setStyle(otherMonthStyle);
    }

}// end for loop to cycle through days of month 

grid.setStyle("-fx-border-color: black;" + "-fx-border-width: 0 0 1 1;");

StackPane gridWrapper = new StackPane(grid);
gridWrapper.setPadding(new Insets(20));

这篇关于标签边框未对齐，不齐平的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！