JavaFX Label 類支持HTML內容。使用Label您可以使用HTML和CSS創建樣式文本和圖像,非常類似于典型的Web應用。此外,通過使用JavaFX嵌入表達式,您可以在Swing應用中象Web頁面作者使用類似 JSTL 或 Velocity 工具一樣創建動態的HTML內容。
考慮以下虛擬購物車示例:
import javafx.ui.*;
class
Item
{
???????????? attribute id:
String
;???????????? attribute productId:
String
;???????????? attribute description:
String
;???????????? attribute inStock:
Boolean
;???????????? attribute quantity:
Number
;???????????? attribute listPrice:
Number
;???????????? attribute totalCost:
Number
;????????
}
???????? attribute Item.
totalCost
= bind quantity*listPrice; ????????
class
Cart
{
???????????? attribute items: Item*;???????????? attribute subTotal:
Number
;????????
}
???????? operation sumItems
(
itemList:Item*
)
{
???????????? var result =
0.00
;????????????
for
(
item in itemList
)
{
???????????????? result += item.
totalCost
;????????????
}
????????????
return
result;????????
}
???????? attribute Cart.
subTotal
= bind sumItems
(
items
)
; ???????? var cart = Cart
{
???????????? items:????????????
[
Item
{
???????????????? id:
"UGLY"
???????????????? productId:
"D100"
???????????????? description:
"BullDog"
???????????????? inStock:
true
???????????????? quantity:
1
???????????????? listPrice:
97.50
????????????
}
,???????????? Item
{
???????????????? id:
"BITES"
???????????????? productId:
"D101"
???????????????? description:
"Pit Bull"
???????????????? inStock:
true
???????????????? quantity:
1
???????????????? listPrice:
127.50
????????????
}
]
????????
}
;????????
Frame
{
????????????? content:
Label
{
???????????????? text: bind ???????????????????
"<html>??????????????????????? <h2 align='center'>Shopping Cart</h2>??????????????????????? <table align='center' border='0' bgcolor='#008800' cellspacing='2' cellpadding='5'>?????????????????????????? <tr bgcolor='#cccccc'>????????????????????????????? <td><b>Item ID</b></td>????????????????????????????? <td><b>Product ID</b></td>????????????????????????????? <td><b>Description</b></td>????????????????????????????? <td><b>In Stock?</b></td>????????????????????????????? <td><b>Quantity</b></td>????????????????????????????? <td><b>List Price</b></td>????????????????????????????? <td><b>Total Cost</b></td>????????????????????????????? <td> </td>??????????????????????????? </tr> ??????????????????????????? {????????????????????????????? if (sizeof cart.items == 0)????????????????????????????? then "
<tr bgcolor=
'#FFFF88'
><td colspan=
'8'
><b>Your cart is empty.</b></td></tr>
"????????????????????????????? else foreach (item in cart.items)????????????????????????????????? "
<tr bgcolor=
'#FFFF88'
>?????????????????????????????????? <td>
{
item.
id
}
</td>?????????????????????????????????? <td>
{
item.
productId
}
</td>?????????????????????????????????? <td>
{
item.
description
}
</td>?????????????????????????????????? <td>
{
if
item.
inStock
then
"Yes"
else
"No"
}
</td>?????????????????????????????????? <td>
{
item.
quantity
}
</td>?????????????????????????????????? <td align=
'right'
>
{
item.
listPrice
}
</td>?????????????????????????????????? <td align=
'right'
>
{
item.
totalCost
}
</td>?????????????????????????????????? <td> </td>?????????????????????????????????? </tr>
"??????????????????????????? } ??????????????????????????? <tr bgcolor='#FFFF88'>???????????????????????????????? <td colspan='7' align='right'>??????????????????????????????????? <b>Sub Total: ${cart.subTotal}</b>??????????????????????????????? </td>??????????????????????????????? <td> </td>???????????????????????????? </tr>????????????????????????? </table>?????????????????????? </html>"
????????????????
}
???????????????? visible:
true
????????
}
運行以上程序,顯示如下:
如果您編程刪除購物車內容:
delete cart.
items
;
您將看到如下內容:
在以上示例中,內嵌的JavaFX表達式(粗體顯示)動態創建HTML表格列和表格單元的內容。當這些表達式依賴的對象有變化時,Label的HTML內容將自動更新。
以上示例還非常有趣,因為其演示了使用表達式定義屬性值的用法。Item類的totalCost屬性和Cart類的subTotal屬性被綁定為表達式以計算它們的值。任何時候這些表達式的依賴對象發生變化,屬性值將被自動重新計算并更新。考慮在電子表格中,某些單元格包含指向其他單元格的表達式,當您在這些其他單元格輸入數據,包含依賴它們的表達式的單元格值也被自動更新了。
HTML中的圖像
JavaFX Label類實際上封裝了一個特殊的JEditPane,該 JEditorPane 使用一個支持用Java類轉載器從JAR文件中載入圖像的共享圖像緩存。因此,您可以就像普通的文件URL一樣使用HTML的<img>元素引用您的應用的圖像資源包。
超鏈接
Label類同樣支持HTML超鏈接,內嵌一個特殊的URL給HTML<a>元素的href屬性。
這樣的URL使用JavaFX #操作符創建,該操作符生成一個字符串化對象引用(Stringified Object Reference)指向后續可以被JavaFX復引用的操作對象。?操作符,例如:
var a =
20
;var b = #a;
assert
b
instanceof
String
;
// 通過
var c =
(
Number
)
?b;
assert
a == c;??
// 通過
Label類的HTML顯示器認識諸如HTML的<a href=url>這樣的URL,使用URL來響應元素的鼠標點擊,并且如果URL值指向一個函數或操作的話,它可以調用該函數或操作。
例如,以下是使用帶超鏈接標簽代替按鈕的前面按鈕點擊示例的重寫版本:
import javafx.ui.*;
import java.lang.System;
class
ButtonClickModel
{
attribute numClicks:
Number
;
}
var model =
new
ButtonClickModel
(
)
; var win =
Frame
{
?? width:
300
?? height:
200
?? menubar:
MenuBar
{
???? menus:
Menu
{
?????? text:
"File"
?????? mnemonic: F?????? items:
MenuItem
{
???????? text:
"Exit"
???????? mnemonic: X???????? accelerator:
{
?????????? modifier: ALT?????????? keyStroke: F4???????????
}
???????? action: operation
(
)
{
??????????
System
.
exit
(
0
)
;???????????
}
????????
}
??????
}
???
}
?? content: GridPanel
{
???? border:
EmptyBorder
{
top:
30
left:
30
bottom:
30
right:
30
?????
}
???? rows:
2
???? columns:
1
???? vgap:
10
???? cells:????
[
Label
{
??????? text: bind???????
"<html>?????????? <a href='{#(operation() {model.numClicks++;})}'>???????????? I'm a hyperlink!?????????? </a>???????? </html>"
???????
}
,?????
Label
{
??????? text: bind
"Number of button clicks: {model.numClicks}"
??????
}
]
??
}
?? visible:
true
}
;
以上示例中粗體的表達式創建一個新的遞增model的numClicks屬性的操作。使用#操作符生成后續將被鍵入到HTML標記中的指向該操作的URL。
運行該程序,顯示如下:
點擊超鏈接兩次后,顯示如下:
?
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索:z360901061
微信掃一掃加我為好友
QQ號聯系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元

