4

extjs 3のプロパティグリッドにプログレスバーを実装することは可能ですか? プロパティ グリッドに画像を追加するにはどうすればよいですか?

私はパーセンテージで値を持っており、それをプログレスバー (編集不可) で表現したいと考えています。

助けてくれてどうもありがとう。

4

2 に答える 2

3

次のようなことを試すことができます： 

//==== Progress bar 1 ====
var pbar1 = new Ext.ProgressBar({
    id:'pbar1',
    width:300
});

var grid = new Ext.grid.PropertyGrid({
  title: 'Properties Grid',
  autoHeight: true,
  width: 300,
  renderTo: 'grid-ct',
  bbar: pbar1, //You can set the progress bar as the property girds bottom toolbar.
  customRenderers: {
    Available: function(v){
         return '<img src="path to image" />';
    }
  }, //This would render the image into the Available property.
  source: {
      "(name)": "My Object",
      "Created": new Date(Date.parse('10/15/2006')),
      "Available": false,
      "Version": .01,
      "Description": "A test object"
  }
});

customRenderers を使用して画像をレンダリングする
The name of the renderer type should correspond with the name of the property that it will render場合 詳細についてはAPIを参照してください。

于 2011-05-12T13:13:52.163 に答える
0

これは私が考えた最初のことです。しかし、グリッドがレンダリングされた後にプログレスバーをレンダリングするため、ユーザーフレンドリーではありません。

これは、進行状況列のカスタム レンダラーです。

renderer: function( value, metaData, record, rowIndex, colIndex, store ) {
                var id = Ext.id();
                (function(){
                    var progress = new Ext.ProgressBar({
                        renderTo: id,
                        value: progress_value
                    });
                }).defer(25);
                return '<div id="'+ id + '"></div>';
            }

<div id="generated-id"/>生成されたプログレスバーをレンダリングしてから、 this にレンダリングしますdiv。

上記の例のようにプログレスバーを 1 回だけ作成し、カスタム レンダラーを介してその html を返すために何らかのクロージャーを使用する方がよいでしょうが、残念ながら Ext.js 3 でそれを行う方法はまだわかりません。Ext については.js 4 sencha フォーラムでこのスレッドを見ることができます

于 2012-12-17T14:23:12.157 に答える