Netbeans/C2/Handling-Images-in-a-Java-GUI-Application/Gujarati

From Script | Spoken-Tutorial
Revision as of 20:12, 16 June 2014 by Jyotisolanki (Talk | contribs)

Jump to: navigation, search
Time Narration
00.01 નમસ્તે મિત્રો.
00.02 Handling Images in a Java GUI Application using Netbeans IDE પરનાં આ ટ્યુટોરીયલમાં સ્વાગત છે.
00.10 અમે એ માનીને ચાલીએ છીએ કે તમને નેટબીન્સ પર કામ કરવાની સામાન્ય જાણકારી છે.
00.15 સાથે જ એ માનીએ છીએ કે તમે JFrame ફોર્મ પર ટેક્સ્ટ ફીલ્ડો, બટનો, મેનુઓ, વગેરે. મુકવાનું જાણો છો.
00.22 જો નથી, તો કૃપા કરી નેટબીન્સ પર સંદર્ભિત ટ્યુટોરીયલો માટે સ્પોકન ટ્યુટોરીયલ વેબસાઈટની મુલાકાત લો.
00.29 આ ટ્યુટોરીયલમાં, આપણે વિગતમાં જાણીશું ઈમેજો સંભાળવા વિશે
00.34 અને સેમ્પલ GUI એપ્લીકેશનમાં, તેના પર ક્રિયાઓ ભજવવા વિશે.
00.39 આ ડેમોનસ્ટ્રેશન માટે, હું લીનક્સ ઓપરેટીંગ સીસ્ટમ ઉબુન્ટુ આવૃત્તિ 11.04 અને નેટબીન્સ આઈડીઈ આવૃત્તિ 7.1.1 વાપરી રહ્યી છું
00.52 જાવા એપ્લીકેશનમાં હાથે લેવાની અને ઈમેજો એક્સેસ કરવાની પ્રમાણભૂત પધ્ધત એટલે getResource() મેથડ.
00.59 આપણે શીખીશું કે તમારી એપ્લીકેશનમાં ઈમેજોનો સમાવેશ કરવા માટે આઈડીઈ GUI બિલ્ડર વાપરીને કોડ કેવી રીતે ઉત્પન્ન કરવું,
01.07 અને એક સાદી Jframe બનાવીશું જેમાં ઈમેજ દર્શાવનારુ એક Jlabel હશે.
01.13 આ ટ્યુટોરીયલમાં, આપણે શીખીશું -
01.15 એપ્લીકેશન ફોર્મ બનાવવાનું
01.18 ઈમેજ માટે પેકેજ ઉમેરવાનું
01.20 લેબલ પર ઈમેજ દર્શાવવાનું
01.22 માઉસ-ઇવેન્ટ અને પોપ-અપ બનાવવાનું
01.25 એપ્લીકેશન બીલ્ડ કરીને રન કરવી
01.28 હવે ચાલો આપણી સેમ્પલ એપ્લીકેશન બનાવવા માટે IDE પર જઈએ.
01.33 ફાઈલ મેનુમાંથી, New Project (ન્યુ પ્રોજેક્ટ) પસંદ કરો.
01.37 Categories (કેટેગરીઝ) અંતર્ગત, Java (જાવા) પસંદ કરો, Projects (પ્રોજેક્ટ્સ) અંતર્ગત Java Application (જાવા એપ્લીકેશન) પસંદ કરીને Next (નેક્સ્ટ) ક્લિક કરો.
01.46 Project Name (પ્રોજેક્ટ નેમ) ફિલ્ડમાં, ImageDisplayApp (ઈમેજડિસ્પ્લેએપ) ટાઈપ કરો.
01.54 Create Main Class (ક્રિએટ મેઈન ક્લાસ) ચેકબોક્સ સાફ કરો.
01.58 એ વાતની ખાતરી કરી લો કે Set as Main Project (સેટ એઝ મેઈન પ્રોજેક્ટ) ચેકબોક્સ પસંદ કરેલ હોય.
02.03 Finish ક્લિક કરો. તમારા આઈડીઈમાં પ્રોજેક્ટ બની જાય છે.
02.08 આ વિભાગમાં, આપણે Jframe (જેફ્રેમ) ફોર્મ બનાવીને તેમાં Jlabel (જેલેબલ) ઉમેરીશું.
02.14 ચાલો સૌપ્રથમ હું Jframe (જેફ્રેમ) ફોર્મ બનાવું.
02.17 Projects (પ્રોજેક્ટ્સ) વિન્ડોમાં, ImageDisplayApp (ઈમેજડિસ્પ્લેએપ) નોડ વિસ્તૃત કરો.
02.23 Source Packages (સોર્સ પેકેજીસ) નોડ પર જમણું-ક્લિક કરો અને પસંદ કરો New (ન્યુ), Jframe form (જેફ્રેમ ફોર્મ).
02.30 Class Name (ક્લાસ નેમ) ફિલ્ડમાં, ImageDisplay (ઈમેજડિસ્પ્લે) ટાઈપ કરો.
02.37 Package (પેકેજ) ફિલ્ડમાં, org.me.myimageapp ટાઈપ કરો.
02.45 અને Finish ક્લિક કરો.
02.48 હવે ચાલો Jlabel (જેલેબલ) ઉમેરીએ.
02.52 આઈડીઈનાં જમણી બાજુએ આવેલ, પેલેટમાં Label (લેબલ) કમ્પોનેંટ પસંદ કરો અને તેને Jframe (જેફ્રેમ) પર ડ્રેગ કરો.
03.01 હમણાં માટે, તમારું ફોર્મ કઈક આ પ્રકારનું લાગવું જોઈએ.
03.06 જ્યારે એક એપ્લીકેશનમાં તમે ઈમેજો અથવા અન્ય સ્ત્રોતોનો ઉપયોગ કરો છો, સામાન્ય રીતે તમે સ્ત્રોત માટે એક જુદું જાવા પેકેજ બનાવો છો.
03.15 તમારી લોકલ ફાઈલ સીસ્ટમમાં, પેકેજ એ ફોલ્ડરને અનુલક્ષે છે.
03.19 Projects (પ્રોજેક્ટ્સ) વિન્ડોમાં, org.me.myimageapp નોડ પર જમણું-ક્લિક કરો અને New > Java Package (ન્યુ > જાવા પેકેજ) પસંદ કરો.
03.30 New Package Wizard (ન્યુ પેકેજ વિઝાર્ડ) માં, org.me.myimageapp આગળ .resources ટાઈપ કરો.
03.40 જેથી હવે નવા પેકેજનું નામ org.me.myimageapp.resources કહેવાશે.
03.47 Finish ક્લિક કરો.
03.49 Projects (પ્રોજેક્ટ્સ) વિન્ડોમાં, જ્યારે તમે ઈમેજ ઉમેરો છો ત્યારે, તમને ઈમેજ org.me.myimageapp.resources પેકેજ અંતર્ગત દેખાવી જોઈએ.
03.59 આ એપ્લીકેશનમાં, ઈમેજ Jlabel (જેલેબલ) કમ્પોનેંટમાં બેસાડવામાં આવશે.
04.04 ચાલો હવે લેબલ પર ઈમેજ ઉમેરીએ.
04.08 GUI designer (જીયુઆઈ ડીઝાઈનર) માં, તમારા ફોર્મ પર ઉમેરાયેલું લેબલ પસંદ કરો.
04.14 વિન્ડોની જમણી બાજુએ આવેલ, પેલેટ નીચે, Properties (પ્રોપર્ટીઝ) વિન્ડોમાં સ્ક્રોલ કરીને, Icon (આઇકોન) પ્રોપર્ટી પર જાવ.
04.23 ellipsis (એલીપ્સીસ) એટલે કે જમણી બાજુએ આવેલ ત્રણ બિંદુઓ (...) પર ક્લિક કરો.
04.30 Icon (આઇકોન) પ્રોપર્ટી ડાયલોગ બોક્સમાં, Import to Project (ઈમ્પોર્ટ ટુ પ્રોજેક્ટ) પર ક્લિક કરો.
04.34 ફાઈલ પસંદ કરવા માટે, તમને જોઈતી ઈમેજ જે ફોલ્ડરમાં છે તે ફોલ્ડર પર જાવ.
04.42 Next ક્લિક કરો.
04.45 વિઝાર્ડનાં Select Target Folder (સિલેક્ટ ટાર્ગેટ ફોલ્ડર) પુષ્ઠમાં, Resources (રીસોર્સીઝ) ફોલ્ડર પસંદ કરો.
04.49 અને Finish ક્લિક કરો.
04.52 જેમ તમે Finish ક્લિક કરશો, આઈડીઈ તમારા પ્રોજેક્ટમાં ઈમેજ કોપી કરશે.
04.57 તેથી, જ્યારે તમે એપ્લીકેશન બનાવીને રન કરો છો ત્યારે, ઈમેજ વિતરિત કરી શકનારી JAR (જાર) ફાઈલમાં સમાવિષ્ટ થાય છે.
05.07 અહીં OK પર ક્લિક કરો.
05.11 And right click on your project node and select Clean and Build option.
05.18 You can now go to the Files menu, and under the build folder,
05.29 under dist folder, you can see the jar file.
04.33 It generates the code in the imagedisplay class to access the image.
05.38 It also displays your image on the label in the Design view of your form.
05.43 At this point, you can do some simple things to improve the appearance of the form.


05.48 In the Properties window, select the Text property
05.56 and delete jLabel1.


06.04 That value was generated by the GUI Builder as display text for the label.
06.10 However, you are using the label to display an image rather than text.


06.15 So this text is not needed.


06.18 Now let us drag the label to center it on the form.
06.26 In the GUI Designer, click the Source tab.


06.30 Scroll down to the line that says Generated Code.
06.33 And click the plus sign (+) to the left of the Generated Code line to display the code that the GUI Designer has generated.
06.42 Here, the keyline is this.


06.49 Since you have used the Property editor for jLabel1s icon property, the IDE has generated the setIcon method.
06.57 The parameter of that method contains a call to the getResource() method on an anonymous inner class of ImageIcon.
07.10 Once your image has been added, in the Design view right-click on the image.


07.19 Click on Events > Mouse > mouseClicked.
07.24 The view is switched to the Source mode.
07.28 Here you can add the code to customize your action on a mouse click.
07.33 Let me add a few lines of code to generate a pop-up when the image is clicked in the GUI.


08.00 I have now entered a few lines of code to generate the pop-up.


08.05 First I have created a new Jframe for the pop-up.


08.12 And I have set the default close operation.


08.15 And finally provided the text for the pop-up.
08.24 After adding these lines of code, let us import the necessary packages by adding two statements at the beginning of the file.
08.36 Include: import javax.swing.*;


08.45 and import java.awt.*;


08.53 This will import the necessary packages required for this program.
08.59 ચાલો હવે એપ્લીકેશન બીલ્ડ કરીને રન કરીએ.
09.02 ઈમેજ એક્સેસ કરવા માટે અને દર્શાવવા માટે અમે કોડ ઉત્પન્ન કર્યા છે.
09.07 ઈમેજ એક્સેસ થાય છે કે એ વાતની ખાતરી કરવા માટે ચાલો એપ્લીકેશન બીલ્ડ કરીને રન કરીએ.
09.12 પહેલા, આપણને પ્રોજેક્ટનાં Main class (મેઈન ક્લાસ) ને સુયોજિત કરવાની જરૂર છે.
09.16 જ્યારે તમે Main class (મેઈન ક્લાસ) ને સુયોજિત કરો છો, આઈડીઈ એ જાણે છે કે પ્રોજેક્ટ રન કરતી વખતે કયા ક્લાસને રન કરવો.
09.21 વધારામાં, એપ્લીકેશન બીલ્ડ થતી વખતે JAR ફાઈલમાં Main class આ ઘટક તૈયાર થાય છે આ વાતની પણ ખાતરી થાય છે.
09.33 અહીં પ્રોજેક્ટ વિન્ડોમાં આવેલ ImageDisplayApp પ્રોજેક્ટ નોડ પર જમણું-ક્લિક કરો, અને Properties (પ્રોપર્ટીઝ) પસંદ કરો.
09.41 Project Properties (પ્રોજેક્ટ પ્રોપર્ટીઝ) ડાયલોગ બોક્સમાં, ડાબી બાજુ આવેલ Run (રન) કેટેગરી પસંદ કરો.
09.47 Main Class (મેઈન ક્લાસ) ફિલ્ડ આગળ આવેલ, Browse (બ્રાઉઝ) બટન ક્લિક કરો.
09.51 org.me.myimageapp.ImageDisplay પસંદ કરીને Select Main Class (સિલેક્ટ મેઈન ક્લાસ) પર ક્લિક કરો
10.01 અહીં OK ક્લિક કરો.
10.05 હવે Project (પ્રોજેક્ટ) નોડ પર જમણું-ક્લિક કરીને, Clean & Build (ક્લીન એન્ડ બીલ્ડ) પસંદ કરો.
10.11 તમે Files વિન્ડોમાં, એપ્લીકેશનની Build (બીલ્ડ) પ્રોપર્ટીઝ જોઈ શકો છો.
10.20 Build (બીલ્ડ) ફોલ્ડરમાં કમ્પાઈલ કરેલ ક્લાસ હોય છે.
10.23 dist (ડિસ્ટ) ફોલ્ડરમાં એક્ઝીક્યુટ કરી શકાય એવી JAR (જાર) ફાઈલ હોય છે જેમાં કમ્પાઈલ કરેલ ક્લાસનો અને ઈમેજનો સમાવેશ હોય છે.
10.32 હવે ટૂલ બારમાંથી Run (રન) પસંદ કરો.
10.34 ઈમેજ સહીત આપણો આઉટપુટ વિન્ડો ખુલે છે.
10.39 હવે હું આ ઈમેજ પર ક્લિક કરીશ.
10.42 અને ટોંચે તમે પોપ-અપ જોઈ શકો છો, જે ઈમેજનું વિવરણ દર્શાવે છે.
10.50 હવે, એસાઈનમેંટ!
10.54 આ ટ્યુટોરીયલમાં દર્શાવ્યા પ્રમાણે, ચાર ઈમેજો સહીત બીજું એક GUI બનાવો,
11.01 દરેક ઈમેજ માટે, વિભિન્ન ઇવેન્ટો સ્પષ્ટ કરો જેમ કે કીબોર્ડ ઇવેન્ટ, માઉસ-મોશન ઇવેન્ટ, માઉસ-ક્લિક ઇવેન્ટ, માઉસ-વ્હીલ ઇવેન્ટ.
11.12 મેં પહેલાથી જ એસાઈનમેંટ બનાવી લીધો છે.
11.17 ચાલો એસાઈનમેંટ પ્રોજેક્ટને રન કરીએ.
11.20 તમારો એસાઈનમેંટ આ પ્રકારે દેખાવવો જોઈએ.
11.26 મેં અહીં મારા એસાઈનમેંટ માટે કીબોર્ડ-ઇવેન્ટો અને માઉસ ઇવેન્ટો બનાવ્યા છે.
11.34 તો, સારાંશમાં,
11.36 આપણે Jframe (જેફ્રેમ) ફોર્મ બનાવ્યું
11.39 ઈમેજ માટે પેકેજ ઉમેર્યું
11.41 ઈમેજને લેબલ પર દર્શાવી
11.44 અને સાથે જ બનાવ્યા માઉસ ઇવેન્ટો અને પોપ-અપ
11.49 સ્ક્રીન પર દર્શાવેલ લીંક પર ઉપલબ્ધ વિડીયો નિહાળો.
11.53 તે સ્પોકન ટ્યુટોરીયલ પ્રોજેક્ટનો સારાંશ આપે છે.
11.56 જો તમારી પાસે સારી બેન્ડવિડ્થ ન હોય તો, તમે વિડીયો ડાઉનલોડ કરીને જોઈ શકો છો.
12.02 સ્પોકન ટ્યુટોરીયલ પ્રોજેક્ટ ટીમ સ્પોકન ટ્યુટોરીયલોનાં ઉપયોગથી વર્કશોપોનું આયોજન કરે છે.
12.07 જેઓ ઓનલાઈન પરીક્ષા પાસ કરે છે તેઓને પ્રમાણપત્રો આપે છે.
12.11 વધુ વિગતો માટે contact@spoken-tutorial.org પર લખો
12.19 સ્પોકન ટ્યુટોરીયલ પ્રોજેક્ટ ટોક ટુ અ ટીચર પ્રોજેક્ટનો એક ભાગ છે
12.23 જેને આઈસીટી, એમએચઆરડી, ભારત સરકાર મારફતે શિક્ષણ પર નેશનલ મિશન દ્વારા આધાર અપાયેલ છે
12.30 આ મિશન પરની વધુ માહિતી spoken-tutorial.org/NMEICT-Intro પર ઉપલબ્ધ છે
12.42 આ ટ્યુટોરીયલ માટે યોગદાન IT for Change દ્વારા અપાયું છે
12.46 અમને જોડાવાબદ્દલ આભાર. આઈઆઈટી બોમ્બે તરફથી હું, જ્યોતી સોલંકી વિદાય લઉં છું.

Contributors and Content Editors

Jyotisolanki, PoojaMoolya