《ext登录及tabpanel.docx》由会员分享，可在线阅读，更多相关《ext登录及tabpanel.docx（5页珍藏版）》请在三一文库上搜索。
1、.Ext个人学习资料1. 添加panel并居中显示Ext.onReady(function()var loginForm=new Ext.Panel(renderTo:"loginForm",width:300,height:200,title:"用户登录",frame:true,floating:true /表示panel是浮动的);var viewPort=new Ext.Viewport();var loginFormX=(viewPort.getSize().width-loginForm.getSize().width)/2;var login
2、FormY=(viewPort.getSize().height-loginForm.getSize().height)/loginForm.setPosition(loginFormX,loginFormY);)2. 验证码的好处：可以防止恶意的注入，以及恶意的注册。完整的验证码代码：<% page language="java" import="java.util.*,java.awt.*, java.awt.image.*,javax.imageio.*" pageEncoding="utf-8"%><%pag
3、e import="java.io.OutputStream"%><%!Color getRandColor(int fc,int bc)Random random=new Random();if(fc>255)fc=255;if(bc>255) bc=255;int r=fc+random.nextInt(bc-fc);int g=fc+random.nextInt(bc-fc);int b=fc+random.nextInt(bc-fc);return new Color(r,g,b);%><%response.setHeader(&
4、quot;Pragma","No-cache");response.setHeader("Cache-Control","no-cache");response.setDateHeader("Expires",0);/在内存中创建图片int width=60,height=20;BufferedImage image=new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);/获取图形上下文Graphics g=image.getGraphics
5、();Random random=new Random();/ 设定背景色g.setColor(getRandColor(200,250);g.fillRect(0,0,width,height);/设定字体g.setFont(new Font("Times New Roman",Font.PLAIN,18);/画边框/g.setColor(new Color();/g.drawRect(0,0,width-1,height-1);/随机产生155条干扰线，使图像中的认证码不易被其他程序探测到g.setColor(getRandColor(160,200);for(int
6、i=0;i<155;i+)int x=random.nextInt(width);int y=random.nextInt(height);int x1=random.nextInt(12);int y1=random.nextInt(12);g.drawLine(x,y,x+x1,y+y1);/取随机产生的认证码（4位数字）String sRand=""for(int i=0;i<4;i+)String rand=String.valueOf(random.nextInt(10);sRand+=rand;/将认证码显示到图像中g.setColor(new Co
7、lor(20+random.nextInt(110),20+random.nextInt(110),random.nextInt(100);/调用函数出来的颜色相同，可能是因为种子太接近，所以只能直接生成g.drawString(rand,13*i+6,16); /将认证码存入sessionsession.setAttribute("rand",sRand);/图像生效g.dispose();OutputStream output=response.getOutputStream();/输入图像到页面ImageIO.write(image,"JPEG",
8、response.getOutputStream();output.flush(); out.clear();out=pageContext.pushBody(); %>3. 如何调用验证码：var rc=Ext.getDom("randcode");var rcp=Ext.get(rc.parentNode);rcp.createChild(tag:"img",src:"random.jsp",align:"absbottom");4. 有关活动面板的添加a) 如何在tabPanel中添加一个活动面板。点击
9、树节点时添加监听事件："click":function(n) if(isOpen=false) var tab=Ext.getCmp("tabPanel"); var tagPage=tab.add( title:n.text, html:"路线管理", closable:true, listeners: "beforedestroy":function(aa) alert(aa); isOpen=false; ); tab.setActiveTab(tagPage); isOpen=true; b) 如何添加右键
10、菜单栏，给tabPanel添加右键事件listeners: "contextmenu":function(tabPanel,tab,e) var cc=new Ext.menu.Menu( text:"关闭当前选项页",handler:function() if(tabPanel.getItem(0)!=tab) tabPanel.remove(tab); , text:"关闭其他所有选项卡", handler:function() tabPanel.items.each(function(item) if(item!=tab&
11、;&item!=tabPanel.getItem(0) tabPanel.remove(item); ) ); cc.showAt(e.getPoint(); c) 如何设置打开面板是唯一的i. 设置一变量，初始值为false。var isOpen=false;ii. 在变量为false时打开，打开后设置变量为true。添加销毁监听事件，在组件销毁时在设置默认值为false。if(isOpen=false) var tab=Ext.getCmp("tabPanel"); var tagPage=tab.add( title:n.text, html:"路线管理", closable:true, listeners: "beforedestroy":function(aa) alert(aa); isOpen=false; ); tab.setActiveTab(tagPage); isOpen=true;: