WPF කුප්පි 2 - (Hello World WPF)

හරි.. අපි දැන් ඉතා සරල WPF application එකක් හදමු. අමාරු නෑ ..... හරි ලේසියි.

හරි....මුලින්ම Expression Blend වලින් WPF application එක හදන්නම්. ඊට පස්සේ ඒ application එක Visual Studio එකෙන් කොහොමද කරන්නේ කියල බලමු.

1. මුලින්ම Expression Blend, open කර ගන්නකෝ.
2. දැන් අලුත් project එකක් හදන්න.

File -> New Project... හෝ  Ctrl+Shift+N ගහන්න.

Figure 1

    3.  හරි... දැන් පල්ලෙහා තියෙනවා වගේ අලුත් window එකක්  එයි.

Figure 2

මම කරලා තියෙන විදියට WPF Application එකක් select කර ගන්න.

Name:       මේක තමයි අපි හදන්න යන WPF Project එකේ නම. කැමති නමක් දෙන්න පුළුවන්.

Location:   WPF Project එක save වෙන තැන.

Language:  Coding කරන language එක. Visual C sharp හෝ Visual Basic

හරි... දැන් OK button එක click කරන්න.

    4.  දැන් WPF Application එකේ Main Window එකට අලුත් button එකක් add කරමු. ඒකෙ content එක "Blend Button" කියල වෙනස් කරන්න.

• button එකක් add කරන්නේ මෙහෙමයි.

මුලින්ම වම පැත්තේ තියෙන button icon එක select කරන්න (Figure 3). ඊට පස්සේ main Window eke ඒකෙ click කරලා button එක හදන්න (Figure 4).

Figure 3

Figure 4

• button ඒකෙ content එක වෙනස් කරන්නේ මෙහෙමයි.

මුලින්ම වම් පැත්තේ තියෙන selection tool එක select කරලා (Figure 5) ඊට පස්සේ button එක මත double click කරලා content එක වෙනස් කරන්න (Figure 6).

   

Figure 5

Figure 6

                    

    හරි.... අපි දැන් අපේ application ඒකේ User Interface එක හදල ඉවරයි. දැන් අපි බලමු "Blend Button" button එක click කලාම message එකක් display වෙන්න හදන්නේ කොහොමද කියල. ඒ කියන්නේ button ඒකේ click event එක trigger කරන්නේ කොහොමද කියල බලමු.

    5.  "Blend Button" එක select කරලා දකුණු පැත්තේ කෙලවරේ තියෙන "Events" icon එක click කරන්න (Figure 7).

                                                                               Figure 7

    6. ඊට පස්සේ click event ඉස්සරහ තියෙන කොටුවේ BlendBtn_Click කියල නමක් දීල Enter ඔබන්න. (Figure 8)

Figure 8

දැන් අලුත් file එකක් open වෙයි. මේකට කියන්නේ  Code Behind File එක කියල. (Figure 9)

Figure 9

 
    7. දැන් අපි message එකක් display කරවමු.

මේ code එක BlendBtn_Click එක ඇතුලට දාන්න.

MessageBox.Show("Hi Blend Button");

    8. දැන් project එක Run කරන්න.

Project -> Run Project (F5 or Ctrl+F5 or Fn+F5)

Run කලාම එන window එකේ button එක click කලාම message එකක් display වෙයි. (Figure 10)

                                                                                Figure 10

ලේසියි නේ......

ඉවරයි කියල කිව්වට ඉවරම නෑ. දැන් අපි Visual Studio එකෙන් මේ project එකම open කරලා ඊට පස්සේ Visual Studio එකෙන් button එකක් add කරලා message box එකක් display කරවමු. ඒකත් ඉතින් මහා ලොකු වැඩක් නෙමේ.

    9. Project එක Visual Studio වලින් open කරන්න.

• මුලින්ම Project එක තියෙන folder එක කර ගන්න. (Figure 11)

Figure 11

• ඊට පස්සේ myHelloWorld.sln කියන file එක Visual Studio වලින් open කරන්න.

    10. දැන් අලුත් button එකක් add කරන්න. 

Visual Studio එකේ වම් පැත්තේ තියෙන toolbox එකෙන් button එකක් drag and drop කලා නම් හරි. (Figure 12)

Figure 12

    11. ඒ button එකේ content එක "VS Button" කියල වෙනස් කරන්න.

ඒ button එක  select කරලා ඊටපස්සේ property window (දකුණු අත පැත්තේ තියෙන්නේ) එකේ Common category එකේ content එක ඉස්සරහ කොටුවේ "VS Button" කියල දාන්න. එතකොට හරි. (Figure 13)

Figure 13

    12. දැන් මේ button එක මත double click කරන්න. එතකොට Code Behind File ඒකට යයි. දැන් "button1_Click" කියන function එක ඇතුලේ පල්ලෙහා තියෙන code එක දාන්න. (Figure 14)

MessageBox.Show("Hi VS Button");

Figure 14

    13. දැන් project එක Run කරන්න.

(Debug -> Start Debugging or F5 or fn+f5) or   

       

Figure 15

පල්ලෙහා තියෙන්නේ Run  කලාම එන එක. (Figure 16)

Figure 16

හුරේ............. වැඩේ ගොඩ.......... මේ Hello World WPF Applicaton එකෙන් චූටි අවබෝධයක් එන්න ඇති. මේක තම ආරම්භය. මේ post එකේදී මම කියල දුන්නේ කොහොමද User Interfaces හදන්නේ කියල. ඉස්සරහදි මම කියලා දෙන්නම් කොහොමද ලස්සන, professional User Interfaces හදන්නේ  කියල. ඊට අමතරව Database එකකින් Data Manipulate කරන හැටිත් කියල දෙන්නම්. එතකං මේ ඩිංග හොදට තේරුම ගන්නකො.