最近在和一位朋友一起做一個下棋的小專案，演算法部分暫時沒有想到太好的優化方法，但是盯著一個二維陣列下棋實在是太難受了，於是我覺得先寫一個好看點的介面，於是我開始研究怎麼寫gui，又由於那位朋友前面的程式全是用java寫的，所以我決定就用javafx來寫gui。寫下這篇部落格一邊學一邊記錄。

配好環境之後，我發現其實javafx其實幫我把大部分的工作都完成了，我只用照著模板呼叫就可以了。。。。。

要寫gui，首先要有一個視窗，這麼寫就可以了

這兩句先是定義了一個標題叫hello window的視窗然後再把它顯示出來，執行結果如下

一個視窗就出來了，接下來我需要在她上面加個按鈕，按照它的邏輯，按鈕這個元素必須要存在一個容器之中，於是我們要先定義一個按鈕，然後把他放到容器上

可以這麼寫，首先new一個叫做btok的button，傳入text引數“ok”使它顯示ok，之後再new一個容器，裡面放著btok，再傳參控制它的大小，執行後結果如下

於是現在我們就創造了一個裡面有按鈕的視窗了，用同樣的方法可以在一個程式內寫出多個視窗

但是這時候，我們發現了一個巨大的問題，那就是一個容器（scene）裡只能裝一個東西，但是我們的介面裡可能需要很多東西，於是可以這麼操作：把介面中需要的元素像貼紙一樣貼到一個板子（pane）上，再把pane放到容器（scene）之中，這樣既滿足了容器裡只能有一個東西，又滿足了介面中需要有很多東西的要求

這裡就是先建立了一個scene，然後再把

但是這時問題出現了，當我們把兩個不同的button放到了同一個pane裡面之後，卻發現出現的視窗中仍然只有一個button

這是因為兩個button雖然都被建立了，但它們被建立在了視窗中的同一個位置，導致後建立的button把先建立的button擋住了，

為了解決這個問題就需要把這些元素按照一定的順序排列起來，於是就需要用到佈局，常用佈局有以下幾個：

流佈局（flowpane） ：把元素按照順序排列

網格佈局（gridplane）：把元素按照行和列排序

邊框佈局（borderpane）：把頁面分成五個部分

之後，把需要的元素佈局好後放到pane中就可以了，元素種類較多這裡就不一一贅述了。

建立了介面的下一步就是響應使用者的操作，而這就需要用到事件響應，就需要用到事件處理器

可以先定義一個事件處理器，然後再編寫事件處理器的具體內容

執行後結果如下

當然，也可以使用lambda簡化使程式碼更加簡潔，如下

這麼寫就可以了，於是，我們就可以使得程式在收到訊號後進行事件響應了。