[ExtJS 4.2.1] Combo boundlist with progressbar

为了做出这个效果~ 特地把progressbar控件的DOM 抓出来看了下~~ 

 

<!-- coded by eaxu -->

Ext.create('Ext.XTemplate',
    '<tpl for=".">',
        '<div class="x-boundlist-item">',
            '<tpl if="progressBar">',
                '<div class="x-progress x-progress-default x-border-box" id="progressbar-{name}">',
                    '<div class="x-combo-progress-text x-progress-text x-progress-text-back" id="progress-text-{name}-back" >{name}</div>',
                    '<div id="progressbar-{name}-bar" class="x-progress-bar x-progress-bar-default" style="width:{percent}%" >',
                        '<div class="x-combo-progress-text x-progress-text" id="progress-text-{name}">',
                            '<div>{name}</div>',
                        '</div>',
                    '</div>',
                '</div>',
            '<tpl else>',
                '{name}',
            '</tpl>',
        '</div>',
    '</tpl>'
)

.x-combo-progress-text {
    font-weight: normal !important;
}

 

转载于:https://www.cnblogs.com/eaxu/p/3757305.html