如何添加网格标签面板

Question

不是如何我可以在标签panel..My网格的中心增加电网采取的利润率，甚至style:{margintop:'10px'}高度和宽度：

这里是我的网格： -

{ 
     title: 'Credit Card', 
     id:'credit_tab', 
     html:'html', 
     items:[{ 
        xtype:'grid', 

        title: 'Simpsons', 
        resizable: true, 
        // margins:'20 20 20 20', 
        style:{marginLeft:'200px',marginTop:'30px'}, 
        //store: Ext.data.StoreManager.lookup('simpsonsStore'), 
        columns: [ 
         { header: 'Name', dataIndex: 'name' }, 
         { header: 'Email', dataIndex: 'email', flex: 1 }, 
         { header: 'Phone', dataIndex: 'phone' } 
        ], 
        // height: 100, 
        width: 100, 
        // renderTo:Ext.getBody() 
       }] 

     } 

Answer 1

尝试将网格嵌套到容器中。然后从容器中，您可以尝试不同的尺寸和布局，将其放置在您想要的位置。这里有一个例子。

我会删除“风格”填充/位置，至少启动并看看你喜欢在容器内如何。然后从那里垫/位置。试试这个：

{ 
    title: 'Credit Card', 
    id:'credit_tab', 
    html:'html', 
    items:[{ 
      xtype: 'container', 
      layout: { 
       type: 'hbox', 
       align: 'center', 
       pack: 'center', 
      }, 

      items: [{ 
        xtype:'grid', 
        title: 'Simpsons', 
        resizable: true, 
        // margins:'20 20 20 20', 
        height: 200, 
        //store: Ext.data.StoreManager.lookup('simpsonsStore'), 
        columns: [ 
         { header: 'Name', dataIndex: 'name' }, 
         { header: 'Email', dataIndex: 'email', flex: 1 }, 
         { header: 'Phone', dataIndex: 'phone' } 
        ], 
        // height: 100, 
        width: 500, 
        // renderTo:Ext.getBody() 
       }] 
     }] 

    } 

Answer 2

不要为此使用CSS定位（边距等）。使用layout: center。

UPDATE：

下面是一个例子：https://fiddle.sencha.com/#fiddle/s7h

P.S.我期待那位赞成这个答案的善意的人提供评论/推理或者删除投票。