Cách chèn khoảng cách giữa các thành phần trong bố cục Ext js 4

Question

Tôi đang chuyển từ adobe flex sang ext js 4 và tôi lưu ý rằng trong Extjs, các thành phần được đặt quá gần. Không có khoảng cách giữa lúc đó. Điều này có thể phải đối mặt với ví dụ này:

var win = Ext.create('Ext.window.Window', { 
    layout: 'hbox', 
    height: 500, 
    width: 400, 
    title: 'hbox',  
    items: [ 
     Ext.create('Ext.button.Button', 
     { 
     text: 'My button 1', 
     width: 150 
     }), 
     Ext.create('Ext.button.Button', 
     { 
     text: 'My button 2', 
     width: 150 
     }) 
    ] 
}); 

win.show(); 

Nút hai không gian cách nhau.

Cách đặt khoảng cách (khoảng cách hoặc bao giờ) từ các thành phần?

Cảm ơn.

Answer 1

Sử dụng cấu hình margin:

Ext.onReady(function() { 
    var win = Ext.create('Ext.window.Window', { 
     layout: 'hbox', 
     height: 500, 
     width: 400, 
     autoShow: true, 
     title: 'hbox', 
     defaultType: 'button', 
     items: [{ 
      text: 'My button 1', 
      width: 150, 
      margin: '10 20 30 40' 
     }, { 
      text: 'My button 2', 
      width: 150, 
      margin: '40 30 20 10' 
     }] 
    }); 
}); 

Answer 2

giống như lề? Bạn có thể thêm điều đó theo kiểu thuộc tính. Xem cựu này http://jsfiddle.net/nscrob/5rn8C/5/