Hi,
I am experiencing some difficulties with border css. Not sure if those
are bugs or "I am holding it wrong". The main problem is that I don't
get a border to grow inside while keeping the bounds-in-parent
unchanged. Maybe fx-border-insets is part of the solution but then I am
not sure how this works (and the documentation does not say).
http://s13.postimg.org/ujcl7lxt3/borders_and_bounds.png
On this screenshot we have 5 StackPanes with prefSize 800x120 and
different border css. The bottom three are highlighted by ScenicView to
visualize their bounds.
Observations:
1. fx-border-width changes bounds-in-parent. This may be normal if no
other styles are set. But why is there some "empty margin" outside of
the visible border? This can be seen very clearly in no.3: there is some
space between the outside of the border and the outside of the yellow
marked area.
This is a problem because I am using bounds-in-parent to add some
decoration to the node which obviously includes the empty space because
of this.
2. An attempt to use -fx-border-insets can be seen in no.4. There is
still some "margin" - and I already used insets 10 for a border-width 20
(with insets 20 the effect is even worse). How are those insets supposed
to work?
3. An attempt to use an inside border does not really help either, see no.5.
Rgds
Werner
public class FxBorderIssues extends Application
{
public static void main(String[] args) { Application.launch(args); }
public void start(Stage stage)
{
stage.setScene(SceneBuilder.create()
.width(1024)
.height(800)
.root(VBoxBuilder.create()
.spacing(30)
.fillWidth(false)
.alignment(Pos.CENTER)
.children(
createStackPane("-fx-border-width: 1; -fx-border-style: solid;
-fx-border-color: #808080;"),
createStackPane("-fx-border-width: 10; -fx-border-style: solid;
-fx-border-color: #808080;"),
createStackPane("-fx-border-width: 40; -fx-border-style: solid;
-fx-border-color: #808080;"),
createStackPane("-fx-border-width: 20; -fx-border-style: solid;
-fx-border-insets: 10; -fx-border-color: #808080;"),
createStackPane("-fx-border-width: 20; -fx-border-style: solid
inside; -fx-border-color: #808080;"))
.build())
.build());
stage.show();
}
private StackPane createStackPane(String style)
{
LabelBuilder builder = LabelBuilder.create().style("-fx-font-size: 16;");
Label labelStyle = builder.build();
StackPane.setAlignment(labelStyle, Pos.TOP_LEFT);
Label labelBounds = builder.build();
StackPane.setAlignment(labelBounds, Pos.BOTTOM_RIGHT);
final StackPane stackPane = StackPaneBuilder.create()
.style(style)
.prefWidth(800)
.prefHeight(120)
.children(labelStyle, labelBounds)
.build();
labelStyle.textProperty().bind(stackPane.styleProperty());
labelBounds.textProperty().bind(Bindings.createStringBinding(new
Callable<String>() {
public String call() throws Exception
{
Bounds inLayout = stackPane.getLayoutBounds();
Bounds inParent = stackPane.getBoundsInParent();
return String.format(
"layout = (%.1f x %.1f), inParent = (%.1f x %.1f)",
inLayout.getWidth(), inLayout.getHeight(), inParent.getWidth(),
inParent.getHeight());
}
}, stackPane.boundsInParentProperty(), stackPane.layoutBoundsProperty()));
return stackPane;
}
}
