ext图形开发工具SenchaArchitec初体验

以前用过delphi和vb开发程序,一款图形开发ide对于我们的开发帮助是非常大的。也许有很多大神会很不屑,但是我认为拖拉控件也没什么不妥的,起码我在开发android应用的时候会用layout编辑器来预览视图。对于刚入门ext的新手倒是不错,先用ide生成代码然后在看代码,修改代码...

下面我来介绍一下SenchaArchitec的使用吧:

Sencha Architect是个可视化的应用开发工具,在该公司的HTML5布局工具Ext Designer的基础上构建,并扩展了其功能,来为桌面和移动Web应用的构建提供更为广泛的支持。通过与Sencha Touch 2、Ext JS 4结合,Sencha Architect 2提升了开发者的生产效率并驱动应用设计模式上的最佳实践。


2.1版本的主要目的是提升性能和稳定性,并增加了一些功能。该版本的主要新特性包括:  

    支持Ext JS 4.1 可以方便地将项目从Ext JS 4.0迁移到4.1 支持Sencha Touch 2.0.1.1 改善了源码控制系统,便于团队协作 现在可以在画布上直接加载CSS资源 改善了代码编辑器,如查看子元素功能、更好的JSHint验证、更好的查找/替换功能 改善了模板、对象、数组的配置,支持多种配置类型 新增了一个“类”项目,允许你在框架中扩展项目,如添加抽象类
除此之外,Sencha Architect的消息日志、文档也得到改进,并增加了部分示例,这些示例已经迁移到了 上,以便社区成员参与。 

1.下载SenchaArchitect,官方下载地址是

2.安装SenchaArchitect

直接双击安装就可以了

3.开始使用

如果是第一次使用需要输入一个账号密码,自己创建一个即可

可以看到只有30天试用期,先不管,点击continue trial,

4.下面搞个简单的工程试试

先拉个viewport到主窗体中

然后分别啦panel,tab panel和tree panel到主窗体中

下面设置viewport的布局方式,我们设置layout为border比较难找..

接下来设置mypanel的region属性为north如下图

接下来设置my tab panel的region属性为center,方法跟上面一样

最后设置my tree panel的region属性为west,方法跟上面一样

得到如下图

5.保存项目

然后到工程保存的地方打开app.html用chrome打开

感觉用起来还是很不错的,比我们手工查api来写要快点,特别是用过delphi等的人

经验分享 程序员 微信小程序 职场和发展