इसके माध्यम से साझा किया गया


CommandBar नियंत्रण (पूर्वावलोकन)

कमांड्स इनपुट करने के लिए उपयोग किया जाने वाला नियंत्रण.

नोट

पूर्ण दस्तावेज़ीकरण और स्रोत कोड GitHub कोड घटक रिपॉजिटरी में मिला.

कमांडबार नियंत्रण.

विवरण

CommandBar यह एक सतह है जो उन आदेशों को रखती है जो उस विंडो, पैनल या मूल क्षेत्र की सामग्री पर काम करते हैं जिसके ऊपर यह स्थित है।

यह कोड घटक कैनवास ऐप और कस्टम पृष्ठों में उपयोग के लिए Fluent UI CommandBar नियंत्रण के चारों ओर एक आवरण प्रदान करता है.

विशेषता

मुख्य गुण

गुण विवरण
Items रेंडर करने के लिए क्रिया आइटम

आइटम संरचना

घटक में डेटा की कल्पना करने के लिए प्रत्येक आइटम निम्न स्कीमा का उपयोग करता है.

नाम विवरण
ItemDisplayName कमांड बार आइटम का डिस्प्ले नाम.
ItemKey यह इंगित करने के लिए उपयोग की जाने वाली कुंजी कि कौन सा आइटम चुना गया है, और उप आइटम जोड़ते समय. कुंजियाँ अद्वितीय होनी चाहिए.
ItemEnabled विकल्प अक्षम होने पर गलत पर सेट करें.
ItemVisible यदि विकल्प दिखाई नहीं दे रहा है तो असत्य पर सेट करें.
ItemChecked यदि विकल्प चेक किया गया है तो सही पर सेट करें (उदाहरण के लिए कमांड बार में स्प्लिट बटन).
ItemSplit यदि विकल्प पर क्लिक किया जा सकता है और ड्रॉप डाउन फ्लाईआउट मेनू के रूप में उपयोग किया जा सकता है तो सही पर सेट करें.
ItemIconName उपयोग करने के लिए फ़्लुएंट UI आइकन (फ़्लुएंट UI आइकन देखें)
ItemIconColor आइकन को प्रस्तुत करने के लिए रंग (जैसे नाम, आरजीबी या हेक्स मान).
ItemIconOnly टेक्स्ट लेबल न दिखाएं - केवल आइकन.
ItemOverflow अतिप्रवाह व्यवहार के लिए सत्य पर सेट करें
ItemOverflow ओवरफ़्लो आइटम में विकल्प रेंडर करें.
ItemFarItem आदेश पट्टी के दूर आइटम समूह में विकल्प रेंडर करें.
ItemHeader आइटम को सेक्शन हेडर के रूप में रेंडर करें. यदि ऐसे आइटम हैं जिनके पास ItemParentKey इस आइटम की कुंजी पर सेट है, तो उन्हें इस खंड के तहत शब्दार्थ समूहीकृत आइटम के रूप में जोड़ा जाता है.
ItemTopDivider खंड के शीर्ष पर एक विभाजक प्रस्तुत करें.
ItemDivider आइटम को सेक्शन डिवाइडर के रूप में रेंडर करें - या अगर आइटम हेडर है (आइटम हैडर = ट्रू), तो नियंत्रित करता है कि सेक्शन के निचले हिस्से में डिवाइडर रेंडर करना है या नहीं.
ItemParentKey विकल्प को दूसरे विकल्प के चाइल्ड आइटम के रूप में रेंडर करें.

नोट

  • ItemIconColor घटक के थीम मान को ओवरराइड करेगा और अन्य स्थिति रंगों (जैसे, अक्षम) को अनदेखा करेगा।
  • ItemHeader और ItemDivider को विभाजक के रूप में प्रस्तुत करने के लिए सत्य पर सेट किया जाना चाहिए। यदि गलत पर सेट किया जाता है, तो यह अन्य मानों की अपेक्षा करता है और खाली हो जाएगा.

उदाहरण

उदाहरण Power Fx बुनियादी Items के लिए सूत्र:

Table(
    {
        ItemKey: "new",
        ItemDisplayName: "New",
        ItemIconName: "Add"
    },
    {
        ItemKey: "edit",
        ItemDisplayName: "Edit",
        ItemIconName: "Edit"
    },{
        ItemKey: "delete",
        ItemDisplayName: "Delete",
        ItemIconName: "Delete"
    },{
        ItemKey: "refresh",
        ItemDisplayName: "Refresh",
        ItemIconName: "refresh"
    },{
        ItemKey: "help",
        ItemDisplayName: "Help",
        ItemIconName: "help"
    }
)
  

स्टाइल के गुण

गुण विवरण
Theme Fluent UI थीम डिज़ाइनर (windows.net) का उपयोग करके उत्पन्न JSON स्ट्रिंग को स्वीकार करता है. इसे खाली छोड़ने से Power Apps द्वारा परिभाषित डिफ़ॉल्ट थीम का उपयोग किया जाएगा. इसे कॉन्फ़िगर करने का तरीका देखने के लिए, थीमिंग देखें.
AccessibilityLabel स्क्रीन पढ़ने वालों का आरिया-लेबल

इवेंट गुण

गुण विवरण
InputEvent नियंत्रण को भेजने के लिए एक इवेंट. उदा. SetFocus.

व्यवहार

SetFocus के रूप में InputEvent का समर्थन करता है.

'ऑन सेलेक्ट' व्यवहार को कॉन्फ़िगर करें

नियंत्रण के चयनित ItemKey को स्विच मान के रूप में संदर्भित करके प्रत्येक आइटम के लिए विशिष्ट क्रियाओं को कॉन्फ़िगर करने के लिए घटक के OnSelect गुण में स्विच() सूत्र का उपयोग करें.

false मानों को Power Fx भाषा में उपयुक्त भावों से बदलें.

  Switch( Self.Selected.ItemKey,
    /* Action for ItemKey 'new' (e.g., Patch function) */
    "new", false,
    
    /* Action for 'edit' (e.g., Patch function) */
    "edit", false,
    
    /* Action for 'delete' (e.g., Remove function ) */
    "delete", false,
    
    /* Action for 'refresh' (e.g., Refresh function) */
    "refresh", false,
    
    /* Action for 'help' (e.g., email support with the Office 365 connector ) */
    "help", false,
  
    /* Default action */
        false
  )

नियंत्रण पर फ़ोकस सेट करना

जब एक नया संवाद दिखाया जाता है, और डिफ़ॉल्ट फ़ोकस नियंत्रण पर होना चाहिए, तो एक स्पष्ट सेट फ़ोकस की आवश्यकता होगी.

इनपुट इवेंट में कॉल करने के लिए, आप एक संदर्भ वेरिएबल सेट कर सकते हैं जो इनपुट इवेंट गुण से एक स्ट्रिंग के लिए बाध्य है जो SetFocus से शुरू होता है और इसके बाद एक यादृच्छिक तत्व होता है ताकि यह सुनिश्चित हो सके कि ऐप इसे परिवर्तन के रूप में पहचानता है.

उदाहरण Power Fx फ़ॉर्मूला:

UpdateContext({ ctxResizableTextareaEvent:"SetFocus" & Text(Rand()) }));

संदर्भ चर ctxResizableTextareaEvent तब संपत्ति इनपुट इवेंट संपत्ति के लिए बाध्य होगा.

सीमाएँ

इस कोड घटक का उपयोग केवल कैनवास ऐप और कस्टम पृष्ठों में ही किया जा सकता है.

घटक डिज़ाइन चुनौतियाँ में अधिक सीमा नोट देखें.