JavaFX Cookbook (JavaFX အသင့်သုံး code နမူနာများ)
IA (Internal Assessment) အတွက် tool တွေပါ၊ စာမေးပွဲ ခေါင်းစဉ် မဟုတ်ပါဘူး: JavaFX (Java နဲ့ desktop app တည်ဆောက်တဲ့ library) က ကျောင်းသား အများစု ကိုယ့် Internal Assessment အတွက် application တည်ဆောက်ရာမှာ သုံးတဲ့ toolkit (အသင့်ရေးထားတဲ့ class အစု) ပါ။ IA ဆိုတာ IB သင်တန်းမှာ ကျောင်းသားတစ်ယောက်ချင်း ကိုယ်တိုင် တည်ဆောက်ရပြီး ကျောင်းက ဆရာက အမှတ်ပေးတဲ့ အပိုင်းပါ။ JavaFX က IB Computer Science (နိုင်ငံတကာ ကျောင်းတွေမှာ သင်တဲ့ ကွန်ပျူတာသိပ္ပံ သင်ရိုး) ရဲ့ စာမေးပွဲမှာ စစ်တဲ့ syllabus ထဲမှာ မပါလို့ ဒီစာမျက်နှာတွေထဲက ဘာကိုမှ စာမေးပွဲမှာ မမေးပါဘူး။ ကိုယ်ပိုင် app တည်ဆောက်ဖို့ လက်တွေ့ သုံးလို့ရတဲ့ အစိတ်အပိုင်းတွေအဖြစ် သုံးပါ။
ဒါက ဘာလဲ
ကိုယ့် IA application ထဲ ထည့်သုံးလို့ရတဲ့၊ တစ်ခုချင်း သီးခြား ပြည့်စုံတဲ့ JavaFX နည်းလမ်း အသေးလေးတွေကို စုထားတာပါ။ တစ်ခုချင်းစီက recipe (ချက်ချင်း ယူသုံးလို့ရတဲ့ code နမူနာ) တစ်ခုပါ: အလုပ်တစ်ခုတည်း လုပ်ပေးတဲ့ ယေဘုယျ code ပုံစံ အတိုလေး တစ်ခုဖြစ်ပြီး ကိုယ့် project နဲ့ ကိုက်အောင် ဘယ်နာမည်တွေ၊ ဘယ်တန်ဖိုးတွေကို ပြောင်းရမလဲ ဆိုတဲ့ ရှင်းလင်းတဲ့ မှတ်ချက် ပါပါတယ်။ သူတို့ကို စက်တစ်ခုရဲ့ အစိတ်အပိုင်းတွေလို သဘောထားပါ။ Table recipe၊ file ရွေးတဲ့ recipe နဲ့ အတည်ပြုချက် တောင်းတဲ့ dialog (user ဆီက တစ်ခုခုကို မေးတဲ့ window အသေး) recipe တို့ကို ရွေးပြီး ကိုယ်တည်ဆောက်နေတဲ့ app ထဲမှာ တွဲချိတ်လိုက်ပါ။
ဥပမာတွေက သေးငယ်ပြီး ယေဘုယျ ဆန်ပါတယ်: တစ်ခုချင်းစီက JavaFX နည်းလမ်း တစ်ခုတည်းကိုပဲ ပြပြီး ကိုယ်ပိုင် version ကို ကိုယ်တိုင် တည်ဆောက်ဖို့ ချန်ထားပါတယ်။ IA က ကိုယ်တိုင် လုပ်တဲ့ အလုပ် ဖြစ်ရမှာမို့ ဒီဥပမာတွေကို ကူးယူရမယ့် ပြီးပြည့်စုံတဲ့ feature (program ရဲ့ လုပ်ဆောင်ချက်) တွေလို့ မမြင်ဘဲ ပြင်သုံးရမယ့် ပုံစံတွေလို့ မြင်ပါ: ကိုယ့်ပြဿနာ လိုအပ်တဲ့ logic ကို ကိုယ်တိုင် ရေးပြီး ပြန်သုံးတဲ့ code မှန်သမျှကို ဘယ်ကယူတယ်ဆိုတာ ဖော်ပြပါ။
ဒီကို ပထမဆုံး ရောက်တာလား။ Start here: how every recipe fits together (ဒီမှာ စပါ: recipe တိုင်း ဘယ်လို ချိတ်ဆက်ထားလဲ) ကို အရင် ဖတ်ပါ။ အဲဒီ စာမျက်နှာက ကိုယ်ပြင်ရမယ့် နေရာ နှစ်ခုကို ရှင်းပြပါတယ်: SceneBuilder (FXML layout ကို ပုံနဲ့ မြင်ရင်း ပြင်တဲ့ editor) ထဲက layout (control တွေကို screen ပေါ်မှာ စီစဉ်ထားပုံ) နဲ့ controller (user လုပ်တာတွေကို ကိုင်တွယ်ပြီး Model နဲ့ screen တွေကို ချိတ်ပေးတဲ့ class) ရဲ့ .java file ပါ။ Recipe တိုင်း မှီခိုနေတဲ့ fx:id နဲ့ onAction ချိတ်ဆက်မှုတွေကိုလည်း ရှင်းပြပါတယ်။ အဲဒီမှာ ငါးမိနစ်လောက် အချိန်ပေးလိုက်ရင် recipe တိုင်းကို တစ်ချက်ကြည့်ရုံနဲ့ နားလည်လာပါလိမ့်မယ်။
သုံးပုံ
Recipe တိုင်းကို ပုံစံ တစ်မျိုးတည်း စီထားပါတယ်:
- ကိုယ်လုပ်ချင်တဲ့ အလုပ်ကို ခေါင်းစဉ်မှာ ဖော်ပြထားတဲ့ recipe ကို ရှာပါ။
- SceneBuilder ထဲမှာ (layout) အပိုင်းက screen ပေါ်ကို ဘာထည့်ရမလဲ၊ အဲဒါကို ဘယ်
fx:idဒါမှမဟုတ်onActionပေးရမလဲ ပြောပြပါတယ်။ - Controller ထဲမှာ (
.javafile) အပိုင်းက import (တခြားနေရာက code ကို ယူသုံးမယ်လို့ ကြေညာခြင်း) တွေ၊@FXMLfield (@FXMLအမှတ်အသားနဲ့ FXML ထဲက control ကို ချိတ်ထားတဲ့ field) တွေနဲ့ event handler (button နှိပ်တာလို event ဖြစ်တဲ့အခါ run တဲ့ code) ရဲ့ code ကို ပေးပါတယ်။ - ကိုယ်ပိုင် logic ထည့်ရမယ့် နေရာ အပိုင်းက
// your IA logic here(ဒီနေရာမှာ ကိုယ့် IA logic ကို ထည့်ပါ) လို့ မှတ်ထားတဲ့ line ကို ပြပါတယ်။ အဲဒီမှာ ကိုယ့် application လိုအပ်တဲ့ ဒေတာ စီမံမှုတွေကို ထည့်ရပါတယ်။ အဲဒီ အပိုင်းက ကိုယ်တိုင် လုပ်ရမယ့် အလုပ်ပါ၊ သူ့ပတ်လည်က code ကတော့ ပြန်သုံးလို့ ရပါတယ်။ - ကိုယ့် project နဲ့ ကိုက်အောင် ပြင်ပါ အပိုင်းက ပြောင်းရမယ့် နာမည်တွေ၊ တန်ဖိုးတွေကို စာရင်းပြပါတယ်၊ သတိထားရမယ့် အချက်များ အပိုင်းက အဖြစ်များတဲ့ အမှားတွေကို ပြောပြပါတယ်၊ တွဲသုံးလို့ရတဲ့ recipe များ အပိုင်းက အတူတွဲသုံးလို့ ကောင်းတဲ့ recipe တွေကို link ပေးထားပါတယ်။
ဒီ recipe တွေကို အစဉ်လိုက် ဖတ်ဖို့ မလိုပါဘူး၊ recipe တစ်ခုကို သုံးဖို့ တခြား recipe တစ်ခုကို အရင် ဖတ်ထားဖို့လည်း မလိုပါဘူး။
ကြိုသိထားရမယ့် အရာများ
ဒီစာမျက်နှာတွေက Java ကို တစ်နှစ်လောက် လေ့လာထားပြီးသားလို့ ယူဆပါတယ်: class (object တွေ ဖန်တီးဖို့ ပုံစံခွက်) နဲ့ object (class တစ်ခုကနေ ဖန်တီးထားတဲ့ instance)၊ constructor (object ဖန်တီးချိန် attribute တွေကို စတင် သတ်မှတ်ပေးတဲ့ method)၊ encapsulation (ဒေတာနဲ့ method ကို တစ်စုတည်း ထုပ်ပိုးခြင်း)၊ inheritance (parent class ကနေ အမွေဆက်ခံခြင်း)၊ array (အရွယ်အစား ပုံသေ၊ အမျိုးအစားတူ ဒေတာစု)၊ ArrayList (ကြီးလာ၊ သေးသွားနိုင်တဲ့ list)၊ loop (ထပ်ခါထပ်ခါ run တဲ့ code အပိုင်း)၊ conditional (condition ပေါ်မူတည်ပြီး လမ်းကြောင်း ရွေးခြင်း)၊ method (သီးခြား အလုပ်တစ်ခု လုပ်ပေးတဲ့ code အပိုင်း)၊ file ကို အခြေခံ ဖတ်တာ၊ ရေးတာ နဲ့ try/catch (error ဖြစ်ရင် ဖမ်းပြီး ကိုင်တွယ်တဲ့ ပုံစံ) တို့ပါ။ SceneBuilder မှာ FXML နဲ့ တည်ဆောက်ပြီး screen တစ်ခုစီအတွက် controller class တစ်ခုစီ ရှိတယ်လို့လည်း ယူဆပါတယ်။ ဒါက OOP pages (OOP စာမျက်နှာများ) မှာ သင်တဲ့ MVC (app ကို Model၊ View၊ Controller ဆိုပြီး အပိုင်းသုံးပိုင်း ခွဲရေးတဲ့ ပုံစံ) ပုံစံပါ။ Recipe တစ်ခုက စာမေးပွဲ ပုံစံ Java (IB စာမေးပွဲ မေးခွန်းတွေမှာ သုံးတဲ့ Java အပိုင်း) အပြင်က Java ကို သုံးရင် (ဥပမာ lambda၊ နာမည် မပါတဲ့ method အတိုလေး) စာမေးပွဲမှာ မေးနိုင်တဲ့ အကြောင်းအရာလို့ မထင်မိအောင် line တစ်ကြောင်းနဲ့ ပြောပြပါတယ်။
စာမျက်နှာများ
| # | ခေါင်းစဉ် | အဓိက အယူအဆများ |
|---|---|---|
| 1 | Start here: how every recipe fits together (ဒီမှာ စပါ: recipe တိုင်း ဘယ်လို ချိတ်ဆက်ထားလဲ) | ကိုယ်ပြင်ရမယ့် နေရာ နှစ်ခုနဲ့ fx:id၊ onAction ချိတ်ဆက်မှုများ။ အရင်ဆုံး ဖတ်ပါ |
| 2 | Controlling UI state (UI ရဲ့ အခြေအနေကို ထိန်းချုပ်ခြင်း) | Control (button၊ text box စတဲ့ user သုံးတဲ့ အစိတ်အပိုင်း) တွေကို သုံးလို့ရအောင် ဖွင့်ခြင်း၊ သုံးလို့မရအောင် ပိတ်ခြင်း၊ focus (keyboard နဲ့ ရိုက်ထည့်တာကို လက်ခံမယ့် control ဖြစ်နေခြင်း)၊ Enter key ကို တုံ့ပြန်ခြင်း |
| 3 | Dialogs and feedback (dialog များနဲ့ user ကို အသိပေးခြင်း) | အချက်အလက် ပြတဲ့ dialog နဲ့ အတည်ပြုချက် တောင်းတဲ့ dialog၊ မှားတဲ့ input ကို ဖမ်းခြင်း |
| 4 | Input controls (ဒေတာ ထည့်တဲ့ control များ) | Radio button (အုပ်စုထဲက တစ်ခုပဲ ရွေးလို့ရတဲ့ အဝိုင်း ခလုတ်)၊ checkbox (အမှန်ခြစ် အကွက်)၊ combo box (ရွေးချယ်စရာ စာရင်း)၊ date picker (ရက်စွဲ ရွေးတဲ့ control)၊ ဂဏန်းပဲ လက်ခံတဲ့ field များ |
| 5 | Showing data in a table (ဒေတာကို ဇယားနဲ့ ပြခြင်း) | TableView၊ table ကို ဒေတာနဲ့ ဖြည့်ခြင်း၊ ရွေးထားတဲ့ row ကို ဖတ်ခြင်း၊ စာရိုက်နေရင်း ချက်ချင်း စစ်ထုတ်ပြခြင်း |
| 6 | Time, progress, and animation (အချိန်၊ အလုပ် ပြီးမြောက်မှုနဲ့ animation) | Timeline နဲ့ အချိန်မှန်မှန် code run ခြင်း၊ progress bar (ဘယ်လောက် ပြီးပြီလဲ ပြတဲ့ ဘား) များ |
| 7 | Files and persistence (file တွေနဲ့ ဒေတာ ရေရှည် သိမ်းဆည်းခြင်း) | FileChooser၊ စာသားကို save လုပ်ခြင်းနဲ့ load လုပ်ခြင်း |
| 8 | Exporting and sharing (ဒေတာ ထုတ်ပေးခြင်းနဲ့ မျှဝေခြင်း) | CSV (comma နဲ့ ခြားထားတဲ့ စာသား file) export၊ button ကနေ email ပို့ခြင်း၊ ဝဘ်စာမျက်နှာ ဖွင့်ခြင်း |
| 9 | App structure and navigation (app ရဲ့ ဖွဲ့စည်းပုံနဲ့ screen တွေကြား သွားလာခြင်း) | initialize၊ menu များ၊ app ကို ပိတ်ခြင်း၊ ဒုတိယ window များ၊ ဒေတာ ပေးပို့ခြင်း၊ tab များ၊ CSS |
| 10 | Charts and graphs (chart နဲ့ ဂရပ်များ) | Line chart၊ bar chart နဲ့ pie chart (မျဉ်း၊ ဘား၊ စက်ဝိုင်းပုံ chart) များနဲ့ သူတို့ကို update လုပ်ခြင်း |
| 11 | Images and media (ပုံများနဲ့ media) | ပုံ ပြခြင်း၊ ပုံပါတဲ့ button များ၊ အသံ |
| 12 | Drawing and animation (ပုံဆွဲခြင်းနဲ့ animation) | Canvas ပေါ်မှာ ပုံဆွဲခြင်း၊ mouse handler များ၊ game loop များ |
| 13 | Keep the UI responsive during slow work (ကြာတဲ့ အလုပ် လုပ်နေစဉ် UI ကို တုံ့ပြန်နေအောင် ထားခြင်း) | Window ရပ်မသွားအောင် background thread (နောက်ကွယ်မှာ သီးခြား run နေတဲ့ အလုပ်လမ်းကြောင်း) တွေနဲ့ Task ကို သုံးခြင်း |
ဥပမာ အားလုံးက third-party library (JavaFX အပြင် တခြားသူတွေ ရေးထားတဲ့ library) မပါဘဲ ပုံမှန် JavaFX ကိုပဲ သုံးပါတယ်။ ခြွင်းချက် တစ်ခုပဲ ရှိပြီး အဲဒါကိုလည်း ဖော်ပြထားပါတယ်: Files စာမျက်နှာကနေ ညွှန်းထားတဲ့ database (ဒေတာ သိမ်းဆည်းတဲ့ စနစ်) recipe က SQLite driver (Java ကနေ SQLite database ကို ချိတ်ပေးတဲ့ library) အသေးလေး တစ်ခုကို သုံးပါတယ်။ အားလုံး JavaFX ထဲမှာပဲ ရှိပြီး Swing (Java ရဲ့ အရင်က GUI toolkit) ကို မသုံးပါဘူး။
Table of contents
- Start here: how every recipe fits together
- Controlling UI state
- Dialogs and feedback
- Input controls
- Showing data in a table
- Time, progress, and animation
- Files and persistence
- Exporting and sharing
- App structure and navigation
- Charts and graphs
- Images and media
- Drawing and animation
- Keep the UI responsive during slow work