JavaFx?Tooltip懸浮提示使用及自定義代碼詳解
本篇是基于TornadoFx框架對Tooltip組件進行講解,使用Kotlin語言,和傳統(tǒng)Java使用有所區(qū)別,僅供參考
介紹
鼠標懸浮在某個控件,彈出提示,效果如下:

使用
Tooltip一般是和某個節(jié)點控件綁定使用,這里的節(jié)點控件只能是control中的包javafx.scene.control,具體可以點擊地址跳轉(zhuǎn)查看
除此之外,還提供了另外一個方法,可以讓tooltip在當前窗口的指定位置顯示,比較麻煩的就是需要自己去計算偏移量
Tooltip.install(control,tooltip)綁定使用tooltip.show(window,x,y)指定窗口和偏移量顯示
PS: tooltip指的是Tooltip的對象,可以直接新建
Java中使用
簡單地提下Java中的使用
//control是某個控件
Label label = new Lable("hello")
Tooltip.install(label, new Tooltip("鼠標懸浮顯示的文字"));
TornadoFx中使用
class TestView : View("My View") {
override val root = vbox {
label("hello") {
tooltip = tooltip("這是一段解釋說明")
}
}
}
自定義
本章節(jié)包括對tooltip的樣式定制化以及指定窗口顯示
樣式自定義
默認的黑底白字有些丑,有時候感覺看到不太清楚,我們可以對其樣式進行調(diào)整,調(diào)整為白底黑字,代碼如下:
label("hello") {
tooltip = tooltip("這是一段解釋說明"){
style {
backgroundColor += c("white")
textFill = c("black")
}
}
}
效果如下圖所示:

從上面的代碼其實就是修改了tooltip內(nèi)部的樣式就可以了,舉一反三,相關屬性或樣式修改即可對tooltip的樣式進行調(diào)整
label("hello") {
tooltip = tooltip {
prefWidth = 200.0
textAlignment = TextAlignment.LEFT
isWrapText = true
style {
backgroundColor += c("white")
textFill = c("black")
}
isAutoHide = false
text = "這是一段長文本說明長文本說明這是一段長文本說明長文本說明"
}
}
效果如下:

指定窗口顯示
上面也是解釋過,Tooltip有兩種使用方法,一種是與控件進行綁定,另外則是指定窗口來使用,那么上面情況下是需要使用指定窗口這種方法呢?
答案很明確,有些控件并不支持直接安裝tooltip的,那我們想要實現(xiàn)懸浮彈窗只能使用這個指定窗口顯示的方法了
我們以Text為例子,再想上面的label那樣寫,tooltip會直接爆紅的,原因是Text并不是control包中的組件

text("hello") {
//注意這里,是聲明了變量
val tooltip = tooltip {
prefWidth = 200.0
textAlignment = TextAlignment.LEFT
isWrapText = true
style {
backgroundColor += c("white")
textFill = c("black")
}
isAutoHide = false
text = "這是一段長文本說明長文本說明這是一段長文本說明長文本說明這是一段長文本說明長文本說明這是一段長文本說明長文本說明"
}
//監(jiān)聽鼠標劃入事件
setOnMouseEntered {
tooltip.show(currentWindow)
}
//監(jiān)聽鼠標劃出事件
setOnMouseExited {
ooltip.hide()
}
}
上述代碼對Text控件設置了鼠標劃入和劃出事件的監(jiān)聽,當鼠標劃入的時候,就顯示tooltip;當鼠標劃出的時候,就將tooltip進行隱藏
滑動到圖標
首先我們來看動態(tài)效果

tooltip自動移動位置有點奇怪,不過沒找到具體原因,湊合著用了..
代碼也是比較簡單,只是在上面鼠標劃入和劃出的監(jiān)聽基礎上加了修改圖標的操作,不過感覺有些卡頓,圖片寬高最好不要設置太大
圖標是自己去iconfont-阿里巴巴矢量圖標庫生成了,就簡單的改了下顏色,就有了兩張圖片
PS:實踐的時候,注意下圖片的路徑,如下圖

代碼如下:
imageview("/img/que_normal.png") {
fitWidth = 50.0
fitHeight=50.0
//注意這里,是聲明了變量
val tooltip = tooltip {
prefWidth = 200.0
textAlignment = TextAlignment.LEFT
isWrapText = true
style {
backgroundColor += c("white")
textFill = c("black")
}
isAutoHide = false
text = "這是一段長文本說明長文本說明這是一段長文本說明長文本說明這是一段長文本說明長文本說明這是一段長文本說明長文本說明"
}
setOnMouseEntered {
image = Image("/img/que_select.png")
tooltip.show(currentWindow)
}
setOnMouseExited {
image = Image("/img/que_normal.png")
tooltip.hide()
}
}
這里,還是建議使用字體庫可能效果比較好,可以快速修改顏色
給自己打波廣告,可以去看看我這個開源庫Tornadofx學習筆記(4)——IconTextFx開源庫,整合5000+個字體圖標
下面這圖片是我用字體庫來實現(xiàn)的效果圖:

到此這篇關于JavaFx?Tooltip懸浮提示使用及自定義的文章就介紹到這了,更多相關JavaFx?Tooltip懸浮提示內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
springboot 自定義權(quán)限標簽(tld),在freemarker引用操作
這篇文章主要介紹了springboot 自定義權(quán)限標簽(tld),在freemarker引用操作,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09
IDEA下創(chuàng)建SpringBoot+MyBatis+MySql項目實現(xiàn)動態(tài)登錄與注冊功能
這篇文章主要介紹了IDEA下創(chuàng)建SpringBoot+MyBatis+MySql項目實現(xiàn)動態(tài)登錄與注冊功能,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2021-02-02
基于parameters參數(shù)實現(xiàn)參數(shù)化過程解析
這篇文章主要介紹了基于parameters參數(shù)實現(xiàn)參數(shù)化過程解析,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-08-08
修改xml文件再也不用重啟項目mybatis-xmlreload方法
這篇文章主要為大家介紹了修改xml文件再也不用重啟項目mybatis-xmlreload,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-03-03

