我开始学习JavaFX效果,但是似乎找不到关于悬停按钮缩放的任何相关信息。
我猜它可以通过带有Scale过渡或CSS的JavaFX代码来完成。在CSS中,我找到了一种在鼠标悬停时增加按钮的方法,但是我不知道如何将其实现到JavaFX。
这是纯css代码中html的增长悬停效果:
.hvr-grow {
display: inline-block;
vertical-align: middle;
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
backface-visibility: hidden;
-moz-osx-font-smoothing: grayscale;
transition-duration: 0.3s;
transition-property: transform;
}
.hvr-grow:hover,
.hvr-grow:focus,
.hvr-grow:active {
transform: scale(1.1);
}
如何将CSS代码转换为fx-css代码?CSS代码与fx-css代码相同吗?(这意味着我只需要在前面放置“ -fx- [buttonID]”就可以了吗?)
我想知道是否有任何信息可以保护CSS动画和类似JavaFX css的信息。
您能帮我完成这个任务吗?
Node
有一个-fx-scale-x
,-fx-scale-y
和-fx-scale-z
CSS属性,它具有的默认值1。Node
是的超类,Button
因此这些属性是继承的。
要将其应用于应用程序中悬停时的任何按钮,请将此css selectpr添加到样式表中:
.button:hover {
-fx-scale-x: 1.1;
-fx-scale-y: 1.1;
-fx-scale-z: 1.1;
}
要查看不同控件具有哪些CSS样式,可以查看链接的指南,还可以检查JavaFX 8的默认样式表(modena.css)。
要了解如何使用CSS设置应用程序样式,可以查看本教程。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句