What is Widget in Flutter in Hindi || फ़्लटर में विजेट क्या होते है ?

हेलो दोस्तों, आपका स्वागत है हम्हारे एक और flutter पोस्ट पर। दोस्तों इस पोस्ट में मै आपको बताऊंगा widget क्या होता है और क्यों यूज़ करते है और कैसे यूज़ करते है ?

दोस्तों लास्ट पोस्ट में हमने Flutter और Android में difference को जाना था आप अगर वो पोस्ट पढ़ना चाहते हो तो flutter और android में difference पर क्लिक करे और आप हम्हारे उस पोस्ट पर पहुंच जायेगे। इस post में, आइए हम फ़्लटर फ्रेमवर्क में उपलब्ध विजेट और विभिन्न प्रकार के विजेट बनाने के तरीके के पीछे की वास्तविक अवधारणा को समझें।

विजेट क्या है ? (What is Widget ?)

दोस्तों जो भी आप flutter app में देखते हो वो सभी widgets होते है या फिर यु कहे की flutter में सब कुछ widget होता है और काफी सारे widgets मिल कर ही flutter app को बनाते है या फिर काफी सारे widgets से मिल कर ही flutter app बनती है।

दोस्तों जब भी आप flutter में कुछ भी बनाने के लिए कुछ कोड लिखते हो तो वह कोड एक widget के अंदर होगा क्युकी flutter एप्प widgets के base पर ही बनता है। यह वर्णन करता है कि आपका ऐप दृश्य उनके वर्तमान कॉन्फ़िगरेशन और स्थिति के साथ कैसा दिखना चाहिए। दोस्तों जब भी आप code में कोई बदलाव करते हैं, तो एप्प के UI (User Interface) में रेंडरिंग के लिए या फिर उन changes को screen पर दिखाने के लिए widget अपने आपको rebuild करता है और यह अपने आप state को calculate करता है वह पहले और बाद में किये गए परीवर्तन को कैलकुलेट करके बहुत ही काम समय में changes को screen पर दीखाता है। ऐप बनाने के लिए विजेट एक दूसरे के साथ जुड़ते हैं। इसका मतलब है कि आपके ऐप की जड़ (root) ही एक विजेट है।

 
फ़्लटर में, विजेट्स को उनकी विशेषताओं के आधार पर कई श्रेणियों में बांटा जा सकता है, जैसा कि नीचे सूचीबद्ध है -

  1. Platform specific widgets
  2. Layout Widgets
  3. State maintenance widgets
  4. Platform independent / basic widgets

आइए अब उनमें से प्रत्येक पर विस्तार से चर्चा करें।

Platform Specific Widgets:-

दोस्तों जैसा की आप सभी जानते है flutter से हम android और ios दोनों platform के लिए एक ही कोड-बेस से अलग-अलग app बना सकते है और दोस्तों अगर आपने कभी ध्यान दिया हो, तो आपको यह भी पता होगा की android और ios में जो भी buttons या कोई alert dialog या फिर toggle buttons सब android से बिल्कुल ही अलग होते है पर हम flutter का यूज़ करके दोनों platform के लिए एक जैसा डिज़ाइन बना सकते है और दोस्तों हम किसी भी type का widget किसी भी platform में यूज़ कर सकते है। दोस्तों फ़्लटर में एक विशेष प्लेटफ़ॉर्म - Android या iOS के लिए विशिष्ट विजेट (specific widget) होते हैं।

Android विशिष्ट विजेट Android OS द्वारा Material डिज़ाइन दिशानिर्देश के अनुसार डिज़ाइन किए गए हैं। Android विशिष्ट विजेट को Material विजेट कहा जाता है।

iOS विशिष्ट विजेट्स को Apple द्वारा मानव इंटरफ़ेस दिशानिर्देशों के अनुसार डिज़ाइन किया गया है और उन्हें Cupertino विजेट कहा जाता है।

सबसे अधिक उपयोग किए जाने वाले कुछ Material विजेट इस प्रकार हैं -

  Scaffold
  AppBar
  BottomNavigationBar
  TabBar
  TabBarView
  ListTile
  RaisedButton
  FloatingActionButton
  FlatButton
  IconButton
  DropdownButton
  PopupMenuButton
  ButtonBar
  TextField
  Checkbox
  Radio
  Switch
  Slider
  Date & Time Pickers
  SimpleDialog
  AlertDialog

कुछ सबसे अधिक उपयोग किए जाने वाले Cupertino विजेट इस प्रकार हैं -

  CupertinoButton
  CupertinoPicker
  CupertinoDatePicker
  CupertinoTimerPicker
  CupertinoNavigationBar
  CupertinoTabBar
  CupertinoTabScaffold
  CupertinoTabView
  CupertinoTextField
  CupertinoDialog
  CupertinoDialogAction
  CupertinoFullscreenDialogTransition
  CupertinoPageScaffold
  CupertinoPageTransition
  CupertinoActionSheet
  CupertinoActivityIndicator
  CupertinoAlertDialog
  CupertinoPopupSurface
  CupertinoSlider

 Layout Widgets :-

दोस्तों जैसा की आप जानते है की flutter में एक या अधिक widgets मिला कर एक widget बनाया जा सकता है या फिर एक ही widget में कई सारे widgets बनाने के लिए भी अपन widget ही यूज़ करते है। Flutter हमे बढ़ी संख्या में widgets प्रदान करता है उनमे कुछ widgets layout widgets होते है जो की अपनी किसी भी डिज़ाइन को बनाने के लिए काम में आते है। उदाहरण के लिए, चाइल्ड विजेट को केंद्र विजेट का उपयोग करके केंद्रित किया जा सकता है।

कुछ लोकप्रिय Layout Widgets इस प्रकार हैं -

Container :- दोस्तों किसी भी type का custom डिज़ाइन या background बनाने के लिए हम container widget का यूज़ करते है जिसको हम अपने हिसाब से किसी भी तरह का डिज़ाइन दे सकते है या अपने एप्प को सजा सकते है।

Center :- दोस्तों इस widget का यूज़ अपने किसी भी अन्य widget को अपने डिज़ाइन के center या फिर केंद्र में करने के लिए करके है।

Row :- दोस्तों इस विजेट का यूज़ अपन अपने widgets को क्षैतिज दिशा (horizontal direction) में व्यवस्थित करने के लिए करते है।

Column :- दोस्तों इस विजेट का उसे भी अपने widgets को एक दिशा में दिखने या arrange करने के लिए करते है परन्तु Column widget में सभी widgets को लंबवत दिशा (Vertical डायरेक्शन) में व्यवस्थित करने के लिए करते है।

Stack :- दोस्तों stack widget बहुत की useful widget है इसका यूज़ अपन एक widget के ऊपर दूसरा widget व्यवस्थित के लिए करते है।

 State maintenance widgets

दोस्तों flutter में मुख्य रूप से दो प्रकार के विजेट होते हैं:

  StatefulWidget
  StatelessWidget

StatefulWidget :-

दोस्तों StatefulWidget में State की जानकारी होती है।इसमें मुख्य रूप से दो वर्ग होते हैं State Object और विजेट। यह गतिशील है क्योंकि यह विजेट के जीवनकाल के दौरान आंतरिक डेटा को बदल सकता है। या फिर दोस्तों हम यु कहे की statefulwidget का यूज़ हम एक dynamic डिज़ाइन बनाने के लिए करते है जो की एक बार बनाने के बाद अपने data के हिसाब से बदलता रहता है। StatefulWidget के उदाहरण चेकबॉक्स, रेडियो, स्लाइडर, इंकवेल, फॉर्म और टेक्स्टफिल्ड हैं।

StatelessWidget :-

StatelessWidget में State की कोई जानकारी नहीं है। यह अपने पूरे जीवनचक्र में स्थिर रहता है और StatelessWidget का यूज़ हम एक static या इस्थिर डिज़ाइन बनाने के लिए करते है जो की कभी भी अपने आप नहीं बदलता। StatelessWidget के उदाहरण टेक्स्ट, रो, कॉलम, कंटेनर आदि हैं।

 

Platform independent / basic widgets

दोस्तों जैसा की आप जानते ही flutter में हम किसी भी तरह का डिज़ाइन बहुत ही काम समय में और बहुत ही आसानी से बना लेते है क्युकी flutter हमे काफी सारे widgets देता है जिनका यूज़ करके हम जैसा चाहे वैसा डिज़ाइन बना सकते है और दोस्तों फ्लटर हमे कई सारे widgets ऐसे भी देता है जिनको हम किसी भी प्लेटफार्म पर यूज़ कर सकते है।

Text :- दोस्तों Text विजेट का उपयोग स्ट्रिंग (String) के एक टुकड़े को प्रदर्शित करने के लिए किया जाता है। मतलब जो कुछ भी आप इस text widget में लिखते हो वो आपको अपने app के डिज़ाइन में देखने को मिलता है।

Image :- Image Widget का उपयोग एप्लिकेशन में एक Image को दिखने के लिए किया जाता है। इसमें हम अपने project में रखी हुई या फिर online किसी भी image का url यूज़ करके उस image को अपने app में दिखा सकते है।

Icon :- दोस्तों Icon widget का उसे हम flutter project में available कुछ सिंपल और small icons को दिखने के लिए करते है जो की हमे flutter project में पहले मिलते  है।

 

दोस्तों उम्मीद है की आपको मेरा ये पोस्ट पसंद आया होगा और आपके सवालों के जवाब भी मिल गए होंगे की Widget kya hai, Widget kaise kaam karta hai.

लेकिन अगर आपको अभी भी कोई प्रसन है Flutter के बारे मे तो आप मुझसे comment करके पूछ सकते है में आपके सवालो का जरूर जवाब दूंगा। 

धन्यवाद।