編寫了前面幾小程式,大家對javaFx程式以有初步認識,下面我們一起來學習javaFx的元件, 這些元件包括,1.邊框與佈局管理;2.選單;3.標籤;4.面板組,簡單標籤,文字框,5.按鈕;6.列表框;7.分割面板;8.單選按鈕,單選按鈕組,觸發按鈕,按鈕組;9.多選按鈕;10.樹形;11.表;12文字框;13.微調與滑動元件.

      這次我們學習第一個元件,邊框與佈局管理,(暫不上傳程式碼)

佈局管理:

邊框:

程式碼如下:

class ButtonClickModel {//定義類
            attribute numClicks: Number;//定義屬性numClicks,數字型別
        }

        var model = new ButtonClickModel();//建立一個類

        var win = Frame {//建一個圖形框
            width: 200 //寬
            height:100 //高
            content: GridPanel {//容器網格佈局
                border: EmptyBorder {//空邊框
                   top: 30    //頂邊距
                   left: 30   //左邊距
                   bottom: 30 //中邊距
                   right: 30  //右邊距
                }
                rows: 2//二行
                columns: 1//一列
                vgap: 10 //垂直間隙10畫素
                cells://單玩格
                [Button {//按鈕
                     text: "I'm a button!"//文字內容I'm a button
                     mnemonic: I  //I記憶屬性 I
                     action: operation() {//動作或操作
                         model.numClicks++;//每單擊一次自加
                    }
                },
                Label {//標籤
                    text: bind "Number of button clicks: {model.numClicks}"
                     //文字是{model.numClicks}的值
                }]
            }
            visible: true//可見
        };

執行後效果: