ComponentArt控件分析之ComboBox(2)
一.来看下数据数据解析
首先后台先生成一种数据格式,这种格式跟JSON差不多(不知道为什么不用JSON),查看HTML源代码
2.需要定义一个ComboBoxItem对象(自然要定义数据集合类型了),其中js也要定义,数据结构采用HashTable,查找速度快.其中定义了一个JavaScriptArray用来转换数据
private string BuildStorage()
{
JavaScriptArray arNodeList = new JavaScriptArray();
foreach (ComboBoxItem oItem in this.Items)
{
ProcessItem(oItem, arNodeList);
}
string strList=arNodeList.ToString();
return strList;
}
private void ProcessItem(ComboBoxItem oItem, ArrayList arNodeList)
{
ArrayList itemProperties = new ArrayList();
foreach (string propertyName in oItem.Properties.Keys)
{
switch (propertyName.ToLower())
{
// bools
case "enabled": itemProperties.Add(new object[] { "Enabled", oItem.Enabled }); break;
// normal string handling
default:
itemProperties.Add(new object[] { propertyName, oItem.Properties[propertyName] });
break;
}
}
arNodeList.Add(itemProperties);
}
3.前台处理数据
数据得到以后就要处理
前段的ComboBox(Initialize)初始化时会调用Render方法,Render方法会调用RenderDropDown方法,RenderDropDown方法调用RenderItem方法,把每项都呈现出来
二.展开下拉框
看这部分花了我一些时间.
本来的话展开下拉框和关闭下拉框只需要设置一个css样式就可以了的.事情上确实可以这么做.
ComboBox同时还提供了2个属性CollapseSlide用于设置滑动效果,CollapseDuration用于设置滑动效果的持续时间.
客户端api提供了Collapse和Expand方法,用于关闭和展开下拉框.按照我的思维就是直接设置下xx.style.display="none"了事.这样就可以用了.为了给控件加上滑动时的效果.这个两个方法基本没做什么.而是调用了相关的方法如ComponentArt_ComboBox_CollapseStep方法.
这里涉及到递归的使用.在Collapse方法中设置了一个当前时间this.CollapseStartTime=(new Date()).getTime();
然后ComponentArt_ComboBox_CollapseStep方法再获取现在时间与CollapseStartTime相比较,时间差与CollapseDuration属性相比较.当时间差达到CollapseDuration属性值时,即递归结束.
看代码
1.
if(this.Resizing){
return ;
}
var _20=document.getElementById(this.Id+"_DropDown");
if(_20&&_20.style.display!="none"){
_20.style.overflow="hidden";
this.CollapseElement=_20;
//设置当前时间
this.CollapseStartTime=(new Date()).getTime();
var _21=_qFF(_20);
//递归调用
ComponentArt_ComboBox_CollapseStep(this,_21);
//_20.style.display="none";
}
this.Expanded=false;
};
2.
if (!_d.CollapseElement) {
return;
}
var _f = (new Date()).getTime()-_d.CollapseStartTime;
var _10 = ComponentArt_SlidePortionCompleted(_f, _d.CollapseDuration, _d.CollapseSlide);
if (_10 == 1) {
//alert(_d.CollapseElement.style.height);
//_d.CollapseElement.style.height = 280+"px";
//隐藏
_d.CollapseElement.style.display = "none";
_d.CollapseElement = null;
_d.HideOverlay();
var _11 = _d.get_events().getHandler("collapse");
if (_11) {
_11(_d, Sys.EventArgs.Empty);
}
} else {
var _12 = Math.ceil((1-_10)*_e);
if (_d.ExpandDirection == 1) {
_d.CollapseElement.style.top = (_d.ExpandBaseLine-_12)+"px";
}
//高度的滚动在此更改
_d.CollapseElement.style.height = _12+"px";
//alert(_d.CollapseElement.style.height);
//递归调用
setTimeout("ComponentArt_ComboBox_CollapseStep("+_d.Id+","+_e+");", ComponentArt_ComboBox_SlideDelay);
}
//document.getElementById("aa").innerHTML+="_f---------"+_f+"_10-------"+_10+"-----------"+_d.CollapseElement.style.height+"<br>"
//alert("_10"+_10+"<br>"+_d.CollapseElement.style.height);
};
3.
window.cart_slidetype_exponentialaccelerate=1;
window.cart_slidetype_exponentialdecelerate=2;
window._q87=3;
window.cart_slidetype_quadraticaccelerate=4;
window.cart_slidetype_quadraticdecelerate=5;
/**//**
*
* @param {Object} 时间差
* @param {Object} 持续时间
* @param {Object} 效果
*/
window.ComponentArt_SlidePortionCompleted=function (_4a,_4b,_4c){
if(_4c==cart_slidetype_none||_4a>=_4b){
return 1;
}
var _4d=(_4c==cart_slidetype_exponentialaccelerate)||(_4c==cart_slidetype_quadraticaccelerate);
if(_4d){
_4a=_4b-_4a;
}
//4a(时间差计算)与_4b相比较
var _4e=_4a/_4b;
var _4f;
switch(_4c){
case _q87:
_4f=_4e;
break;
case cart_slidetype_exponentialdecelerate:
case cart_slidetype_exponentialaccelerate:
_4f=1-Math.pow(1/300,_4e);
break;
case cart_slidetype_quadraticdecelerate:
case cart_slidetype_quadraticaccelerate:
_4f=Math.pow(_4e,2);
break;
}
if(_4d){
_4f=1-_4f;
}
//document.getElementById("aa").innerHTML+=Math.min(Math.max(0,_4f),1)+"<br>";
return Math.min(Math.max(0,_4f),1);
};
看个截图
好了,结束
转载于:https://www.cnblogs.com/Clingingboy/archive/2007/07/07/808759.html
ComponentArt控件分析之ComboBox(2)相关推荐
- 在DataGridView控件中加入ComboBox下拉列表框的实现
原文 http://www.cnblogs.com/luqingfei/archive/2007/03/28/691372.html 虽然在Visual Studio中 DataGridView控件的 ...
- Delphi皮肤控件分析与QQ的皮肤变色功能
关于界面美化方面,一直是一个脑壳疼的问题!以前一直偷懒,使用的三方控件!但是在使用了一段时间之后,都或多或少的有些问题!不是我说三方控件如 何如何的不好!只是三方控件多是庞大的一个肢体,要兼顾的用户群 ...
- 【Android归纳】基于XListView的下拉刷新、上拉加载更多的控件分析
目录 前言 功能介绍 总体设计 组成 类关系图 详细设计 XlistViewHeader原理分析 XListViewFooter原理分析 XListView原理分析 代码带注释下载 目录 前言 如果你 ...
- vb.net 教程 3-4 窗体编程 公共控件2 radiobutton ComboBox
版权声明:本文为博主原创文章,转载请在显著位置标明本文出处以及作者网名,未经作者允许不得用于商业目的. 5.radiobutton 单选框.与checkbox不同的是,这个控件同时只能选择其中一个.不 ...
- 教你用ActiveReports报表控件分析京东双十一数据的价值
随着双十一购物盛会落下帷幕,各大电商平台纷纷公布出自己今年的成绩.与其它同行不同的是,京东除了公布1598亿的线上下单金额,还公布了线上线下融合的战果. 面对京东线上.线下海量数据源,我们该如何进行整 ...
- VC++中combo box(组合框)控件使用说明/MFC COMBOBOX的使用
转自:不知道... Combo Box (组合框)控件很简单,可以节省空间.从用户角度来看,这个控件是由一个文本输入控件和一个下拉菜单组成的.用户可以从一个预先定义的列表里选择一个选项,同时也可以直接 ...
- ASP.NET的五大数据控件分析
ASP.NET 数据控件:GridView,DataList,Repeater ,DetailsView,FormView. ASP.NET 数据控件综述: 1.前3个用于呈现多条记录,后面2个用于呈 ...
- easyui之combo控件分析
/** * combo - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * Co ...
- easyui之datagrid控件分析
/** * datagrid - jQuery EasyUI * * Licensed under the GPL: * http://www.gnu.org/licenses/gpl.txt * * ...
最新文章
- python 如果没有该key值置为空_在python字典中用“None”替换空值
- Halcon - 定位 - 卡尺
- as将安卓应用打包_Android Studio打包生成apk的方法(超级简单哦)
- OpenShift 4 Hands-on Lab (12) 使用配置参数和环境变量
- EDIUS 9 PRO(视频编辑软件)
- java 制作签名版电子合同
- PyQt5 关于消息盒子QMessageBox 不显示消息盒子且出现内存不足的问题
- 提升网页加载速度 | google网站速度测试
- 凭什么软件测试入门就有一万+工资,为什么?我不相信。
- iTop-4412 裸机教程(一)- 从启动方式开始
- 面试角度分析:微信里面让你删掉一个功能,你选哪个?
- 燕十八 Mysql 笔记 68 课
- mysql 存储类型文本最大长度longtext
- 十八、绘制游戏背景图片
- 圣诞要到了~教你用Python制作一个表白神器——照片墙,祝你成功
- 图片太大不要慌,简单的调整图片大小
- mybatis lazyload
- java 获取 word 窗体域_办公小技巧:巧用窗体域 控制Word文档修改区
- 删了 GPL 协议转闭源?法院判决:GPL 协议终身有效
- 深度操作系统 15.2——怀揣梦想,笃定前行
热门文章
- [BZOJ1036][ZJOI2008]树的统计Count(树链剖分)
- java代码逆向工程生成uml
- CCF NOI1072 爬楼梯
- 我看ITIL在中国(六):如何建设有中国特色的IT运维管理平台【三】
- 51aspx技术文章汇总搜集
- Web前端JavaScript笔记(4)节点
- java 时间转为毫秒数_疫情期间面试总结一(java基础方面)
- python原理_强化学习:原理与Python实现
- 表格中序号怎计算机课程视频,【答疑】在Excel表格里输入了文字后怎么下拉顺序号啊?如何在表格里添加序号? - 视频教程线上学...
- 大数据后从此再无隐私_0-2输球后,恒大再迎2大坏消息,2项数据很尴尬,补时还后场倒脚...