東側に画像パネルを備えた製品を編集するためのフォームがあります。画像の幅が 200、高さが 200 になるようにします。フォームをフロートさせます。どうやってするの?
編集:添付の画像で、画像の下の領域が空であることがわかります。これは、このウィンドウのアイテムセクションです
items: [{
xtype: 'tabpanel',
border: false,
items: [{
xtype: 'container',
title: 'General',
border: false,
layout: 'border',
region: 'left',
border: false,
items: [{
xtype: 'container',
region: 'center',
layout: 'border',
//height: 175,
flex: 1,
border: false,
items: [{
xtype: 'webposform',
id: 'productinfo',
startfocused: true,
region: 'center',
items: [{
xtype: 'textfield',
hidden: true,
name: 'id',
},{
xtype: 'textfield',
fieldLabel: 'SKU',
name: 'sku',
},{
xtype: 'textfield',
fieldLabel: 'Product name',
name: 'name',
},{
xtype: 'posdecimalfield',
fieldLabel: 'Sales Price',
name: 'price',
},{
xtype: 'posdecimalfield',
fieldLabel: 'Cost Price',
name: 'cost',
},{
xtype: 'textfield',
fieldLabel: 'EAN',
hideTrigger: true,
keyNavEnabled: false,
name: 'ean',
},{
xtype: 'container',
anchor: '100%',
layout: 'hbox',
bodyPadding: 5,
border: false,
defaults: {
labelWidth: 120,
anchor:'100%'
},
items: [{
hidden: true,
xtype: 'textfield',
name: 'supplier'
},{
xtype: 'textfield',
region: 'center',
name: 'supplier_display',
fieldLabel: 'Supplier',
flex: 1,
readOnly: true,
},{
action: 'selectSupplier',
margin: '0 0 0 2',
xtype: 'button',
width: 25,
region: 'west',
text: '...',
}],
},{
xtype: 'textarea',
fieldLabel: 'Description',
name: 'description'
},]
},{
xtype: 'panel',
border: false,
layout: 'vbox',
align : 'stretch',
pack : 'start',
region: 'east',
items: [{
xtype: 'panel',
id: 'defaultimage',
bodyPadding: 5,
height: 200,
width: 200,
margins: '5 5 5 5',
region: 'center',
},{
xtype: 'panel',
border: false,
flex: 1
}]
}],
}],
},{
xtype: 'imagepanel',
title: 'Images',
layout: 'border',
}],
}],