JavaFx 实现水平滚动文本(跑马灯效果)

原文地址: JavaFx 实现水平滚动文本(跑马灯效果) - Stars-One的杂货小窝

本文是以TornadoFx框架进行编写,各位使用JavaFx可以参考

代码已经封装在common-controls库中

效果

代码

实现原理就是利用了JavaFx里的动画效果去修改scrollpane的translateX属性,原本想在text上改造的,发现文字过多就不行了,最终还是使用了scrollpane组件来完成功能

就是需要注意的是,设置的文本需要处理一下换行符,不然显示效果会很不好看

还有就是,记得文本前面加上几个空格,不然滚动感觉看不了前面的几个字

val simpleNotice=SimpleStringProperty("") scrollpane {     alignment = Pos.CENTER_LEFT     prefWidth = 560.0      style {         focusColor = Color.TRANSPARENT         borderWidth += box(0.px)         borderColor += box(Color.TRANSPARENT)         hBarPolicy = ScrollPane.ScrollBarPolicy.NEVER         vBarPolicy = ScrollPane.ScrollBarPolicy.NEVER         padding = box(0.px)     }      hbox {         translateY = 5.0         alignment = Pos.CENTER_LEFT          label(simpleNotice) {             val defaultValue = translateXProperty().value             //滚动的逻辑             val rollAction: ((String) -> Unit) = {                 val newValue = it                 //阅读速度,8个字1s                 val time = newValue.length / 8                 translateXProperty().animate(-(newValue.length * 10), Duration.seconds(time.toDouble()), Interpolator.LINEAR) {                     cycleCount = -1                     setOnFinished {                         translateXProperty().set(defaultValue)                     }                 }             }              simpleNotice.onChange {                 rollAction.invoke(it?:"")             }             rollAction.invoke(simpleNotice.value)              setOnMouseClicked {                 //点击事件              }         }     } } simpleNotice.set("      这是一个测试公告信息...")