एक्स्टजेस के पैनल के "टूल" बटन के लिए उपलब्ध आइकन

Question

मैं अपने पैनल के "शीर्षक बार" में उपयोग किए गए आइकन को कैसे सेट कर सकता हूं? हो सकता है कि मुझे खुद को एक छवि जोड़ने की ज़रूरत है, लेकिन अगर ऐसा लगता है कि मुझे कहीं और परिभाषित करने की आवश्यकता है?

{ 
    xtype: 'treepanel', 
    title: 'Projects', 
    width: 200, 
    store: Ext.data.StoreManager.lookup('projects'), 
    tools: [ 
     { 
      type: 'add', // this doesn't appear to work, probably I need to use a valid class 
      tooltip: 'Add project', 
      handler: function() { 
       console.log('TODO: Add project'); 
      } 
     }, 
     ... 
    ] 
}, 

Answer 1

25 आइकन का एक सेट है जिसे टाइप कॉन्फ़िगरेशन का उपयोग करके निर्दिष्ट किया जा सकता है। जांच http://docs.sencha.com/ext-js/4-0/#!/api/Ext.panel.Tool-cfg-type

प्रतीक उपयोग जोड़ने के प्राप्त करने के लिए

tools:[{ 
    type:'plus', 
    tooltip: 'Add project', 
    // hidden:true, 
    handler: function(event, toolEl, panel){ 
     // Add logic 
    } 
}] 

निर्दिष्ट प्रकार: 'जोड़ें' सूची में नहीं है

Answer 2

मुझे लगता है कि आपका मतलब है "मेरे पैनल के शीर्षक बार में उपयोग किए गए बटन सेट करें", "सेट आइकन" नहीं। के लिए

buttons: [{ 
    text: 'Add', 
    tooltip: 'Add project', 
    handler: function() { 
     console.log('TODO: Add project'); 
    } 
}] 

आप bbar (नीचे पट्टी) जैसे अन्य विन्यास का उपयोग कर सकते, fbar (पाद), tbar (ऊपर), lbar (बाएं), rbar (दाएं): आप पैनल के buttons config, नहीं tools उपयोग कर सकते हैं टूलबार की स्थिति। एक छोटी सूचना है कि buttons में कॉन्फ़िगरेशन ऑब्जेक्ट्स button के रूप में डिफ़ॉल्ट हैं, इसलिए आपको उन्हें स्पष्ट रूप से निर्दिष्ट करने की आवश्यकता नहीं है।

Answer 3

आप अपने खुद के उपकरण प्रकार जोड़ सकते हैं और करने में सक्षम होना चाहते हैं इसे अपने आप की एक छवि असाइन करें, आप निम्न कार्य कर सकते हैं:

अपनी सीएसएस फ़ाइल में एक सीएसएस कक्षा जोड़ें:

.x-tool-mytool { background-image: url(path_to_your_image_file) !important; } 

अपने उपकरणों में

फिर, बस प्रकार के रूप में 'mytool' का उपयोग करें:

  { 
       type:'mytool', 
       tooltip: 'This is my tool', 
       handler: function(event, toolEl, panel){ 
        // my tool logic 
       } 
      } 

यकीन है कि आप इस उपकरण के प्रकार में समान नाम का उपयोग के रूप में आप सीएसएस वर्ग प्रत्यय के लिए इस्तेमाल करते हैं। या अधिमानतः आइकन स्प्राइट - जबकि एक 15px आइकन प्रदान

{type: 'YOURTYPE'} 

:

Answer 4

ExtJS प्रलेखन के अनुसार, इन पूर्वनिर्धारित प्रकार उपलब्ध हैं:

collapse, expand, maximize, minimize, resize, restore, move, close 

minus, plus, prev, next, pin, unpin, search, toggle, refresh 

save, print, gear, help 

right, left, up, down 

एक प्रवेश कर सकते हैं चाहता है जो कुछ भी प्रकार एक

(पृष्ठभूमि-स्थिति निश्चित रूप से एकल आइकन के लिए लागू नहीं होती है, लेकिन आइकन sprites):

.x-tool-img.x-tool-YOURTYPE{ 
    background: url('../images/custom_tool_sprites.png') no-repeat 0 0; 
} 

सूत्रों: Ext.panel.Tool-cfg-type, codefx.biz। आइटम:: [{ आइकन: /// कुछ यूआरएल }]