Ext viewport的渲染
2024-10-09 23:08:17
Ext viewport的渲染
1.在app.js里创建
Ext.application({
name: 'MySecurity',
extend: 'MySecurity.Application',
requires: [
'MySecurity.view.Viewport'
],
//添加mainView 会自动创建 viewport
mainView: 'MySecurity.view.Viewport'
});
2.在Application.js里创建
- 在Application渲染viewport可以先处理一些其他操作再渲染界面
例如先获取某些数据，或者先执行一些其他操作，弹出窗口,显示loading等
Ext.define('MySecurity.Application', {
extend: 'Ext.app.Application',
requires:[
'Ext.form.*',
'Ext.grid.*'
],
name: 'MySecurity',
stores: [
// TODO: add global / shared stores here
//'user.UserStore'
],
launch: function () {
// TODO - Launch the application
},
init: function(){
myApp = this;
//创建Viewport
Ext.create('MySecurity.view.Viewport');
},
onAppUpdate: function () {
Ext.Msg.confirm('Application Update', 'This application has an update, reload?',
function (choice) {
if (choice === 'yes') {
window.location.reload();
}
}
);
}
});
3.viewport
继承 Ext.container.Viewport
Ext.define('MySecurity.view.Viewport', {
extend: 'Ext.container.Viewport',
requires:[
'MySecurity.view.main.MainHeader',
'MySecurity.view.main.MainTabPanel'
],
layout:{
type:'vbox',
align :'stretch'
},
controller: 'viewportcontroller',
viewModel: {
type: 'mainviewport'
},
items: [{
xtype:'mainHeader',
height:50
},{
xtype:'mainTabPanel',
flex:1
},{
xtype: 'tbtext',
cls: 'top-user-name',
bind: {
text: '{userAccess.username}'
}
}]
});
最新文章
- [整理]AngularJS移动端开发遇到的问题
- jquery阻止元素冒泡的两种方法
- Consuming a RESTful Web Service
- RabbitMQ（二）
- 四 GPU 并行编程的存储系统架构
- Windows 7 搭建 nodejs、npm、express 环境
- Web api 文档以及测试工具配置
- Hibernate学习（二）保存数据
- GROUP BY你都不会！ROLLUP，CUBE，GROUPPING详解
- Mac上，Apache启动正常，却无法访问localhost和127.0.0.1
- 【vue】vue +element 搭建项目，要求既支持pc端又支持移动端
- 媳妇要转java开发，我该怎么办？
- 【转】《深入理解C# 3.x的新特性》博文系列汇总
- [转]浅谈UML的概念和模型之UML九种图
- Xshell如何设置，当连接断开时保留Session,保留原文字
- forget word qz_c
- J05-Java IO流总结五 《 BufferedInputStream和BufferedOutputStream 》
- 使用socket发送http请求(get/post)
- r 数据分组处理
- MySql中存储过程的理解