Netbeans/C2/Designing-GUI-for-Sample-Java-Application/Hindi

Time	Narration
00:01	नमस्कार दोस्तों।
00:02	Netbeans का उपयोग करके GUIs के निर्माण पर ट्यूटोरियल में स्वागत है।
00:06	इस ट्यूटोरियल में, हम Netbeans की सबसे आकर्षक सुविधाओं में से एक को देखेंगे, जो इसका GUI निर्माता है।
00:13	GUI के निर्माण के लिए Netbeans क्या प्रदान करता है?
00:16	यह आपको प्रदान करता है, जो आपने अपने GUI को बनाते समय देखा।
00:21	इसके अलावा यह आपको, आपके लेआउट को बनाने के लिए, कंपोनेंट को खींचने और रखने के लिए एक आसान इंटरफेस देता है।
00:27	यह कंपोनेंट Palette के साथ आता है,, जिसमें पूर्व संस्थापितAWT और स्विंग कंपोनेंट्स हैं।
00:33	हम बस कुछ ही मिनटों में पूर्ण GUI एप्लिकेशन का निर्माण करने के लिए इस शक्तिशाली visual एडिटर का उपयोग करेंगे।
00:39	इस प्रदर्शन के लिए मैं एक सिस्टम का उपयोग कर रहा हूँ जिसमें हैं
00:43	लिनक्स ऑपरेटिंग सिस्टम ऊबुंटू वर्जन v11.04
00:46	और Netbeans IDE वर्जन v7.1.1
00:50	संस्थापन और आवश्यकताओं पर अधिक जानकारी के लिए, कृपया पिछले ट्यूटोरियल को देखें।
00:56	इस ट्यूटोरियल में हम सीखेंगे...
00:58	फॉर्स एडिटर उपयोग करना
01:00	सोर्स एडिटर
01:02	पैलेट, इंस्पेक्टर, और प्रॉपर्टीज विशेषताएँ
01:05	event handlers (घटना संचालकों) को जोड़ना।
01:07	और अपने एप्लिकेशन को कंपाइल औऱ रन करना भी।
01:10	शुरू करते हैं, और इस ट्यूटोरियल में एक साधारण Account balance एप्लिकेशन बनाते हैं।
01:15	इस एप्लिकेशन के लिए हमें सक्षम होना चाहिए,
01:18	खाते में क्रेडिट हुई राशि को इनपुट करने में।
01:21	राशि को खाते से डेबिट करने में।
01:24	और अंतिम शेषराशि की गणना करने में।
01:26	हम अपने एप्लिकेशन को अधिक आकर्षक बनाने के लिए तस्वीर भी जोड़ेंगे।
01:31	आसान और तेज नेविगेशन के लिए ऊपर मेन्यू बार भी जोड़ेंगे।
01:35	अब netbeans पर जाएँ और नए प्रोजेक्ट बनाने के साथ शुरू करें।
01:40	File मेन्यू से New Project > चुनें और Java Application चुनें, फिर Next.
01:49	और अपने प्रोजेक्ट को नाम दें।
01:51	मैं अपने प्रोजेक्ट को Account balance. दूँगा।
01:58	मेन क्लास न बनाएँ लेकिन इसे मेन प्रोजेक्ट के रूप में सेट करें।
02:02	Finish पर क्लिक करें,' जो आपके IDE में नया प्रोजेक्ट बनाना चाहिए।
02:07	अब File menu में File पर जाएँ और New File चुनें।
02:15	Categories से Swing GUI फॉर्म चुनें
02:18	और File Type के अंदर Jframe Form चुनें।
02:21	Next क्लिक करें।
02:24	मैं इसे AccountBalance कहूँगा।
02:29	लेकिन आप इसे अपने इच्छानुसार नाम दे सकते हैं।
02:33	एक बार आप Finish पर क्लिक करते हैं, तो यह आपको मुख्य डिजाइन क्षेत्र में ले जाता है।
02:39	GUI निर्माता के साथ परिचित होते हैं।
02:43	यहाँ राइट पर palette है।
02:45	इसमें पूर्व संस्थापित स्विंग और AWT कंपोनेंट्स शामिल हैं।
02:49	यहाँ palette के नीचे Properties विंडो है।
02:53	यह आपको, आपके द्वारा चुने गए कंपोनेंट्स के प्रॉपर्टीज को दर्शाता है ।
02:58	यहाँ बाईं तरफ navigator या inspector है।
03:01	जो आपको वह कंपोनेंट्स दिखाता है, जो फ्रेम में जोड़े गये हैं।
03:05	यहाँ वर्कस्पेस पर डिजाइन मोड में
03:08	यहाँ ऊपर Source बटन है।
03:11	जब आप इस पर क्लिक करते हैं, यह आपको सोर्स कोड पर ले जाता है।
03:15	जैसे आप डिजाइन करने के लिए कंपोनेंट्स को जोड़ेंगे,
03:18	यह समरुपी सोर्स कोड लेता है और इसे यहाँ सोर्स के लिए जोडता है।
03:23	Design मोड पर वापस जाएँ और देखें कि आज हम किन कंपोनेंट्स का उपयोग करेंगे।
03:28	हमारे एप्लिकेशन बनाने के लिए
03:31	हम palette से कुछ कंपोनेंट्स का उपयोग करेंगे, जैसे Buttons, Labels, Panels, Tabbed pane आदि ।
03:38	अब Palette से swing Containers के अंदर TabbedPane चुनें।
03:45	Tabbed Pane चुनें और form पर क्लिक करें।
03:50	यह आपको एक Tabbed frame देना चाहिए। आप इसका अपने माउस से आकार परिवर्तित कर सकते हैं।
03:58	अब Palette पर वापस जाएँ और Panel चुनें।
04:02	और फिर से अपने फ्रेम पर क्लिक करें।
04:06	यह आपको एक टैब देना चाहिए।
04:09	वापस जाएँ औऱ अन्य Panel चुनें। और फिर से form पर क्लिक करें।
04:14	वह आपको कुल 2 टेब्स देगा।
04:17	अब आप टेब पर डबल क्लिक करके या टेब पर राइट क्लिक करके और Edit Text ऑप्शन चुनकर टेब का नाम बदल सकते हैं।
04:29	मैं Image के रूप में पहले टेब को कॉल करूँगा और दूसरे टेब का नाम बदलकर Balance नाम दूँगा।
04:37	अब Palette पर जाएँ और swing Controls मेन्यू से labels जोडें।
04:43	Swing Controls से Label चुनें और यहाँ अपने फार्म में इसे जोड़ें।
04:48	हम अपने एप्लिकेशन के लिए 6 labels की आवश्याकता है।
04:54	अब मैंने अपने फॉर्म में 6 labels जोड़ दिये हैं।
04:58	आप उनपर क्लिक करके उन्हें स्थान दे सकते हैं और अलाइन कर सकते हैं।
05:02	और स्थान बदलने या उन्हें फिर से अलाइन करने के लिए माउस का उपयोग भी कर सकते हैं।
05:06	अब label पर टेक्स्ट बदलने के लिए,
05:08	आप या तो इस पर डबल क्लिक कर सकते हैं या इस पर राइट क्लिक कर सकते हैं।
05:12	और Edit Text ऑप्शन चुन सकते हैं।
05:14	अब labels का नाम बदलें।
05:16	मैं सबसे पहले को Initial Amount नाम दे रहा हूँ
05:22	दूसरे label को Credit Amount.
05:30	तीसरे को Debit amount
05:35	और चौथे को Balance कहूँगा।
05:41	प्रारंभ में, हम initial amount Rs 5000 सेट करेंगे।
05:48	एक बार हम balance की गणना करते हैं, हम इसे इस level पर रख सकते हैं।
05:53	किंतु अभी के लिए हम इसे stars के रूप में बना देंगे।
06:01	अब Palette पर वापस जाएँ और TextField चुनें और हम credit amount और debit amount के आगे टेक्स्ट फिल्ड्स जोड़ेंगे।
06:16	हमें Textfield स्थान को भी खाली छोड़ना चाहिए।
06:20	मैं टेक्स्ट को एडिट करता हूँ और यहाँ मौजूदा टेक्स्ट को हटा देता हूँ।
06:27	अब माउस का उपयोग करके इसका आकार परिवर्तन करें।
06:35	एक बार आपने यह किया, आप palette पर वापस जा सकते हैं और Button चुनें।
06:42	अपने फ्रेम के नीचे बटन जोड़ें और
06:48	आप इस पर राइट क्लिक करके लेबल बदल सकते हैं।
06:53	Edit text ऑप्शन चुनें और इसे Get Balance नाम दें।
06:58	अब यह हमारा GUI है।
07:01	अब Image टेब (tab1) पर जाएँ औऱ एक इमेज जोड़ें।
07:05	ऐसा करने के लिए Palette पर वापस जाएँ ।
07:08	औऱ अन्य Label चुनें, और इसे पेनल पर रखें।
07:13	अब palette के नीचे Properties विंडो से, icon प्रॉप्रटी खोजें और यहाँ दाईं ओर 3 डॉट्स पर क्लिक करें।
07:26	icons properties विंडो खुलती है।
07:28	यहाँ ऑप्शन External Image चुनें, फिर यहाँ दाईं ओर पर 3 डॉट्स(...) पर क्लिक करें।
07:35	और इमेज देखें, जिसे आप अपने एप्लिकेशन के लिए शामिल करना चाहते हैं।
07:41	मैंने यहाँ इमेज चुन ली है। OK पर क्लिक करें।
07:48	माउस का उपयोग करके इसका स्थान बदलें।
07:51	आप यहाँ इस पर डबल क्लिक करके लेबल पर टेक्स्ट हटा सकते हैं और टेक्स्ट को हटाएँ।
07:59	अब हमने इमेज जोड़ दी है।
08:02	अपने GUI में मेन्यू जोड़ते हैं।
08:05	palette पर जाएँ और swing मेन्यूज के अंदर Menu bar ऑप्शन चुनें।
08:12	Menu Bar चुनें और पेनल के शीर्ष पर क्लिक करें।
08:17	डिफॉल्ट रूप से यहाँ पहले ही दो मेन्यू लेबल्स File और Edit हैं।
08:22	Edit text पर डबल क्लिक करें और इसे Help नाम दें।
08:28	आप फाइल के अंदर सबमेन्यू भी जोड़ सकते हैं।
08:32	अब बाईं ओर Inspector या navigator में, JMenu1 पर राइट क्लिक करें।
08:39	Add From Palette ऑप्शन चुनें और Menu Item चुनें।
08:45	वह MenuItem जोड़ना चाहिए।
08:47	आप इसको Exit नाम भी दे सकते हैं।
08:54	अब हमने फाइल मेन्यू के अंदर सबमेन्यू जोड़ दिया है और उस मेन्यू आइटम का नाम भी बदल दिया है।
09:00	अब, हमारा GUI अधिक या कम पूरा हो चुका है।
09:03	अब एक पूर्वावलोकन पर नजर डालते हैं।
09:05	सबसे ऊपर 'Preview Design' बटन पर क्लिक करें।
09:09	वह, अब तक आपने क्या किया है, उसका पूर्वावलोकन दिखाता है।
09:12	यहाँ, बटन्स अभी भी काम नहीं करते हैं।
09:16	लेकिन एक बार आपने कोड में जोड़ दिया, आप कुछ भी कार्य कर सकते हैं।
09:20	पूर्वावलोकन को बंद करें।
09:22	अब, कोड़ जोड़ने से पहले, इनपुट टेक्स्ट फिल्ड्स को उचित वेरिएबल नाम देते हैं।
09:28	Balance टैब पर जाएँ, यहाँ इन टेक्स्ट फिल्ड्स को उचित वेरिएबल नाम दें।
09:34	Inspector में JTextfield1 पर राइट क्लिक करें।
09:40	change variable name चुनें।
09:43	वेरिएबल नाम को Credit amount में बदलें।
09:50	Ok पर क्लिक करें।
09:53	आप यहाँ डिजाइन मोड में टेक्स्टफिल्ड पर राइट क्लिक भी कर सकते हैं।
09:56	Change Variable Name चुनें।
10:00	वेरिएबल नाम debitAmount में बदलें।
10:04	OK पर क्लिक करें।
10:08	मैं इस अंतिम लेबल को कॉल करने जा रहा हूँ, अर्थात resultBalance के रूप में stars टेक्स्टफिल्ड्स।
10:16	Change variable name ऑप्शन फिर से चुनें और वेरिबल को resultBalance में बदलें।
10:23	OK पर क्लिक करें।
10:25	अब एप्लिकेशन के कार्य के लिए कोड को देखते हैं,
10:30	अब यह मेरा सेम्पल कोड है।
10:32	मैं creditAmount से Text()'
10:37	debitAmount से Text() प्राप्त करना चाहता हूँ।
10:39	balance की गणना करें और आखिरीresultBalance में amount रखें।
10:44	यहाँ कोड को कॉपी करें और IDE पर वापस जाएँ।
10:51	अब Get Balance बटन पर राइट क्लिक करें।
10:55	ऑप्शन Events, Action और Action Performed चुनें।
11:00	यह आपको कोड के भाग पर ले जायेगा।
11:03	जहाँ आपने बटन दबाने पर प्रदर्शित कार्य के लिए कोड को लिखना या पेस्ट करना होगा।
11:10	कॉपी किये गये कोड को यहाँ पेस्ट करें।
11:17	कोड को सेव करें और डिजाइन मोड पर वापस जाएँ।
11:22	अब एप्लिकेशन से बाहर निकलने के लिए कोड जोडते हैं।
11:25	मेन्यू आइटम, Exit पर राइट क्लिक करें और Events, Action और Action Performed चुनें।
11:40	यह सोर्स मोड पर जाता है और अब हमने एप्लिकेशन से बाहर निकलने के लिए सफलतापूर्वक कोड लिखा है।
11:46	जो System.exit(1) होने जा रहा है।
11:53	अब कोड को सेव करें और डिजाइन मोड पर वापस जाएँ।
11:57	Exit मेन्यू आइटम के लिए शॉर्टकट भी जोड़ते हैं। MenuItem
12:02	यहाँ जो विंडो खुलता है, उस पर शॉर्टकट ऑप्शन पर डबल क्लिक करें।
12:07	Q और Ctrl दबाएँ और OK पर क्लिक करें।
12:14	अब हमने एप्लिकेशन से बाहर आने के लिए कीबोर्ड शार्टकट के रूप में Ctrl Q सेट किया है।
12:20	इसी के साथ हमारा एप्लिकेशन पूर्ण होता है।
12:23	अब अपने कीबोर्ड पर F6 दबाकर एप्लिकेशन को रन करें।
12:30	रन होने के लिए मेन क्लास पहले ही चयनित है।
12:33	OK पर क्लिक करें।
12:37	और यह यहाँ है। यह हमारा GUI है।
12:40	अब चेक करें।
12:43	balance टैब पर जाएँ, क्रेडिट अमाउंट(राशि) Rs.300/- प्रविष्ट करें।
12:47	और डेबिट अमाउंट Rs.200 प्रविष्ट करें और ' 'Get Balance' दबाएँ।
12:53	यह हमें वर्तमान बकाया राशि देता है।
12:56	अब एप्लिकेशन से बाहर आएँ।
12:58	'File मेन्यू पर जाऊँगा और Exit पर क्लिक करूँगा।
13:02	हम कीबोर्ड पर 'Ctrl Q दबाकर भी एप्लिकेशन से बाहर आ सकते हैं।
13:08	अब एप्लिकेशन पूर्ण होने के साथ यह नियत-कार्य का समय है।
13:14	एक टेंपरेचर कंवर्टर एप्लिकेशन बनाएँ।
13:18	पिछली तरह के टैब्स होने चाहिए।
13:21	पहला Centigrade से Fahrenheit और दूसरा Fahrenheit से Celsius बदलें।
13:27	यह एक इनपुट टेंपरेचर भी लेना चाहिए।
13:30	और बदला हुआ टेंपरेचर प्रदर्शित करना चाहिए।
13:33	इसमें सबसे ऊपर एक मेन्यू बार भी होना चाहिए, जो File और Help ऑप्शन्स दर्शाता है।
13:38	और file मेन्यू के नीचे एप्लिकेशन से बाहर आने के लिए कीबोर्ड शार्टकट के साथ एक Exit आइटम होना चाहिए।
13:46	मैंने नियत-कार्य पहले ही हल कर दिया है।
13:48	देखिए कि यह कैसा दिखना चाहिए।
13:50	मैं अपने नियत-कार्य को रन करने जा रहा हूँ और यह मेरा GUI है।
13:56	अब, इनपुट टेंपरेचर -40 सेल्सियस प्रविष्ट करें और get Fahrenheit पर क्लिक करें।
14:05	एप्लिकेशन सही प्रवर्तित आउटपुट टेंपरेचर देना चाहिए।
14:10	अब एप्लिकेशन से बाहर आने के लिए शार्टकट कीज़ अर्थात Ctrl X का उपयोग करें।
14:18	अतः हम कीबोर्ड शार्टकट के माध्यम से एप्लिकेशन से सफलतापूर्वक बाहर आ गए हैं।
14:25	स्क्रीन पर दिखाए गए लिंक पर उपलब्ध वीडियो देखें।
14:29	यह स्पोकन ट्यूटोरियल प्रोजेक्ट को सारांशित करता है।
14:32	यदि आपके पास अच्छा बैंडविड्थ नहीं है, तो आप इसको डाउनलोड करके भी देख सकते हैं।
14:37	स्पोकन ट्यूटोरियल प्रोजेक्ट टीम, स्पोकन ट्यूटोरियल्स का उपयोग करके कार्यशालाएँ भी चलाती है।
14:42	ऑनलाइन टेस्ट पास करने वालों को प्रमाण-पत्र भी देते हैं।
14:46	अधिक जानकारी के लिए Contact @spoken-tutorial.org पर लिखें।
14:52	स्पोकन ट्यूटोरियल प्रोजेक्ट टॉक-टू-अ टीचर प्रोजेक्ट का हिस्सा है।
14:56	यह भारत सरकार के एमएचआरडी के “आईसीटी के माध्यम से राष्ट्रीय साक्षरता मिशन” द्वारा समर्थित है।
15:03	इस मिशन पर अधिक जानकारी निम्न लिंक पर उपलब्ध है, spoken-tutorial.org/NMEICT-Intro
15:13	यह स्क्रिप्ट प्रभाकर द्वारा अनुवादित है, मैं यश वोरा अब आपसे विदा लेता हूँ।
15:17	हमसे जुड़ने के लिए, धन्यवाद ।

Contributors and Content Editors

Devraj, Prabhakarpandey, Shruti arya