KivyMD - जीवन चलता है

नमस्ते!

आज हम Kivy क्रॉस-प्लेटफॉर्म डेवलपमेंट फ्रेमवर्क का उपयोग करके लिखे गए एप्लिकेशन में Android पर UI के बारे में बात करेंगे। आप इस बारे में नहीं जानते होंगे, लेकिन किवी के लिए किवीएमडीएम लाइब्रेरी है, जो आपके कार्यक्रमों के लिए मटेरियल डिज़ाइन स्टाइल विजेट प्रदान करती है। दुर्भाग्य से, iOS प्लेटफॉर्म के तहत इस तरह का कुछ भी मौजूद नहीं है। इसके अलावा, कीवीएमडी, जाहिरा तौर पर, इसके निर्माता द्वारा छोड़ दिया गया था, क्योंकि शलजम में आखिरी प्रतिबद्ध लगभग एक साल पहले था। क्या करना है और इसके साथ कैसे रहना है, इस पर पढ़ें ...

कभी-कभी आधिकारिक KivyMD रिपॉजिटरी का दौरा करने पर , मैंने दुखी होकर पाया कि इसमें कुछ भी नहीं बदल रहा था और बदलने वाला नहीं था:



मेरी किवी परियोजनाओं में, मैं किसी भी यूआई को लागू कर सकता हूं, जो वास्तव में, मैं करता हूं। लेकिन हाल ही में मुझे पता चला है कि मैं उन मॉड्यूल के बढ़ते हिस्से को खींच रहा हूं जिन्हें मैंने परियोजना से परियोजना में लागू किया है, जो बहुत असुविधाजनक है। इनमें से कुछ समाधान GitHub पर अलग-अलग रिपॉजिटरी के रूप में पोस्ट किए गए हैं। हालाँकि, अभी भी यह साझा करना, प्रबंधित करना और इन सभी का उपयोग करना सुविधाजनक नहीं है, क्योंकि इस तरह के अधिक से अधिक मॉड्यूल हैं। निर्णय अपेक्षाकृत हाल ही में किया गया था: KivyMD, एक ओपन सोर्स प्रोजेक्ट के रूप में, मेरे विंग के अंतर्गत आता है। अब इस पुस्तकालय का एक कांटा यहाँ है ।

मैंने त्रुटियां तय कीं जो कुछ विजेट्स को हुईं। उदाहरण के लिए, MDDropDownMenu विजेट स्क्रॉल करने और आइटम का चयन करने के कार्य से वंचित था। अब यह इस तरह दिखता है:


अन्य सुधारों के एक समूह के अलावा, बड़े और ऐसा नहीं है, नए विजेट और नियंत्रण जोड़े गए। मौजूदा MDFlatButton, MDRaisedButton, MDIconButton MDFloatingActioButton के अलावा ...


... मैंने कई नियंत्रण लागू किए: MDRectangleFlatButton, MDRectangleFlatIconButton, MDRoundFlatIconButton, MDRoundFlatButton, MDFilloundoundlutton , जो किट में स्पष्ट रूप से गायब थे:


मैं यथासंभव KivyMD के साथ काम को आसान बनाने की कोशिश करता हूं। आपके मार्कअप में ऊपर वर्णित नए नियंत्रणों का उपयोग इस तरह होगा:

MDRectangleFlatButton: text: "MDRectangleFlatButton" MDRectangleFlatIconButton: text: "I love Python" icon: "language-python" MDRoundFlatButton: text: "I love Python" icon: "language-python" MDRoundFlatIconButton: text: "I love Python" icon: "language-python" MDFillRoundFlatButton: text: "I love Python" 

हाल ही में, मेरे VKontakte समूह में एक पोस्ट जोड़ा गया था जिसमें एक व्यक्ति ने संपर्क कार्ड के कार्यान्वयन के लिए मदद मांगी:

नमस्ते!

लेआउट के बारे में प्रश्न।

मैं एक संपर्क कार्ड बना रहा हूं और मैं लेआउट के प्रकार को नहीं चुन सकता / सकती हूं

a) खिंचाव नहीं हुआ, और तत्वों को एक के बाद एक लंबवत व्यवस्थित किया गया

b) तत्वों के बीच कोई विशाल अंतराल नहीं थे

BoxLayout के बारे में, StackLayout की कोशिश की - किसी कारण से तत्वों के बीच अंतराल। मैं प्रपत्र और kv कोड की स्क्रीन संलग्न करता हूं।

यह देखा जा सकता है कि अवतार के साथ पहले ब्लॉक के बाद एक अंतराल है, पाठ ब्लॉक के बाद भी। कैसे ठीक करें ताकि हर जगह समान स्थान हों, ताकि सभी तत्व प्रकार के समान हों: सच?

यहाँ परिणाम है:


मैंने कोड को ठीक किया, और उसी समय KivyMD - MDUserAnimationCard में एक कार्ड विजेट जोड़ा, जो इस व्यवहार को लागू करता है:


आपके द्वारा बनाई गई सभी सामग्री ऐसी है जो उपयोगकर्ता के कार्ड के तहत प्रदर्शित की जाएगी। यदि स्क्रीन पर शेष स्थान से अधिक है, तो सामग्री के लिए स्क्रॉल फ़ंक्शन स्वचालित रूप से लागू किया जाएगा:


इसके बाद, MDUserAnimationCard पर आपके द्वारा बनाई गई सामग्री का वर्ग जोड़ें:

  def show_user_card(self): user_animation_card = MDUserAnimationCard( user_name="Lion Lion", path_to_avatar="./assets/african-lion-951778_1280.jpg", callback=main_back_callback) user_animation_card.box_content.add_widget(ContentForAnimCard()) user_animation_card.open() 

MDStackFloatingButtons, जो पहले से ही लेख द्वारा आपके लिए जाना जाता है, KivyMD में स्थानांतरित हो गया:


इस विजेट का उपयोग भी अधिकतम करने के लिए सरल किया गया है:

  def example_add_stack_floating_buttons(self): def set_my_language(instance_button): toast(instance_button.icon) screen = self.main_widget.ids.scr_mngr.get_screen('stack buttons') screen.add_widget(MDStackFloatingButtons( icon='lead-pencil', floating_data={ 'Python': 'language-python', 'Php': 'language-php', 'C++': 'language-cpp'}, callback=set_my_language)) 

उपयोग के लिए तैयार कई कार्ड लागू किए गए हैं, उदाहरण के लिए, पदों की सूची के लिए, आदि।:


उपयोग उदाहरण:

 MDCardPost(text_post='Card with text', swipe=True, callback=callback)) 

 menu_items = [ {'viewclass': 'MDMenuItem', 'text': 'Example item %d' % i, 'callback': self.callback_for_menu_items} for i in range(2) ] MDCardPost( right_menu=menu_items, swipe=True, callback=callback text_post='Card with a button to open the menu MDDropDown')) 

 MDCardPost( likes_stars=True, callback=callback, swipe=True, text_post='Card with asterisks for voting.')) 

 buttons = ['facebook', 'vk', 'twitter'] text_post = \ "This is my favorite cat. He's only six months " "old. He loves milk and steals sausages :) " "And he likes to play in the garden." MDCardPost( source="./assets/kitten-1049129_1280.jpg", tile_text="Little Baby", tile_font_style="Headline", text_post=text_post, with_image=True, swipe=True, callback=callback, buttons=buttons)) 

सर्वर से सामग्री को डाउनलोड करने की प्रगति, एक साधारण फ़ाइल प्रबंधक, पुलटाउपडेट विजेट:


पुस्तकालय विगेट्स का पूरा वीडियो प्रदर्शन:


शुरुआत में लौटकर, मैं कहूंगा कि यह सब केवल एंड्रॉइड के लिए अच्छा है, क्योंकि निश्चित रूप से, हम iOS प्लेटफॉर्म के लिए एप्लिकेशन में सामग्री डिज़ाइन का उपयोग नहीं कर सकते हैं। और मैं एक UI बनाने के लिए KivyMD को अनुकूलित करना बहुत पसंद करूंगा जो iOS पर भी मूल लगेगा। तकनीकी रूप से, इस कार्य में कोई बाधा नहीं है। एकमात्र पकड़ यह है कि मेरे पास iOS डिवाइस नहीं है, इसलिए मुझे नहीं पता कि UI, एनीमेशन और अन्य डिज़ाइन कैसा दिखता है। बेशक, आईओएस के लिए डिजाइन गाइड हैं, लेकिन गाइड गाइड हैं, और मुझे खुशी हुई अगर किवीएमडीएम लाइब्रेरी को विकसित करने में रुचि रखने वाले व्यक्ति ने आईओएस प्लेटफॉर्म के तहत अनुप्रयोगों के संदर्भ डिजाइन के दर्जनों स्क्रीनशॉट और एनिमेशन भेजे। पर्याप्त, उदाहरण के लिए, वर्तमान में KivyMD में जो पहले से ही लागू है, लेकिन केवल एक सेब के लिए। सिम के लिए मुझे अपनी छुट्टी लेने दें, पीएम पर दस्तक दें, मुझे आशा है, हमेशा की तरह, बेकार नहीं था।