- 浏览: 273127 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
zhuzhuhenzhencheng:
密码是什么啊
Ext表格(Grid)上面的悬浮提示 -
鹿惊_:
确实如雪中送炭般温暖!
Ext扩展整理后吐血奉献 -
ortega1_2_3:
该版本貌似有bug,当sockIOPool的自平衡线程self ...
Java MemCached Window简单实现 -
q6952592:
好。解决了我的兼容模式下出现的问题。
Ext表格(Grid)上面的悬浮提示 -
fei33423:
请参考 fei33423的文章 java中直接调用groovy ...
Groovy应用(Java与Groovy间相互调用)
1、安装Aptana IDE
本程序应用的是Aptana Studio 2.0
2、安装好 Aptana 开发工具之后 安装ExtJS及Air插件
点击这里的 Install Plugins 进行安装 ExtJS支持
选择安装 ExtJS ,单击 Get it 我这里已经将ExtJS的支持已经加了进去所以显示 This plugin is up to date
然后安装对 Adobe Air的支持
同上操作 选中安装 Adobe AIR1.5
之后去 Adobe 官网上面去下载 AdobeAIRSDK,下载之后进行解压配置到Aptana里面
(你解压文件的跟路径)
其次配置Aptana对JavaScript 的 Code Assist 属性,主要是将 Ext与Adobe AIR勾选上
到此为止 对于IDE的环境配置就已经完成了。
现在开始创建一个HelloWorld实例
现在这个HelloWorld创建成功,现在我们运行一下
运行结果:
如果你可以如上图的运行结果,现在我们可以将 ExtJS 集成到项目当中了 呵呵
修改 MyAir.html 页面内容 :
<html> <head> <title>ExtJS & AIR Sample</title> <!--引入ExtJS--> <link rel="stylesheet" type="text/css" href="lib/ext/resources/css/ext-all.css" /> <link rel="stylesheet" type="text/css" href="lib/ext/air/resources/ext-air.css" /> <script type="text/javascript" src="lib/ext/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="lib/ext/ext-all-debug.js"></script> <script type="text/javascript" src="lib/ext/air/ext-air.js"></script> <script type="text/javascript" src="lib/ext/air/src/SystemTray.js"></script> <!--引入Air--> <link href="sample.css" rel="stylesheet" type="text/css"/> <script type="text/javascript" src="lib/air/AIRAliases.js"></script> <script type="text/javascript" src="lib/air/AIRIntrospector.js"></script> <script type="text/javascript" src="myAir.js"></script> </head> <body> <div style="margin: 5px"> <div id="contactList"></div> </div> </body> </html>
添加 myAir.js 文件
/** * @author JLee */ Ext.onReady(function() { var contactName = new Ext.form.TextField({ fieldLabel:'姓名', name:'name', anchor:'100%' }); var contactEmail = new Ext.form.TextField({ fieldLabel:'Email地址', name:'email', anchor:'100%', vtype:'email' }); var contactPhone = new Ext.form.TextField({ fieldLabel:'电话', name:'phone', anchor:'100%' }); var contactDOB = new Ext.form.DateField({ fieldLabel:'生日', name:'dob', anchor:'100%', format:'Y-m-d' }); var newForm = new Ext.form.FormPanel({ baseCls: 'x-plain', labelWidth: 95, defaultType: 'textfield', autoShow: true, items: [contactName, contactEmail, contactPhone, contactDOB] }); var newWin = new Ext.Window({ title: '添加记录', resizable: false, width: 300, height: 200, layout: 'fit', bodyStyle: 'padding:5px;', closeAction: 'hide', plain: true, items: newForm, buttons: [{ text: '提交', handler: function(){ contactStore.insert(0, new Ext.data.Record({ name: contactName.getValue(), email: contactEmail.getValue(), phone: contactPhone.getValue(), dob: contactDOB.getRawValue() })); this.ownerCt.hide() newForm.getForm().reset(); contactGrid.getSelectionModel().selectFirstRow(); } }, { text: '取消', handler: function(){ this.ownerCt.hide() } }] }); var win = new Ext.air.NativeWindow({ id: 'mainWindow', instance: window.nativeWindow, // minimizeToTray: true, trayIcon: 'icons/AIRApp_16.png', trayTip: '通讯管理', trayMenu: [{ text: 'Open', handler: function() { win.activate(); } }, '-', { text: 'Exit', handler: function() { win.activate(); Ext.Msg.show({ title:'Confirm Exit', msg:'Are you sure you wish to exit Contact Manager?', buttons:Ext.Msg.YESNO, fn: function(btn, text) { if(btn == "yes") { air.NativeApplication.nativeApplication.exit(); } }, animEl: 'elId', icon: Ext.MessageBox.QUESTION }); } }] }); win.on('closing', function (e) { e.preventDefault(); win.activate(); Ext.Msg.show({ title:'系统提示', msg:'是否确定真的退出?', buttons:Ext.Msg.YESNO, fn: function(btn, text) { if(btn == "yes") { air.NativeApplication.nativeApplication.exit(); } }, animEl: 'elId', icon: Ext.MessageBox.QUESTION }); }); Ext.state.Manager.setProvider(new Ext.state.CookieProvider()); function linkEmail(val){ return '<a href="mailto:' + val + '">' + val + '</a>'; } var recordArray = [ {name:'name',mapping:'name' }, {name:'email',mapping:'email' }, {name:'phone',mapping:'phone' }, {name:'dob',mapping:'dob' } ] ; var record = new Ext.data.Record.create(recordArray); var rowNum = new Ext.grid.RowNumberer(); var sm = new Ext.grid.CheckboxSelectionModel(); var cm = new Ext.grid.ColumnModel({ defaultSortable : true, columns :[ rowNum ,sm , {header: "姓名", width: 120, sortable: true, dataIndex: 'name'}, {header: "Email地址", width: 160, sortable: true, renderer: linkEmail, dataIndex: 'email'}, {header: "电话号码", width: 120, sortable: true, dataIndex: 'phone'}, {id:'birth',header: "出生日期", width: 120, sortable: true, dataIndex: 'dob'} ] }); var contactStore = new Ext.data.Store({ proxy : new Ext.data.HttpProxy({url:'data.json',method:'POST'}), reader:new Ext.data.JsonReader({ totalProperty:"totalProperty", root:"root" },record), remoteSort:true }); var contactGrid = new Ext.grid.GridPanel({ store: contactStore, cm : cm , sm : sm , stripeRows: true, autoExpandColumn: 'birth', autoHeight:true, autoWidth : true , title:'联系表', tbar : [{ text:'查询' , handler : function(){ contactStore.load(); } },{ text:'添加' , handler : function(){ newWin.show(); } },{ text:'修改' , handler:function(){ alert(''); } },{ text:'删除' , handler: function() { if (contactGrid.getSelectionModel().getCount() == 1) { Ext.Msg.show({ title: '系统提示', msg: '是否确认删除这条记录?', buttons: Ext.Msg.YESNO, fn: function(btn, text){ if (btn == "yes") { contactStore.remove(contactGrid.getSelectionModel().getSelected()); contactGrid.getSelectionModel().selectFirstRow(); } }, animEl: 'elId', icon: Ext.MessageBox.QUESTION }); } } },{ text : '退出' , handler : function(){ Ext.Msg.show({ title:'系统提示', msg:'是否真的退出系统?', buttons:Ext.Msg.YESNO, fn: function(btn, text) { if(btn == "yes") { air.NativeApplication.nativeApplication.exit(); } }, animEl: 'elId', icon: Ext.MessageBox.QUESTION }); } },{ text:'帮助' , handler:function(){ new Ext.Window({ title : '系统说明' , width : 240 , height : 180 , html : 'ExtJS 结合 Air<br />制作人:JLee' , resizable : false , modal : true }).show(); } }] }); contactGrid.render('contactList'); // new Ext.Window({ // width : 400 , // height : 300 , // items : [contactGrid] , // }).show(); });
添加 JSON 数据文件 data.json
{ totalProperty : 2 , root : [{ name : 'jlee',email:'444823046@qq.com',phone:13582461851 ,dob:'2011-01-01' },{ name : 'Java',email:'444823046@qq.com',phone:13582461851 ,dob:'2011-01-01' }] }
此时的运行结果:
好,项目完成!
接下来的任务是将这个程序 打包为 *.air 文件 然后安装到自己的机器上。
选中项目 MyAir -->右键单击--> Export --> Adobe AIR Package --> Next -->
然后需要输入 Certificate 与 Certificate Password 如果你是第一次使用 可以自己先 配置一个 Certificate ,选择右边的 Configure Certificate --> add --> 输入Certificate名字 --> 选择单选按钮(Create new certificate) --> OK
Certificate 与 Certificate Password 输入之后 --> Next --> Finish
好了,很简单吧。
现在到你的工程跟目下就可以找到 MyAir.air 这么一个文件了 。
当然现在 你的系统如果还没有安装 Adobe AIR Runtime 所以可能显示的是系统未知文件的图标
现在你需要到Adobe 网站上面去下载 Adobe AIR Runtime 的安装文件
下载到本机之后双击安装 AdobeAIRInstaller.exe
安装之后 MyAir.air 文件显示的样子为
这就说明 你已成功安装 Adobe Air 的运行环境,直接鼠标双击该文件即可安装。
选择安装即可
装好之后会在你的桌面上面出现一个快捷方式的图标
直接双击即可运行了。
如图:
发表评论
-
JSON查看工具
2012-03-09 22:26 0Eclipse 的json插件: 这款插件主要功能是把jso ... -
gzip压缩JavaScript
2012-02-13 17:14 5696为了提高客户端的体验效果,RIA开发逐渐兴起。这样 ... -
Ext扩展整理后吐血奉献
2012-01-19 13:58 7124对 Ext 扩展的一些小总结 1、multicombo (多 ... -
JSON LIB转化时间
2011-11-02 09:32 1327Ext Grid显示Json lib 转化时间为object的 ... -
JS计算日期差
2011-09-24 14:04 1554function Computation(sDate1,sDa ... -
将Air文件转换为EXE进行部署
2011-06-14 17:21 1690如果你的air sdk还没有升级到2.0 那显然是不行的. ... -
禁止IE的backspace键(退格键),但输入文本框时不禁止
2011-06-09 09:59 3659Ext实现方式: Ext.getDoc().on('keyd ... -
Ext中集成在线编辑器Ext.ux.TinyMCE
2011-05-31 15:46 3069Ext.ux.TinyMCE第三方对Ext 在线编辑器的扩展, ... -
Ex的Ajax请求实现同步
2011-05-31 15:29 1330Ext2,.x的Ajax实现同步 Ext.lib.Ajax. ... -
JS实现将XML转化为JSON
2011-05-31 15:09 5553直接上代码 xmlToJson={ parser: ... -
Ext表格(Grid)上面的悬浮提示
2011-05-30 16:36 7542方法一 使用render //鼠标放在Grid上面显示提示 ... -
开发者最容易犯的13个JavaScript错误
2011-04-25 10:28 6981.for.. 数组迭代的用法 U ... -
Ext皮肤切换
2011-04-22 10:46 3320/** * @author JLee * @since ... -
JS获取屏幕大小
2011-04-18 16:56 1221<html> <script> f ... -
在js中对中文和特殊字符转码
2011-04-14 14:21 3913直接上代码 js对文字进行编码涉及3个函数:escape,e ... -
XTemplate
2011-03-16 14:07 4537Ext XTemplate的应用: template. ... -
读取Properties文件中的内容填充本地combo
2011-03-10 16:24 1826首先定义一个properties文件放到classpath路径 ... -
汉字转换为拼音
2011-03-09 10:11 4562首先定义一个html页面: ... -
Ext Grid 实现批量添加或者修改
2011-03-02 22:30 4428将ExtJS Grid 中的record逐一转化为Bean,实 ... -
ExtJS中submit与Ajax的success
2010-11-12 23:10 7877Ajax中使用Success使用response接收后台传来的 ...
相关推荐
NULL 博文链接:https://baiweiyll.iteye.com/blog/566656
Aptana 的 Extjs 3.1 插件. 将其解压到Aptana内dropin文件夹或者对应的feature和plugin即可.
如今Aptana Studio 1.0支持如下几大方面的开发功能:1、AJAX开发环境 HTML/JavaScript/CSS编辑器 prototype/dojo等常见AJAX类库集成和提示 JSON编辑器 2、Adobe AIR开发环境 3、Apple iPhone开发环境 4、Ruby on ...
随着苹果公司iPhone手机的发布,Aptana也推出了功能完备的iPhone集成开发功能,在Adobe公司的RIA产品AIR推出不久之后,Aptana就支持了AIR的开发环境。如今Aptana Studio 1.0支持如下几大方面的开发功能: ● 1、AJAX...
AptanaStudio是一个基于Eclipse的集成式Web开发环境,其最广为人知的是它非常强悍的JavaScript编辑器和调试器。AptanaStudio可以支持多种AJAX和JavaScript工具箱,包括JavaScript编辑和调试。此外,Aptana还吸收了...
MyEclipse插件、Eclipse插件,方便JavaScript学习使用
随着苹果公司iPhone手机的发布,Aptana也推出了功能完备的iPhone集成开发功能,在Adobe公司的RIA产品AIR推出不久之后,Aptana就支持了AIR的开发环境。如今Aptana Studio 1.0支持如下几大方面的开发功能: 1、AJAX...
aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题aptana主题
aptana studio 1.5.1 crack aptana studio 1.5.1 crack aptana studio 1.5.1 crack
Aptana3.0.9卷2全部有三Aptana3.0.9卷2全部有三
Aptana Studio 是一个集成式的Web应用程序开发环境,它不仅可以作为独立的程序运行,而且还可以作为Eclipse插件使用。所以,如果您已经安装了Eclipse的话,就可以将Aptana作为插件直接安装到您的Eclipse环境中。
Aptana 3.4.2 插件系列 请依次下载
myeclipse 插件aptana spket properties
aptana3.6 插件
Aptana 3.4.2 插件共4分,请搜索依次下载 Aptana 3.4.2 插件1 Aptana 3.4.2 插件2 Aptana 3.4.2 插件3 Aptana 3.4.2 插件4
Aptana 2.0 plugin 2/2 aptana最新版
eclipse aptana 3.7插件
Aptana RadRails,作为一款Eclipse的插件,主要的作用就是JavaScript的调试和智能提示,就想你跟踪Java bug那样方便,有助于提升javaweb的开发效率
Aptana Studio 3 如何汉化
*Adobe AIR与iPhone开发工具 其主页上还提供如何使用该开发工具的视频。 Aptana 下载主页://www.aptana.com/ 带有语法提示,支持WEB标准 一款非常优秀的Javascript(AJAX) 开发工具:Aptana。应为它实在太棒了...