样式ControlsFX面包屑

Question

我正在使用来自ControlsFX的BreadcrumbBar，它工作正常。我唯一的问题是造型看起来像下面的图像。使用风景视图时，我看到此组件只有三个类.button，.first，/* * ControlFX bread crumb * */ .bread-crumb-bar { } .bread-crumb-bar .button { -fx-padding: 0 3 0 3; -fx-border-color: null; -fx-border-insets: 0; -fx-border-image-source: url("../images/icon/crumb-focused.png"); -fx-border-image-slice: 1 10 1 10 fill; -fx-border-image-width: 1 10 1 10; -fx-border-image-repeat: stretch; } .bread-crumb-bar .button.first { } 。我尝试添加像这样的边框图像，但没有出现。

cd "C:\tomcat\webapps\ROOT\WEB-INF\classes"
java -classpath "C:\tomcat\webapps\ROOT\WEB-INF\lib\*";. com/mainapp/batchbjobs/job1

如何将controlsfx breadcrumb设置为在图像中看起来像痕迹？

Answer 1

我的解决方法非常相似。对于斜线，您需要图像。 你需要摆弄填充并适当地设置你的字体系列。没有为最后/选定的面包屑找到选择器。

bread-crumb-bar {
     -fx-background-color: transparent;
}
.bread-crumb-bar .button {
    -fx-padding: 8 12 8 20;
    -fx-border-color: null;
    -fx-border-insets: 0;
    -fx-content-display: left;
    -fx-background-position: left center;
    -fx-background-repeat: no-repeat;
    -fx-background-image: url("../img/slash.png");
    -fx-background-color: transparent;
    -fx-border-color: transparent;
    -fx-shape: null;
}
.bread-crumb-bar .first {
    -fx-background-color: transparent ;
    -fx-border-color: transparent;
    -fx-font-size: 1.11em;
    -fx-text-fill: #000;
    -fx-background-image: null;
    -fx-shape: null;
    -fx-padding: 8 12 8 0;
}
.crumb {
    -fx-text-fill: #000;
}
.crumb:hover,
.crumb:selected, 
.crumb:focused
{
    -fx-background-color: rgba(0,0,0,0.1);
    -fx-border-color: null;
    -fx-font-size: 1.11em;
    -fx-text-fill: rgba(0,0,0,0.5);
}