extend: 'Ext.panel.Panel',
alias : 'widget.vedioView',
id:'vediopanel',
//title: '视频',
header : false,
autoHeight : true,
region: "west",
width: (Ext.getBody().getViewSize().width-280)*0.5,
border: true,
frame: true,
bodyStyle:'padding:5 5 5 5',
layout: 'vbox',
defaults: {
frame: true,
id: 'vediopanel_1',
height:Ext.getBody().getViewSize().height-15,
width:(Ext.getBody().getViewSize().width-280)*0.49
},
items: [{
layout:'vbox',
defaults: {
frame: true,
width:(Ext.getBody().getViewSize().width-280)*0.49
},
items:[{
height:(Ext.getBody().getViewSize().height-15)/2,
html:"<object classid='clsid:1EE1C648-F4A9-42F9-9AA7-2C8E3AF7B7FD' height='100%' width='100%' id = 'EasyPlayerOcx1'></object>",
tbar:[{
text:'实时预览',
iconCls:'icon_recovery',
handler: function() {
StartShow();
}
},"-",{
text:'停止预览',
iconCls:'icon_stop',
handler: function() {
StopShow();
}
}
]
},{
height:(Ext.getBody().getViewSize().height-15)/2,
html:"<object classid='clsid:1EE1C648-F4A9-42F9-9AA7-2C8E3AF7B7FD' height='100%' width='100%' id = 'EasyPlayerOcx3'></object>",
tbar:[{
text:'实时预览',
iconCls:'icon_recovery',
handler: function() {
StartShow();
}
},"-",{
text:'停止预览',
iconCls:'icon_stop',
handler: function() {
StopShow();
}
}
]
}]
}]
});
参考demo:
Ext.onReady(function () {
Ext.create('Ext.panel.Panel',{
layout:{
type:'column'
},
default:{
xtype:'panel'
},
border:1,
width:600,
height:400,
padding:10,
items:[{
margin:'30px',
width:150,
height:290,
layout:'vbox',
items:[{
width:150,
height:90,
html:'form'
},{
width:150,
height:200,
html:'gridPanel'
}]
},{
margin:'30px 30px 30px 0',
width:150,
height:290,
layout:'vbox',
items:[{
width:150,
height:90,
html:'form'
},{
width:150,
height:200,
html:'gridPanel'
}]
},{
margin:'30px 30px 30px 0',
width:150,
height:290,
layout:'vbox',
items:[{
width:150,
height:90,
html:'form'
},{
width:150,
height:200,
html:'gridPanel'
}]
}],
renderTo:Ext.getBody()
})
效果图：