admin 管理员组文章数量: 1086019
2024年3月13日发(作者：eloise是好名字吗)
Extjs学习笔记
Panel属性：
var panel = new (
{
title:"信息系统",
titleCollapse:true,//是否点击整个标题栏都可以收缩
width:1000,
height:600,
//renderTo:"index"//在哪个元素中渲染
frame:true,//如果为true 则panel具有全部阴影，否则只有1px
边框
//floating:true,
draggable:true,//是否允许拖动
//plain:true,//方角 默认
collapsible:true,
//contentEl:'divPanelContent'//此属性可以简写成“el”，显
示哪个元素中的内容
contentEl：就是panel中要显示的内容，不过它的值是一个html元素的id，例如上面我们就指
明为"divPanelContent"，这样panel中就会显示这个层中的内容。当然如果只是简单的内容的
话，我们可以直接使用html这个属性来指明panel内部的内容。
tools:[{id:"Save",
handler:function(){("系统提示","
保存页面成功!");}},
{id:"Help"},
{id:"Close",
handler:function(){("index").hide();}}],
tbar:['请输入关键字:',
new em("工具栏"),
{xtype:'textfield',width:80},'-',
{text:'有种就点一下',handler:function(){alert("
小子，你刚才点了此按钮！");}},
{xtype:"tbfill"},
{pressed:true,text:'添加'},
{xtype:"tbseparator"},
{pressed:true,text:'保存'}
bbar:[{text:"按钮3"},{text:"按钮4"}], //底部工具栏状
态栏
html:'
hello,my name is 274!
',//html:"这
是在Panel中的内容..."
],
buttons:[{text:"按钮5"},{text:"按钮6"}], //footer部工
具栏
buttonAlign:"left"
});
//();
("index");//在哪个元素中渲染
renderTo指的是渲染到哪个元素上，因为对于Ext来说所有的我们看到的控件都是通过基本的
html来模拟的，而panel要想显示就必须通过层来模拟，所以从上面你也能够看到我们指定
panel渲染到"divPanel"这个Html原色上。当然对于renderTo这个属性如果我们不配置的话
也是可以的，这样的话我们可以在定义好panel之后，通过("divPanel");来渲
染，其实是一样的。
对比上面的代码时我们主要看一下标有"x-panel"样式的div是在哪个div。对于第一幅图具有
"x-panel"属性的div的id为"myPanel",而对于第二幅图，对应得是"divPanel"。也就是说
renderTo对应于其所在元素的父元素，而applyTo对应元素本身。
接着说draggable属性，这个属性指示是否panel可以拖拽，如果为true就可以拖拽，但是
你会发现虽然能拖拽但是鼠标松开之后会回到原位置。那么下面我们就寻求正常拖拽的方法。
方法很简单，只需要覆盖Draggable。
floating: true,//如果为true则是浮动显示，否则内嵌。但是注意如果浮动不指定
setPosition是看不到的因为它处负增量位置
draggable:{
insertProxy:true,//拖动时是否显示原位置虚线
onDrag:function(e){
var pn=();//返回底层元素，用户得到元素属性
this.x=t(true);//得到横坐标
this.y=(true);//得到纵坐标
var sd=().shadow;//阴影
if(sd){
n(this.x,this.y,th(),ght());//重新放置阴
影到新位置
}
},
endDrag:function(e){
ition(this.x,this.y);
}
},
panel属性：
ad：有效的url字符串，把那个url中的body中的数据加载显示，
roll:设为true则内容溢出的时候产生滚动条，默认为false
ow:设为true显示设为"x-hidden"的元素，很有必要，默认为false
版权声明：本文标题：Extjs学习笔记 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/p/1710288128a566248.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论