自定义loadingBar进度条样式

可以看下这个文件:/UI2/system/components/justep/loadingBar/loadingBar.js 有一个方法:start : function(isWithOverlay) if(isWithOverlay){ self.$loadingOverlayNode.addClass('x-default-overlay-open'); } 这个代码就是添加动画,如果你想自定义动画效果,就修改它的样式,或者参考它的写法自己写一个样式 !修改完后记得合并资源 \tools\dist\less.bat \tools\dist\dist.bat   另外别人写过的案例参考:http://bbs.wex5.com/forum.php?mod=redirect&goto=findpost&ptid=107124&pid=165320653

attachmentSimple 组件自定义滚动条样式

先把合并资源/UI2/system/components/comp2.min.js去掉或改名 在/UI2/system/components/justep/attachment/attachmentSimple.js中可以搜下字符串:x-doc-process-bar 表示的是上传进度条的样式,onProgress事件中显示的,onSuccess事件中隐藏的 你可以修改这个样式,在/UI2/system/components/justep/attachment/css/attachment.less中,修改变成你想要的样式后 (可以修改js中代码,自定义一个class样式的名字,也可以直接在/attachment.less里面修改x-doc-process-bar 的样式) 运行没问题了就合并资源,执行 \tools\dist\less.bat \tools\dist\dist.bat 重新编译css,合并css和js 就可以了

attachmentSimple 不自动上传

把/UI2/system/components/comp2.min.js去掉或改名 这个需要修改attachmentSimple组件的源码: /UI2/system/components/justep/attachment/attachmentSimple.js 将这个js代码中,initUploader:function()中的一段代码: self.uploader = new Uploader(self.$domNode.find('.x-item-upload'),{ actionUrl:actionUrl }); 改成: self.uploader = new Uploader(self.$domNode.find('.x-item-upload'),{ actionUrl:actionUrl, autoUpload:false }); 执行tools\dist目录下的dist.bat ,重新合并js资源生成UI2/system/components/comp2.min.js 然后,在你需要上传的时候,调用 this.comp('attachmentSimple组件Xid').uploader.submit(); 注: 可以看下源码,最终调用的是:/UI2/system/components/justep/uploader/uploader-html5.js uploader-html4.js 直接吧这个文件中的autoUpload 属性设置默认值为false 也是可以的!

等待环境初始化后执行代码!

原因:很多时候,使用第三方控件时,在onload事件中调用第三方API,报错undefind或者 执行失败,原因是第三方控件的运行环境还没有初始化好,这个时候,如果想在onload事件中调用它的方法!就需要不停判断环境是否可运行了! 解决方法:判断环境是否可用,最简单的代码就是判断要调用的方法是否为undefind,比如: var int=setInterval(clock,500) function clock() { if(obj.method){ int=window.clearInterval(int); //obj.method 表示要调用的方法,判断它如果存在了就可以clearInterval了 obj.method() } }

单页应用,单独打开某个页面,不要主页先加载

单页应用要求 ,index.w中定义好 shellImp :http://docs.wex5.com/shellimpl/ 在index.w中 不指定content ,所有的页面跳转再js中实现!   Model.prototype.modelLoad = function(event){ var page = window.location.href.split('#!')[1] if(page){ justep.Shell.showPage(page); }else{ justep.Shell.showPage('main'); } }; 这样就可以不显示主页的情况下直接跳转到指定页面 比如把仿淘宝中,index.w 中的 xid为main的节点删除掉,然后js中代码改成如上,就可以实现直接打开某页

关于样式的动态绑定

使用bind-style  或者 bind-css就可以实现! 建议看下文章介绍: http://doc.wex5.com/data-bind-css/ http://docs.wex5.com/data-bind-style/ 案例:/UI2/demo/misc/bind/index.w 建议先学习下动态绑定视频: http://doc.wex5.com/data-bind/ 另外:如果比较复杂的业务逻辑,来控制显示样式,可以通过bind-style 或 bind-css 绑定一个自定义js方法,在js中通过复杂的业务逻辑运算,进行字符串的拼接!最终返回一个json 对象即可, 比如 //bind-css return JSON.parse('{"text-danger": true}'); //bind-style return JSON.parse('{"color": "#c0c0c0"}'); 也可以直接构造返回一个json对象,比如 //bind-css return {"text-danger": true}; //bind-style return {"color": "#c0c0c0"}

data组件和baasData组件的异同

同: 1.两中data 组件的用法都是一样的!都是前端存储数据用的!存放在缓存里,数据的存储量和物理内存有直接关系 2.baasData 组件是继承的data组件实现的!进行了一些扩展,它拥有data组件所有的API 方法 异: 1.不过baasData 有专门提供 BaasServer 为对应的服务端请求,baasData 和 BaasServer是 耦合的!可以配合使用!提高开发速度!data组件指定等action属性即可 2.data组件更灵活,可以自己接管加载数据的事件,对任何的数据源进行加载数据,数据交互 比如sqlite:/UI2/demo/sqlite/simpleData/index.w 比如第三方服务器 :http://docs.wex5.com/wex5-server-question-list-2026 也可以请求baasServer 中的数据:http://docs.wex5.com/wex5-ui-question-list-2174   最终就是把数据加载到data 或  baasData组件中后, 剩下的对数据处理的方法就都一样的! 可以把它当做是js中的一个集合,一个高级数组对象!

attachmentSimple 动态指定服务器地址

客户端js Model.prototype.modelLoad = function(event){ this.comp("attachmentSimple1").actionUrl = URL; this.comp("attachmentSimple1").uploader.actionUrl = URL; } 服务器端需要自己写代码接管IO流的操作,将文件存储到服务器上 代码可以参考:/Baas/justep/SimpleFileStore.java 有人做过,通过jquery插件 实现提交,可以参考:http://bbs.wex5.com/forum.php?mod=redirect&goto=findpost&ptid=111201&pid=165340769

弹出提示信息的几种常见做法

1.使用alert('测试弹出框') ,这种用法,一般是在开发过程中调试用的!正式发布后一般不用这样的弹出样式! 2.使用messageDialog组件,有多种显示样式,可以参考案例:/UI2/system/components/justep/messageDialog/demo/demo.w 3.使用windowDialog组件,这个就是自定义w页面,可以显示任意内容,弹出页面需要自己开发,案例/UI2/system/components/justep/windowDialog/demo/demo.w 4.调用justep.Util.hint('内容'); 多样式提示框,用法可以参考API文档,也可以自定义样式! 5.APP 中还可以使用corodva插件调用原生代码弹出提示,案例:/UI2/demo/native/toast/index.w ,  插件:cordova-plugin-x-toast