本文目录一览：
- 1、extjs 如何与adobe air整合
- 2、问问在extjs里怎么限制访问设计页面的ip
- 3、想用Extjs做一个左右布局的格式
- 4、extjs的card布局中使用XTemplate模板填充item的问题
- 5、使用ExtJS编写的饼状图中间的步骤问题。
- 6、extjs 表格编辑，动态显示列怎么弄
extjs 如何与adobe air整合
构建开发环境
一、 开发环境
a. 开发工具版本
Eclipse JEE : Version: 3.4.0 ;
Aptana Studio Professional: Version: 1.2.1.019949_200811212258
Aptana Adobe AIR Support: Version: 1.2.1.019949_200811212306
EXTJS: Version: 2.2
AIR SDK: Version: Adobe AIR 1.5 SDK
b. 环境构建
这个就不多说了，大家自己看着构建吧，很简单的。一定要注意版本，上面的版本是我测试通过的，大家可以放心使用。
开发应用程序
二、 开发应用程序
a. 新建一个 Adobe AIR Project项目， FileNewProject,打开 New Project向导，如下图：
b. 输入项目名称 Julycn，其他可以保持不变
c. 可以定义你的版本、描述、版权信息和应用程序图标等字符，也可以在application.xml文件中定义这些信息。
d. 定义项目的尺寸，是否可以改变窗口大小、最小化、最大化等
e. 导入 AIR框架，默认就可以了
f. 导入第三方 AJAX库，我选择了 EXTJS库
g. 自动打开主项目文件， julycn.html会自动生成一些内容，并且可以运行
h. 运行应用项目 ,这里不做修改，了解一下基本的环境和开发方式 ;
i. 运行结果 ,里面有三个按钮，单击 ”Read a local file using AIR Apis”是读取本地文本文件 LocalFile.txt的内容，演示 API处理本地文件系统；如果单击”doRequest(“”);”按钮， AIR 应用程序将弹出另一个警告框，这一次显示的是来自 Adobe.com 的 HTTP 响应。这演示了 XMLHttpRequest 对象如何处理远程 Web站点。
打包应用程序并安装
三、 打包应用程序
a. 在 Julycn项目上点击右键 Export...Adobe AIR Package,取消 Package and generate Jaxer build version选框，点击 Next
b. 这一步就是创建一个证书，点击 Configure Certificates创建一个证书 ,Timestamp AIR Package这个选框一定要去掉，否则打的包无法安装。
c. 选择要打包的文件，这个默认即可
d. 现在可以到 D:\\workspace\\Julycn目录下双击 Julycn.air文件，进行安装。如果无法打开文件，请确认是否安装 Adobe AIR runtime.
e. 安装偶就不说啦 .
四、 请关注后续教程，开发一个增删该查的应用程序
问问在extjs里怎么限制访问设计页面的ip
为了方便管理，我想把服务器上的某个文件夹共享出来，只允许特定IP的计算机进行访问。如何实现了？service2003操作系统...我在网上找到了答打开：控制面版--管理工具-本地安全设置。点左边的 IP安全策略，在本地计算机。 然后在右边点右键--创建IP安全策略，打开IP安全策略向导。 下一步，出现IP安全策略名称，随便起个就行。比如叫 阻止192.168.1.16 下一步，出现激活默认响应规则，不要选中，把钩去掉。 下一步，选中编辑属性，完成。 然后出现了 IP安全策略属性，点下边的添加，出现规则属性，点击添加，出现IP策略器列表。把使用添加向导去掉，点右边的添加，出现筛选器属性。 寻址栏 原地址选 一个特定的IP 192.168.1.163。目标IP是 我的IP地址。然后点击确定。 现在回到 IP 筛选器列表，点击确定，在规则属性里应该多了个列表，选中它。然后切换到筛选器操作选项卡，把使用添加向导去掉，点击添加。在出现的筛选器操作 属性里的安全措施选项卡中，选择 阻止，点击确定。在筛选器操作选项卡中会多出一个阻止的选项，选中它。 总之，在IP筛选器列表中你要选中你建的那个列表，筛选器操作中要选中阻止。然后点击应用以后关闭。 现在回到 IP安全策略 属性 这里，把你建的IP筛选器列表钩上，点击关闭。 这时，在你最开始打开的 本地安全设置里 会多出一个策略，就是你建立的 “阻止192.168.1.16”。在它身上点右键，选择指派，就OK了。
想用Extjs做一个左右布局的格式
下面的示例代码展示了一个基本的Card布局，布局中并没有包含form元素，具体情况，还要根据实际情况进行处理：
//Card布局__类似向导
Ext.application({
name: 'HelloExt',
launch: function () {
var navigate = function (panel, direction) {
var layout = panel.getLayout();
layout[direction]();
Ext.getCmp('move-prev').setDisabled(!layout.getPrev());
Ext.getCmp('move-next').setDisabled(!layout.getNext());
};
Ext.create('Ext.panel.Panel', {
title: 'Card布局示例',
width: 300,
height: 202,
layout: 'card',
activeItem: 0,
x: 30,
y: 60,
bodyStyle: 'padding:15px',
defaults: { border: false },
bbar: [{
id: 'move-prev',
text: '上一步',
handler: function (btn) {
navigate(btn.up("panel"), "prev");
},
disabled: true
},
'-',
{
id: 'move-next',
text: '下一步',
handler: function (btn) {
navigate(btn.up("panel"), "next");
}
}],
items: [{
id: 'card-0',
html: 'h1第一步/h1'
},
{
id: 'card-1',
html: 'h1第二步/h1'
},
{
id: 'card-2',
html: 'h1最后一步/h1'
}],
renderTo: Ext.getBody()
});
}
});
extjs的card布局中使用XTemplate模板填充item的问题
本质原因是变量_pageFile是在render事件触发后，才调用事件函数然后去获取这个参数，而这个参数最后的结果是数据的最后一个值，修改代码如下：
//..
listeners : {
'render' : function(panel){
console.log(this);
this.tpl.overwrite(this.body, this.initialConfig.pageFile);
}
},
scope : this,
pageFile : _pageFile
//..
完整的例子：
var curIndex = 1;
var navHandler = function(){
if(curIndex == 2) {
curIndex = 0
}
card.getLayout().setActiveItem(curIndex);
curIndex ++;
};
var card = new Ext.Panel({
title: '向导的演示 Example Wizard',
layout:'card',
activeItem: 0,
bodyStyle: 'padding:15px',
defaults: {
// 每个子组件都有效 applied to each contained panel
border:false
},
// 简单的导航按钮，可以扩展更多 just an example of one possible navigation scheme, using buttons
bbar: [
{
id: 'move-prev',
text: '后退',
text: 'Back',
handler: navHandler.createDelegate(this, [-1]),
disabled: true
},
'-',
{
id: 'move-next',
text: '前进 Next',
handler: navHandler.createDelegate(this, [1])
}
],
// 内面的面板，就是“卡片” the panels (or "cards") within the layout
items: []
});
var dataFile = [
{
pageFile : [
{
spec : 1,
pic : 11,
ranged : 111
}
]
},
{
pageFile : [
{
spec : 2,
pic : 22,
ranged : 222
}
]
}
];
var _pageFile;
for (var i = 0; i dataFile.length; i++) {
_pageFile = dataFile[i];
//_pageFile =
card.add({
id: 'card-' + (i + 1),
tpl : new Ext.XTemplate(
'table border="1"',
'trtd规格/tdtd图片/tdtd对白/td/tr',
'tpl for="pageFile"',
'trtd{spec}/tdtd{pic}-{ranged}/tdtd{dialogue}-{ranged}/td/tr',
'/tpl',
'/table'
),
listeners : {
'render' : function(panel){
console.log(this);
this.tpl.overwrite(this.body, this.initialConfig.pageFile);
}
},
scope : this,
pageFile : _pageFile
});
}
card.render(document.body)
使用ExtJS编写的饼状图中间的步骤问题。
打开电子表格，（EXCEL）把相应的数据输在表格里。在表格上找到一个像“楼房”一样的图标叫“图表向导”点一下以后，按提示操作即可。
如果数据多，可以导入。
extjs 表格编辑，动态显示列怎么弄
这里说的应该是excel动态图表下拉显示列，操作方法如下：
1.制作包含了相关数据的Excel表格，以下以一份销售简表为例，说明该技巧的详细思路。
2.选择单元格A20（也可以是其他空白单元格），单击菜单栏“数据”→有效性”，打开“数据有效性”对话框，在“设置”选项卡下，“允许”的下拉菜单中，选择“序列”，在“来源”中，选择或输入来源位置（本例为$A$3：$A$16），确定之后，即可以为A20单元格建立下拉列表。
3.选择A20单元格的相邻单元格B20，输入公式=VLOOKUP($A$20,$A$3:$H$16,COLUMN(),)，回车后，选择B20单元格拖动右下角的填充柄将公式填充至H20。此时通过选择A20单元格的下拉菜单，选择不同的产品，会显示该产品的具体详细信息。
PS：VLOOKUP函数是一个查找函数，其基本解释是：在参数2（本例为$A$3:$H$16）首列中，垂直查找（按行查找）参数1（本例为$A$20），并返回参数3指定的第n列中相同行的数据，参数4为查找方式，参数4为0或省略或为FALSE时，表示精确查找，为1或者TRUE时表示模糊查找。
COLUMN为列函数，COLUMN（）表示返回当前单元格的列号。
4.选定A20：H20单元格区域作为图表的数据源，单击“插入”→图表”，打开“图表向导”对话框，按提示进行设置，制作好图表，需要不同产品的相关数据时，只需在A20单元格的下拉菜单中选择即可。该图表实现了随不同的对象而变化，可读性和可视效果都大大提高。
