0

私がやりたいことは以下のようなものです:

/*

What i want is below(the dot is to be replaced with space): 

................................................................... .............テキストだけのtoolbar1 . ................................................................... ..........toolbar2 と text のみ。................................................................... ............ラベル付き textareafield1 。................................................................... ............ラベル付き textareafield2 。................................................................... ................................................................... ................................................................... ................................................................... ................................................................................... ...................ボタン1 .
................................................... ラベル . ................................................................... ................................................................... ................................................................... ................................................................... .......ボタン2 .

.button3 ................................................................... ...タブバー ................................................... .........................button4. ...................................................

*/
4

1 に答える 1

0

あなたはこのようなことをすることができます

Ext.create('Ext.Panel', {
    fullscreen : true,
    items : [{
        xtype :'toolbar',
        title : 'toolbar with just text'
    },{
        xtype :'toolbar',
        title : 'toolbar with just text'
    },{
        xtype :'textfield',
        label: 'TextField 1',
        name: 'TextField1'
    },{
        xtype :'textfield',
        label: 'TextField 2',
        name: 'TextField2'
  },{
        xtype :'label',
        html : 'text you want to disaply..................................'
  },{
      xtype : 'panel',
      layout : 'hbox',
      items : [{
          xtype : 'label',
          html : '....................'
      },{
          xtype : 'label',
          html : '..............................................'
      },{
          xtype : 'button',
          text : 'Button Text'
      }]
  },{
      xtype : 'panel',
      layout : 'hbox',
      items : [{
          xtype : 'label',
          html : '.................... '
      },{
          xtype : 'label',
          html : 'label Text'
      },{
          xtype : 'label',
          html : '.................. '
      }]
  }]
});

hbox レイアウトのパネルでうまくいきます。このsencha fiddleを参照してください。

アップデート

フィールドをフィールドセットに入れると、フィールド間に線を設定できます..

または、単純な区切り線または画像を作成したい..フィールドの間に入れるだけです

{
  xtype : 'label',
  html : '<hr>'
}

この煎茶フォームスレッドも参照してください

于 2013-06-28T04:41:37.873 に答える