Myanmar Android Development မွ Android Dev Lessons မ်ားကုိ အျခား website မ်ား ၊ ျပင္ပစာအုပ္စာေပမ်ားတြင္ကူးယူေဖာ္ျပျခင္းမျပဳ ၾကပါရန္အသိေပးအပ္ပါသည္။



Monday, June 23, 2014

Android Application မ်ားေရးသားနည္း - အပုိင္း(၂၂)


အပုိင္း(၂၁) မွာေတာ့ Android Screen တစ္ခ်ပ္ကေန ေနာက္တစ္ခ်ပ္ဆီကုိသြားတာကုိ ေလ့လာခဲ့ၾကရပါျပီ။ ကြ်န္ေတာ္တုိ႕အခုလုပ္လာတဲ့သင္ခန္းစာေတြမွာ ခလုတ္တစ္ခုပဲပါ ပါေသးတယ္။ ဒီေန႕သင္ခန္းစာအပုိင္း (၂၂) မွာေတာ့ ခလုတ္တစ္ခုထက္ပုိျပီး Screen ေပၚမွာထည့္ၾကည့္ရေအာင္ ။ ဥပမာ - ေဆာ့၀ဲမွာ ခလုတ္ႏွစ္ခုပါတယ္ဆုိပါစုိ႕ ။ ပထမခလုတ္ကုိ ႏွိပ္ရင္ ဘာျဖစ္ရမယ္ ။ ဒုတိယခလုတ္ကုိႏွိပ္ရင္ဘာျဖစ္ရမယ္။ စသျဖင့္ေပါ့။ အခုသင္ခန္းစာမွာေတာ့ ခလုတ္ႏွစ္ခုကုိနမူနာထည့္ျပပါမယ္။



ခလုတ္ (Button) သင္ခန္းစာကုိလုပ္မယ္ဆုိရင္ step (3) ခုကုိမွတ္သားထားရင္ရပါျပီ။

- Screen Layout ေပၚကုိ Form Widget ထဲက Button တစ္ခုဆြဲတင္ ၊ Screen Layout ေပၚကုိဆြဲတင္လုိက္ျပီျဖစ္တဲ့ Button ကုိ ID သတ္မွတ္ေပး ၊ ျပီးရင္ File > Save

- Screen Layout ေပၚကုိတင္ခဲ့တဲ့ Button ကုိ Command code ေတြထည့္ေရးရန္ ယင္း Screen Layout နဲ႕သက္ဆုိင္တဲ့ Java ဖုိင္ထဲကေန Button Code သုံးျပီး Screen Layout ဘက္ျခမ္းမွာတင္ထားခဲ့တဲ့ Button ကုိလွမ္းခ်ိတ္ရပါမယ္။

- ယင္း Button ကုိႏွိပ္လုိက္ရင္ ျဖစ္ခ်င္တဲ့ action တစ္ခုခု (ဥပမာ ခလုတ္ကုိႏွိပ္လုိက္ရင္ Alert Box ေပၚခ်င္တာမ်ိဳး) ကုိ Button Code ရဲ႕ onClick() {} ထဲမွာထည့္ေရးလုိက္ရုံပါပဲ။

ဒီသံုးခ်က္ကုိသိျပီ ၊ ဒီအတုိင္းလုိက္လုပ္မယ္ဆုိရင္ Button သင္ခန္းစာအတြက္ အဆင္ေျပပါျပီ။

အရင္ဆုံး Screen Layout ေပၚကုိ Form widget ထဲက Button တစ္ခုကုိ Drag & Drop ဆြဲထည့္ပါ။



ျပီးရင္ ယင္း Button ေပၚကုိ Click တစ္ခ်က္ႏွိပ္ပါ။ ေဘးမွာ Button နဲ႕သက္ဆုိင္တဲ့ properties ေပၚလာပါမယ္။



ယင္း Properties box ထဲက ID ရဲ႕ေဘးကအကြက္ကုိ click ၂ ခ်က္ႏွိပ္ပါ။ id/ ကုိခ်န္ျပီး ေနာက္က button1 ဆုိတာကုိဖ်က္ပစ္ပါ။

ျပီးရင္ ၾကိဳက္ႏွစ္သက္ရာ ID name တစ္ခုခုေပးလုိက္ပါ။ ဥပမာ - b1


Button ကုိ ID name ေပးျပီးျပီဆုိရင္ေတာ့ ADT ရဲ႕ menu bar က File ထဲကုိ၀င္ပါ ။ ျပီးရင္ save ကုိႏွိပ္၍ Save လုိက္ပါ။ (ID တစ္ခါသတ္မွတ္ျပီးတုိင္း တစ္ခါ save ရပါမယ္)

ျပီးရင္ Screen layout နဲ႕သက္ဆုိင္တဲ့ java file ထဲကုိ၀င္ျပီး ယခု Screen Layout ေပၚမွာတင္ထားခဲ့တဲ့ Button ကုိ Java file ကေန Button code အသုံးျပဳျပီးလွမ္းခ်ိတ္ရပါမယ္။ သူနဲ႕သက္ဆုိင္ရာ java file ကုိရွာဖုိ႕ ကုိယ့္ရဲ႕ Project ထဲက src folder ထဲကုိ၀င္ပါ။ ေလာေလာဆယ္ေတာ့  MainActivity.java တစ္ဖုိင္ပဲရွိပါဦးမယ္။ အဲဒီ MainActivity.java ဖုိင္ထဲကုိ၀င္ပါ။ setContentView....() ဆုိတဲ့စာေၾကာင္းကုိလုိက္ရွာပါ။



အဲဒီမွာ setContentView(R.Layout.MainActivity) ဆုိတာမ်ိဳးေတြ႕ရင္ ဒီ MainActivity.java ဖုိင္ဟာ ကြ်န္ေတာ္တုိ႕ခုနက Button တင္ထားခဲ့တဲ့ Screen Layout ျဖစ္တဲ့ activitymain.xml နဲ႕ခ်ိတ္ဆက္ထားတယ္လုိ႕ ယူဆရပါမယ္။ အဲလုိခ်ိတ္ဆက္ထားတဲ့ဖုိင္မွာသာ ယင္း screen နဲ႕သက္ဆုိင္တဲ့ code ကုိ၀င္ေရးလုိ႕ရမွာပါ။ အခု ကြ်န္ေတာ္တုိ႕က MainActivity.java file ထဲမွာ
ဟုိဘက္ Screen Layout က Button ကုိလွမ္းခ်ိတ္ဖုိ႕ Button Code ထည့္ပါမယ္။ Button Code ကေတာ့ ေအာက္ပါအတုိင္းပါ။


 final Button bb1=(Button)findViewById(R.id.button1);
       
       
         bb1.setOnClickListener(new View.OnClickListener() {
             public void onClick(View v) {
                 // Perform action on click

              
   
             }
         });

(ယခု code သည္နမူနာျပထားျခင္းသာျဖစ္ေသာေၾကာင့္ ကုိယ့္ project ထဲက id name ေတြနဲ႕ကုိက္ေအာင္ျပန္ျပင္ေပးပါ။ ဥပမာ - အေပၚက code ထဲမွာ R.id.button1 လုိ႕ေပးထားတာကုိျမင္ရမွာပါ။ bb ေနရာမွာ ကြ်န္ေတာ္တုိ႕ screen layout ဘက္ျခမ္းမွာ Button ကုိ b1 လုိ႕နာမည္ေပးခဲ့တယ္ဆုိရင္ b1 လုိ႕ျပင္ေပးလုိက္ပါ ။ ဥပမာ - R.id.b1)

အေပၚမွာျပထားတဲ့ Button code ကုိ setContentView() စာေၾကာင္းရဲ႕ေအာက္တစ္ေၾကာင္းေနရာမွာထည့္ရပါမယ္။



ထည့္ျပီးသြားျပီဆုိရင္ ထုံးစံအတုိင္း Error မီးေလးေတြလင္းပါလိမ့္မယ္။ အရင္သင္ခန္းစာေတြတုန္းကလုိပဲ error မီးေလးေတြႏွိပ္ျပီး Import.... ကုိ double click ေတြသာႏွိပ္ေပးလုိက္ပါ။ ယခု Button code မွာဆုိရင္ error မီးသုံးခုလင္းပါလိမ့္မယ္။
 ပထမတစ္ခုနဲ႕ တတိယတစ္ခုကုိပဲ ႏွိပ္ျပီး error ရွင္းပါ။



error မီးေတြေပ်ာက္သြားျပီဆုိရင္
Button ကုိႏွိပ္လုိက္တဲ့အခါျဖစ္ခ်င္တဲ့ Action code ကုိထည့္ပါမယ္။ ဥပမာအေနနဲ႕ ခလုတ္ကုိႏွိပ္လုိက္တဲ့အခါ "I am MgMg" ဆုိတဲ့စာသားေလး Screen ရဲ႕ေအာက္ေျခနားေလာက္မွာ Message အေနနဲ႕ေပၚလာေအာင္ေရးၾကည့္ရေအာင္ ။ ယခုထည့္ထားခဲ့တဲ့ Button Code ထဲမွာ onClick() {} ဆုိတဲ့ function ပါပါတယ္ ။ ယင္း onClick function ထဲကုိ message ေပၚေစတဲ့ code ကုိသြားထည့္ရမွာပါ။  Message ေပၚေစတဲ့ code ကေတာ့ေအာက္ပါအတုိင္းပါ။

Toast.makeText(getApplicationContext(), "msg msg", Toast.LENGTH_SHORT).show();


ေပၚေစခ်င္တဲ့စာသားကုိေတာ့ "" double quote ႏွစ္ခုၾကားမွာသြားျပင္ပါ။ ဥပမာ-

Toast.makeText(getApplicationContext(), "I am MgMg", Toast.LENGTH_SHORT).show();

ယင္း code ကုိ Button Code ရဲ႕ onClick () Function ထဲမွာသြားထည့္ေပးရမွာပါ။ ေအာက္ပါအတုိင္းပါ။



Error  မီးကိုေတာ့ ထုံးစံအတုိင္း Error မီးလုံးေလးေပၚမွာ Click ႏွိပ္ Import.... ကုိ double click ႏွိပ္ျပီး ေဖ်ာက္လုိက္ပါ။
ျပီးရင္ေတာ့ ဖုန္း (သုိ႕) Emulator နဲ႕ run ၾကည့္လုိ႕ရပါျပီ။



အခု ကြ်န္ေတာ္တုိ႕လုပ္ခဲ့တာ ခလုတ္ တစ္ခုစာပဲရွိပါေသးတယ္။ ေနာက္ခလုတ္တစ္ခုေလာက္ နမူနာထပ္ထည့္ျပပါမယ္။ မွတ္သားထားရမွာပါ ခလုတ္ ဘယ္ႏွခုပဲျဖစ္ျဖစ္ အေပၚမွာတုန္းကေျပာခဲ့တဲ့ Step (၃) ခ်က္ကုိပဲ လုပ္ရမွာပါ။  Button သင္ခန္းစာအတြက္ မွတ္သားရန္သုံးခ်က္ကုိ တစ္ခါျပန္ေျပာပါမယ္။
- Screen Layout ေပၚကုိ Form Widget ထဲက Button တစ္ခုဆြဲတင္ ၊ Screen Layout ေပၚကုိဆြဲတင္လုိက္ျပီျဖစ္တဲ့ Button ကုိ ID သတ္မွတ္ေပး ၊ ျပီးရင္ File > Save

- Screen Layout ေပၚကုိတင္ခဲ့တဲ့ Button ကုိ Command code ေတြထည့္ေရးရန္ ယင္း Screen Layout နဲ႕သက္ဆုိင္တဲ့ Java ဖုိင္ထဲကေန Button Code သုံးျပီး Screen Layout ဘက္ျခမ္းမွာတင္ထားခဲ့တဲ့ Button ကုိလွမ္းခ်ိတ္ရပါမယ္။

- ယင္း Button ကုိႏွိပ္လုိက္ရင္ ျဖစ္ခ်င္တဲ့ action တစ္ခုခု (ဥပမာ ခလုတ္ကုိႏွိပ္လုိက္ရင္ Alert Box ေပၚခ်င္တာမ်ိဳး) ကုိ Button Code ရဲ႕ onClick() {} ထဲမွာထည့္ေရးလုိက္ရုံပါပဲ။

ဒီသံုးခ်က္ကုိသိျပီ ၊ ဒီအတုိင္းလုိက္လုပ္မယ္ဆုိရင္ Button သင္ခန္းစာအတြက္ အဆင္ေျပပါျပီ။ ကဲ.. အခုေနာက္ခလုတ္တစ္ခုအတြက္လုပ္ရေအာင္ ။

ဒုတိယခလုတ္ကလည္း ပထမခလုတ္ကုိလုပ္ခဲ့တဲ့ step ေတြအတုိင္းပဲလုပ္ရမွာပါ။
အရင္ဆုံး Screen Layout ေပၚကုိ Form widget ထဲက Button တစ္ခုကုိ Drag & Drop ဆြဲထည့္ပါ။ (အေပၚမွာတုန္းက လုပ္ခဲ့တဲ့ Button ရဲ႕ေအာက္ဘက္ေနရာနားေလာက္မွာ ထည့္ၾကည့္ပါ ။ ဘယ္ေနရာထည့္ထည့္ရပါတယ္)





ျပီးရင္ ခုနကလုိပဲ ယင္း Button ေပၚကုိ Click တစ္ခ်က္ႏွိပ္ပါ။ ေဘးမွာ Button နဲ႕သက္ဆုိင္တဲ့ properties ေပၚလာပါမယ္။

ယင္း Properties box ထဲက ID ရဲ႕ေဘးကအကြက္ကုိ click ၂ ခ်က္ႏွိပ္ပါ။ id/ ကုိခ်န္ျပီး ေနာက္က button1 ဆုိတာကုိဖ်က္ပစ္ပါ။


ျပီးရင္ ၾကိဳက္ႏွစ္သက္ရာ ID name တစ္ခုခုေပးလုိက္ပါ။ ဥပမာ - b2
(အေပၚ button မွာတုန္းက သတ္မွတ္ခဲ့တဲ့ ID နဲ႕မတူေအာင္ေပးရပါမယ္။ ID ခ်င္းတူလုိ႕မရပါ)

Button ကုိ ID name ေပးျပီးျပီဆုိရင္ေတာ့ ADT ရဲ႕ menu bar က File ထဲကုိ၀င္ပါ ။ ျပီးရင္ save ပါ။ (ID တစ္ခါသတ္မွတ္ျပီးတုိင္း တစ္ခါ save ရပါမယ္)


ျပီးရင္ Screen layout နဲ႕သက္ဆုိင္တဲ့ java file ထဲကုိ၀င္ျပီး ယခု Screen Layout ေပၚမွာတင္ထားခဲ့တဲ့ Button ကုိ Java file ကေန Button code အသုံးျပဳျပီးလွမ္းခ်ိတ္ရပါမယ္။ သူနဲ႕သက္ဆုိင္ရာ java file ကုိရွာဖုိ႕ ကုိယ့္ရဲ႕ Project ထဲက src folder ထဲကုိ၀င္ပါ။ ေလာေလာဆယ္ေတာ့  MainActivity.java တစ္ဖုိင္ပဲရွိပါဦးမယ္။ အဲဒီ MainActivity.java ဖုိင္ထဲကုိ၀င္ပါ။ setContentView....() ဆုိတဲ့စာေၾကာင္းကုိလုိက္ရွာပါ။ အဲဒီမွာ setContentView(R.Layout.MainActivity) ဆုိတာမ်ိဳးေတြ႕ရင္ ဒီ MainActivity.java ဖုိင္ဟာ ကြ်န္ေတာ္တုိ႕ခုနက Button တင္ထားခဲ့တဲ့ Screen Layout ျဖစ္တဲ့ activitymain.xml နဲ႕ခ်ိတ္ဆက္ထားတယ္လုိ႕ ယူဆရပါမယ္။ အဲလုိခ်ိတ္ဆက္ထားတဲ့ဖုိင္မွာသာ ယင္း screen နဲ႕သက္ဆုိင္တဲ့ code ကုိ၀င္ေရးလုိ႕ရမွာပါ။ အခု ကြ်န္ေတာ္တုိ႕က MainActivity.java file ထဲမွာ
ဟုိဘက္ Screen Layout က Button ကုိလွမ္းခ်ိတ္ဖုိ႕ Button Code ထည့္ပါမယ္။ Button Code ကေတာ့ ေအာက္ပါအတုိင္းပါ။

final Button bb2=(Button)findViewById(R.id.button1);
       
       
         bb2.setOnClickListener(new View.OnClickListener() {
             public void onClick(View v) {
                 // Perform action on click

              
   
             }
         });




(ယခု code သည္နမူနာျပထားျခင္းသာျဖစ္ေသာေၾကာင့္ ကုိယ့္ project ထဲက id name ေတြနဲ႕ကုိက္ေအာင္ျပန္ျပင္ေပးပါ။ ဥပမာ - အေပၚက code ထဲမွာ R.id.button1 လုိ႕ေပးထားတာကုိျမင္ရမွာပါ။ button1 ေနရာမွာ ကြ်န္ေတာ္တုိ႕ screen layout ဘက္ျခမ္းမွာအသစ္ထပ္ေဆာက္ခဲ့တဲ့ Button ရဲ႕ ID ကုိထည့္ေပးရမွာပါ။ ဥပမာ - R.id.b2)

အေပၚမွာျပထားတဲ့ Button code မွာဆုိရင္ final button bb2 လုိ႕ေပးခဲ့တာကုိေတြ႕ရပါမယ္။ ဘာလုိ႕ bb2 လုိ႕ေပးခဲ့ရသလဲဆုိရင္ ကြ်န္ေတာ္တုိ႕ အေပၚမွာ ပထမလုပ္ခဲ့တဲ့ Button တုန္းက final button bb1 လုိ႕သတ္မွတ္ခဲ့ျပီးသားပါ။ ဒါေၾကာင့္ ယခု Button အတြက္က်ေတာ့ name မတူေအာင္ေျပာင္းေပးလုိက္တာပါ။ အေပၚမွာတုန္းက ထည့္ခဲ့တဲ့ Button Code ရဲ႕ေအာက္တစ္ေၾကာင္းေနရာမွာထည့္ရပါမယ္။




ထည့္ျပီးသြားျပီဆုိရင္Button ကုိႏွိပ္လုိက္တဲ့အခါျဖစ္ခ်င္တဲ့ Action code ကုိထည့္ပါမယ္။ ဥပမာအေနနဲ႕ ခလုတ္ကုိႏွိပ္လုိက္တဲ့အခါ "I am Kyaw Kyaw" ဆုိတဲ့စာသားေလး Screen ရဲ႕ေအာက္ေျခနားေလာက္မွာ Message အေနနဲ႕ေပၚလာေအာင္ေရးၾကည့္ရေအာင္ ။ ယခုထည့္ထားခဲ့တဲ့ Button Code ထဲမွာ onClick() {} ဆုိတဲ့ function ပါပါတယ္ ။ ယင္း onClick function ထဲကုိ message ေပၚေစတဲ့ code ကုိသြားထည့္ရမွာပါ။  Message ေပၚေစတဲ့ code ကေတာ့ေအာက္ပါအတုိင္းပါ။

Toast.makeText(getApplicationContext(), "msg msg", Toast.LENGTH_SHORT).show();


ေပၚေစခ်င္တဲ့စာသားကုိေတာ့ "" double quote ႏွစ္ခုၾကားမွာသြားျပင္ပါ။ ဥပမာ-

Toast.makeText(getApplicationContext(), "I am KyawKyaw", Toast.LENGTH_SHORT).show();

ယင္း code ကုိ Button Code ရဲ႕ onClick () Function ထဲမွာသြားထည့္ေပးရမွာပါ။ ေအာက္ပါအတုိင္းပါ။



ျပီးရင္ေတာ့ ဖုန္း (သုိ႕) Emulator နဲ႕ run ၾကည့္လုိ႕ရပါျပီ။

ပထမခလုတ္ကုိႏွိပ္ရင္ေတာ့ "I am MgMg" လုိ႕ေပၚပါလိမ့္မယ္။


ဒုတိယခလုတ္ကုိႏွိပ္ရင္ေတာ့ "I am KyawKyaw" လုိ႕ေပၚပါလိမ့္မယ္။



ေနာက္ထပ္ ခလုတ္သုံးခု ၊ ေလးခုစသည္ျဖင့္ ကုိယ့္ဘာသာ အိမ္စာလုပ္ၾကည့္ပါဦး။

အိမ္စာအေနနဲ႕ ခလုတ္ေလးခုပါတဲ့ app တစ္ခုေရးျပီး myanmarmobileapp@gmail.com သုိ႕အိမ္စာေပးပုိ႕ရပါမယ္။ ပထမခလုတ္ကုိႏွိပ္ရင္ 1 လုိ႕ေပၚေစခ်င္ပါတယ္။ ဒုတိယခလုတ္ကုိႏွိပ္ရင္ 2, တတိယခလုတ္ကုိႏွိပ္ရင္ 3 ၊ စတုထၳခလုတ္ကုိႏွိပ္ရင္ 4 စသည္ျဖင့္ေပၚေပးပါ။


0 comments:

Post a Comment



Myanmar Android Development မွ Android Dev Lessons မ်ားကုိ အျခား website မ်ား ၊ ျပင္ပစာအုပ္စာေပမ်ားတြင္ကူးယူေဖာ္ျပျခင္းမျပဳ ၾကပါရန္အသိေပးအပ္ပါသည္။