1. #1
    Sencha Premium Member
    Join Date
    Oct 2012
    Location
    Brisbane, QLD, Australia
    Posts
    45
    Vote Rating
    3
    ampro is on a distinguished road

      0  

    Default Unanswered: Custom components based on Container

    Unanswered: Custom components based on Container


    I'm trying to build a custom component for ST 2.x derived from Container.

    My attempt looks roughly like this:

    PHP Code:
    Ext.define('MyApp.ux.MyComponent', {   
        
    extend'Ext.Container',

        
    alias'widget.mycomponent',
        
        
    requires: [
         
    'Ext.Label',
         
    'Ext.Button',
         
    'Ext.field.Text'    ],

        
    config: {
          
    layout'vbox',
          
    baseClsExt.baseCSSPrefix 'my-component',
          
    headerLabelnull,
          
    bubbleEvents: ['action'],  // bubble action from text field
          
    items: [{
            
    itemId'headerLabel',
            
    xtype'label',
            
    htmlnull
          
    }, {
            
    itemId'btnFindBy',
            
    xtype'button',
            
    htmlnull
          
    }, {
            
    itemId'txtFindBy',
            
    xtype'textfield',
            
    htmlnull
          
    }]
        },

        
    constructor: function (instanceConfig) {
            var 
    me this;
            
    me.callParent(arguments);
            
    this.initConfig(instanceConfig);

            
    // wishing components had 'refs' like controllers.
            
    me._headerLabel     me.query('#headerLabel')[0];
            
    me._findByButton    me.query('#btnFindBy')[0];
            
    me._findByTextField me.query('#txtFindBy')[0];
            
    me._headerLabel.cls     me.baseCls '-header-label';
            
    me._findByButton.cls    me.baseCls '-findby-button';
            
    me._findByTextField.cls me.baseCls '-findby-textfield';


            
    me._findByButton.on({
               
    tap: function () {
                 
    // ... whatever ...
              
    }
            });
        },
        
        
    updateHeaderLabel: function (newLabeloldLabel) {
          
    // dies when called via initConfig() as this._headerLabel is not yet set.
          
    this._headerLabel.setHtml(newLabel);
        },

        
    /// more applyXXX() and updateXXX() methods} 
    The problem is that initConfig() in the constructor invokes all the applyXXX() and updateXXX() methods before they get a chance to initialize references to objects created in the items[] array.

    In short, what's the best practice for creating custom components that derived from Panel or Container for ST 2.x class model that use items[] to construct their content.

    If we were using templates, we'd use reference attributes to get DOM references. If it was a Controller we'd have refs but Containers don't seem to have an equivalent.
    Last edited by ampro; 26 Nov 2012 at 8:50 PM. Reason: Editor destroyed code layout

  2. #2
    Sencha User
    Join Date
    Apr 2010
    Location
    China
    Posts
    227
    Answers
    64
    Vote Rating
    20
    haduki will become famous soon enough haduki will become famous soon enough

      0  

    Default


    Code:
    HIERARCHY
    Ext.Base
      Ext.Evented
         Ext.AbstractComponent
            Ext.Component
               Ext.Container
    your class extend from 'Ext.Container' ,why you write this code?
    Code:
    this.initConfig(instanceConfig);
    this code ONLY necessary for your own class which is not extend from 'Ext.base'.
    I write English by translator.

  3. #3
    Sencha Premium Member
    Join Date
    Oct 2012
    Location
    Brisbane, QLD, Australia
    Posts
    45
    Vote Rating
    3
    ampro is on a distinguished road

      0  

    Default


    Thanks ... so what initialization pattern should I be using for components based on Container for ST 2.x class model?

    Note that I have some default config properties and some instance properties (that can override the class defaults) and I need to reference objects created in the items collection.

    Note that I used this initConfig() because that's what the Class docs tell you to do. What they leave out is specifying all the different patterns for each type of custom component (hence my recent post on this ..

  4. #4
    Sencha Premium Member
    Join Date
    Jul 2012
    Posts
    7
    Vote Rating
    0
    clebersm is on a distinguished road

      0  

    Default


    Hi, i need exacly the same component to my array. Did It works?

Thread Participants: 2

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar