NUI控件扩展
NUI组件是公司新一代的前端开发框架,它精致优雅的前端编程模型,是大家能够,或者想接受学习它的重要原因,在使用它的时候,一定不免会想增加自己的控件,让别人也能够如此优雅的使用。
其实NUI的扩展机制不是很复杂,下面说说如何扩展一个新的NUI控件,一共分为以下两步:
定义一个新的js文件,比如叫XxxControlImpl.js,js文件内容如下:
//定义XxxControl的构造方法
nui.XxxControl= function () {
nui.XxxControl.superclass.constructor.call(this);
};
//定义XxxControl的继承控件及其主体
nui.extend(
nui.XxxControl,
nui.XxxControlSuper, //要继承的父控件
//控件主体
{
uiCls: "nui-xxx", //注意:这个属性必须设置,否则调用nui.parse()方法不会正确解析此控件
yyy : "", //新属性
setYyy: function(value){
this.yyy = value;
},
getYyy: function(){
return this.yyy;
},
//属性解析赋值
getAttrs: function (el) {
var attrs = nui.XxxControl.superclass.getAttrs.call(this, el);
var jq = jQuery(el);
nui._ParseString(el, attrs,
["yyy"]
);
return attrs;
},
//初始化此控件调用的方法
_create: function () {
nui.XxxControl.superclass._create.call(this);
。。。。。。
},
//初始化事件调用的方法
_initInputEvents: function () {
nui.XxxControl.superclass._initInputEvents.call(this);
this.on("buttonclick", this.__ZzzClick, this);
。。。。。。
}
});
//把定义XxxControl控件注册到NUI体系中
nui.regClass(nui.XxxControl, 'xxx');
使用,比如一个test.html中的内容如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>选择资源</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script src="common/nui/nui.js" type="text/javascript"></script>
<script src="XxxControlImpl.js" type="text/javascript"></script>
</head>
<body>
<input id="test" class="nui-xxx"/>
<script type="text/javascript">
nui.parse();
</script>
</body>
</html>
通过上面两步,是不是很简单的就可以扩展出一个新的控件?
NUI控件扩展的更多相关文章
- 给easyui datebox时间框控件扩展一个清空的实例
给easyui datebox扩展一个清空的实例 步骤一:拓展插件 /** * 给时间框控件扩展一个清除的按钮 */ $.fn.datebox.defaults.cleanText = '清空'; ( ...
- WPF开源控件扩展库 - MaterialDesignExtensions
Material Design Extensions 在WPF开源控件库 Material Design in XAML Toolkit(本站介绍:链接)的基础上进行了控件扩展和特性新增.本开源项目中 ...
- Silverlight中DataPager控件扩展
大家一定遇到这样的情况,想改变一下SL的DataPager的显示信息,比如希望分页控件上显示数据的总数.那么就需要扩展一下DataPager控件即可. 其实扩展DataPager很简单,只要获取到Da ...
- cocos2dx - 控件扩展之pageview循环显示
接上一节内容:cocos2dx - shader实现任意动画的残影效果 本节主要讲一下扩展PageView控件功能 在实际游戏应用中,经常会碰到用原来的控件难以实现的功能.这时候就需要根据需求,通过选 ...
- ASP.NET MVC显示UserControl控件(扩展篇)
昨晚Insus.NET有怀旧一下<念念不忘,ASP.NET MVC显示WebForm网页或UserControl控件>http://www.cnblogs.com/insus/p/3641 ...
- sencha touch datepicker/datepickerfield(时间选择控件)扩展(废弃 仅参考)
参考资料:https://market.sencha.com/extensions/datetimepicker 上面的扩展在2.2有些问题,参考源码重新写了一个 TimePicker: Ext.de ...
- openlayers2地图控件扩展:要素删除DeleteFeature
实现要素删除控件,扩展OpenLayers.Control类,实现效果:选择DeleteFeature工具后,选择要素,按delete键删除要素(这里的删除只是将feature设置成delete状态, ...
- 玩转控件:扩展Dev中SimpleButton
何为扩展,顾名思义,就是在原有控件属性.事件的基础上拓展自己需要或实用的属性.事件等等.或者可以理解为,现有的控件已经不能完全满足我(的需求)了.好的扩展会使控件更加完善,实用,好用.不好的扩展,说白 ...
- 玩转控件:对Dev的GridControl控件扩展
缘由 一切实现来源于需求,目的在于不盲目造轮子,有小伙伴儿在看了<玩转控件:对Dev中GridControl控件的封装和扩展>文章后,私信作者说,因公司业务逻辑比较复杂,展示字段比较多,尤 ...
随机推荐
- Django笔记-helloworld
网上的Django资料太乱了,我想写一下自己的学习过程(只记大体过程,有时间就完善).(用eclipse+PyDev工具开发的) 1.项目结构 2.关键代码:(注意缩进,可能贴上来缩进格式等有变化,我 ...
- JavaScript数据类型--值类型和引用类型
值类型:也称为原始数据或原始值(primitive value). 这类值存储在栈(stack)中,栈是内存中一种特殊的数据结构,也称为线性表,栈按照后进先出的原则存储数据,先进入的数据被压入栈底,最 ...
- centos 7.0 phpize 扩展php
phpize扩展php模块 phpize 所在目录 /usr/etc/php/bin/phpize 查看当前php配置情况 /usr/etc/php/bin/下面的php [root@localhos ...
- 通过mongodb客户端samus代码研究解决查询慢问题
最近有项目需要用到mongodb,于是在网上下载了mongodb的源码,根据示例写了测试代码,但发现一个非常奇怪的问题:插入记录的速度比获取数据的速度还要快,而且最重要的问题是获取数据的速度无法让人接 ...
- php 关于时区 date gmdate date_default_timezone_set/get 终极答疑
关于GMT和UTC时间? GMT+0800 Greenwich: [gri:nitf], 格林威治/格林尼治.是英国伦敦泰晤士河附近的一个小镇 Mean: adj. 自私的; n. 平均.. he i ...
- linux脚本编程(shell)浅介 (转载)
linux脚本(shell)编程 啊,昨天上网看到一篇讲 linux/unix shell 的文章,想想自己最后写这东西也是一年前的事了,想想都快忘光了. 还是整理一下,做一次回顾,以后说不定还用得上 ...
- 关于Windows下安装mongodb和加入Windows系统启动项
.首先:在http://www.mongodb.org/downloads官网下载最新的win版本的mongodb下载包(我下载到d盘) .加压缩,修改文件夹名字为mongodb,建立放数据库文件夹w ...
- php 短路逻辑运算符
短路与 && 短路或 || or.||.and.&& 都是短路运算符 &&(and)短路与运算符检查第一个表达式是否返回“flase”,如果是“fals ...
- 【AngularJS】—— 13 服务Service
在AngularJS中有很多的服务,常用的比如$http,$location等等. 本篇文章会介绍一下的内容: 1 $http这种Angular提供的服务的使用 2 如何自定义服务,并总结服务需要注意 ...
- KNN-实现文本分类
现在大多程序.关于算法的都封装的差不多了... 所以很多程序猿很少来进行深入来研究了... 以前也想过自己好好学习下.但是理论确实难以下咽.怪我喽... 这次项目中需要用到了.要实现对文本进行分类的一 ...