Note how the smaller symbols do not line up vertically. The larger (simple) decoration of the cards is also misplaced depending on the width of the symbol.
Solved the problem with the smaller symbols by placing them in a wrapper made up of a VBox layout. This made it possible to have the symbols vertically aligned by centering them.
public-read def vbox: javafx.scene.layout.VBox = javafx.scene.layout.VBox {
layoutX: 3
layoutY: 0
content: [rank, suite,]
spacing: -10
nodeVPos: javafx.geometry.VPos.TOP
nodeHPos: javafx.geometry.HPos.CENTER
}
Used a Tile layout as a wrapper for the larger decoration. By making the tile a bit wider than the width of the largest character we get a parent that can be used to center the decoration in the right place.
def __layoutInfo_tile: javafx.scene.layout.LayoutInfo = javafx.scene.layout.LayoutInfo {
width: 32.0
}
public-read def decorationTile: javafx.scene.layout.Tile = javafx.scene.layout.Tile {
layoutX: 24
layoutY: 26
layoutInfo: __layoutInfo_tile
content: [decoration]
columns: 1
rows: 1
hgap: 0
vgap: 0
hpos: javafx.geometry.HPos.CENTER
}
There are probably more refined ways to solve the alignment problems but this seems to work and I well settle with the current solution for now.
The complete set of cards looks like this now (click for full size version).
No comments:
Post a Comment