- 浏览: 20673 次
- 性别:
- 来自: 上海
最新评论
-
前进的路中没有月亮:
masuweng 写道那个爱码哥怎么用呢,我是初学者.还望指教 ...
仅用了一天开发了这样的app,再也不用担心排队的问题了 -
masuweng:
那个爱码哥怎么用呢,我是初学者.还望指教...
仅用了一天开发了这样的app,再也不用担心排队的问题了
手机计算器是我们日常中很熟悉并且使用起来非常简单的应用了,这样的应用在爱码哥平台中又该如何开发呢?
结合这个原型图和imag.js现有的布局控件大致有两种解决思路。
第一种:使用list列表布局
底部使用list列表标签进行布局,共4个item,每个item中有5列col,在col中加入文本标签label,也可以把label替换成button。共20列,每一列不用设置长度,会自动平均分配给每一个col。
结构图如下:
代码结构是(其余三个item复制就好):
这个结构相当于一个骨架,余下的就是编写内容了。
第二种:使用九宫格grid布局
底部使用网格布局控件grid,共20个item,每个item中有一个文本标签label。相对于第一种方法会更简单,代码量也少,可复制性强。
结构图如下:
代码结构(其余item也是复制即可):
Grid网格布局默认九宫格样式,每行自动匹配3个item,如果要求在3个以上,需要设置grid的cols属性。
布局确定了,下面整理逻辑部分
网上有很多Android和iOS计算器的源码,其中Android计算器源码需要加入onClick来实现按钮功能,又提供了按钮的监听事件。同样在imag.js也要onclick来实现点击的功能,但不需要监听事件,同时onclick作用的是grid列表中的item,不是按钮button。
js核心代码:
在爱码哥平台中创建一个应用,把完整代码复制到云端开发中并保存,一个简单的计算器应用就搞定了。结合爱码哥开发版随时查看效果图
完整代码
或者下载下面的压缩包导入到创建的应用中
快速熟悉掌握imag.js可观看视频教程
结合这个原型图和imag.js现有的布局控件大致有两种解决思路。
第一种:使用list列表布局
底部使用list列表标签进行布局,共4个item,每个item中有5列col,在col中加入文本标签label,也可以把label替换成button。共20列,每一列不用设置长度,会自动平均分配给每一个col。
结构图如下:
代码结构是(其余三个item复制就好):
<list> <item> <col><label></label></col> <col><label></label></col> <col><label></label></col> <col><label></label></col> <col><label></label></col> </item> </list>
这个结构相当于一个骨架,余下的就是编写内容了。
第二种:使用九宫格grid布局
底部使用网格布局控件grid,共20个item,每个item中有一个文本标签label。相对于第一种方法会更简单,代码量也少,可复制性强。
结构图如下:
代码结构(其余item也是复制即可):
<grid cols="5"> <item><label></label></item> <item><label></label></item> </grid>
Grid网格布局默认九宫格样式,每行自动匹配3个item,如果要求在3个以上,需要设置grid的cols属性。
布局确定了,下面整理逻辑部分
网上有很多Android和iOS计算器的源码,其中Android计算器源码需要加入onClick来实现按钮功能,又提供了按钮的监听事件。同样在imag.js也要onclick来实现点击的功能,但不需要监听事件,同时onclick作用的是grid列表中的item,不是按钮button。
js核心代码:
<script> <![CDATA[ var num=0,result=0,numshow="0"; var operate=0; //判断输入状态的标志 var calcul=0; //判断计算状态的标志 var quit=0; //防止重复按键的标志 var ScreenValue = $('numScreen').value; function refresh_Screen(){ $('numScreen').value = ScreenValue;//刷新显示 } function command(num){ var str=ScreenValue; //获得当前显示数据 if(str!='0'&&operate==0){ str = str; }else { str = ''; }//如果当前值不是"0",且状态为0,则返回当前值,否则返回空值; str=str + String(num);//给当前值追加字符 ScreenValue=str; refresh_Screen();//刷新显示 operate=0; //重置输入状态 quit=0; //重置防止重复按键的标志 } function dzero(){ var str=ScreenValue; if(str!='0'&&operate==0){ str = str + '00'; }else { str = '0'; }//如果当前值不是"0",且状态为0,则返回当str+"00",否则返回"0"; ScreenValue=str; refresh_Screen(); operate=0; } function dot(){ var str=ScreenValue; if(str!='0'&&operate==0){ str = str; }else { str = '0'; }//如果当前值不是"0",且状态为0,则返回当前值,否则返回"0"; for(i=0; i<=str.length;i++){ //判断是否已经有一个点号 if(str.substr(i,1)==".") return false; //如果有则不再插入 } str=str + "."; ScreenValue=str; refresh_Screen(); operate=0; } function del(){ //退格 var str=ScreenValue; str=str.substr(0,str.length-1); ScreenValue=str; refresh_Screen(); } function clearscreen(){ //清除数据 num=0; result=0; numshow="0"; ScreenValue="0"; refresh_Screen(); } function plus(){ //加法 calculate(); //调用计算函数 operate=1; //更改输入状态 calcul=1; //更改计算状态为加 } function minus(){ //减法 calculate(); operate=1; calcul=2; } function times(){ //乘法 calculate(); operate=1; calcul=3; } function divide(){ //除法 calculate(); operate=1; calcul=4; } function persent(){ //求余 calculate(); operate=1; calcul=5; } function equal(){ calculate(); //等于 operate=1; num=0; result=0; numshow="0"; } // function calculate(){ numshow=Number(ScreenValue); if(num!=0 && quit!=1){ //判断前一个运算数是否为零以及防重复按键的状态 switch(calcul){ //判断要输入状态 case 1:result=num+numshow;break; //计算"+" case 2:result=num-numshow;break; //计算"-" case 3:result=num*numshow;break; case 4:if(numshow!=0){result=num/numshow;}else{hint("被除数不能为零!")} break; case 5:result=num%numshow;break; } quit=1; //避免重复按键 } else{ result=numshow; } numshow=String(result); ScreenValue=numshow; refresh_Screen(); num=result; //存储当前值 } ]]> </script>
在爱码哥平台中创建一个应用,把完整代码复制到云端开发中并保存,一个简单的计算器应用就搞定了。结合爱码哥开发版随时查看效果图
完整代码
或者下载下面的压缩包导入到创建的应用中
快速熟悉掌握imag.js可观看视频教程
- calculator.rar (2.5 KB)
- 下载次数: 1
发表评论
-
访问后台数据库有多6,看看这里便知
2016-10-14 17:29 580相信使用爱码哥的小伙 ... -
label和slideimage共存|用得到的就拿去
2016-09-13 18:12 537要求:Label标签置于slideimage之上并透明 限制: ... -
新技能get|有了它你也可以做电商app
2016-09-13 18:03 734使用imag.js开发过很多类型的模板,比如新闻、社交、办公类 ... -
imag.js|快速掌握全局方法
2016-08-29 17:17 563使用爱码哥进行移动应用开发时,除了了解基本的内容控件、表单控件 ... -
开发技巧汇总|对于imag.js你不知道的事
2016-08-03 16:48 5621. imag.js里有哪些标准JavaScript对象? i ... -
爱码哥移动开发平台|让制作app更加便捷
2016-04-26 15:14 566本文来自爱码哥CTO邱杨(Terry)同学 随着HTM ... -
关于使用iMAG.js出现的问题及解决方法
2016-05-05 18:05 541●list子标签的Item默认交互效果能取消吗? se ... -
移动开发|浅谈list列表布局控件
2016-05-11 10:54 480在iMAG开发app中界面布 ... -
iMAG中的复用列表的使用说明
2016-05-11 17:29 459复用列表(resue list)在爱码哥中是不同于普通列表的 ... -
iMAG(爱码哥)新建应用
2016-05-18 14:22 447在爱码哥移动应用开发平台如何新建应用? 在首页找到工作台 ... -
微信页面的代码|你一定没有看过这么神奇的代码
2016-05-18 16:01 913Android iOS: 代码: &l ... -
移动开发|绘制饼图、柱状图、2d、3d统计图表
2016-05-31 12:29 614通过HTML5的canvas来绘制图表功能,需要用到web控 ... -
作为开发者不可不收藏的十大开发语言和框架
2016-06-02 09:48 4361.Android SDK Android开发者不可 ... -
作为开发者不可不知的Native App,Web App,Hybrid App等技术的对比
2016-06-12 18:10 378随着移动开发需求的不断增多,五花八门的开发方式也层出不穷,作 ... -
移动应用开发跨平台工具imag.js入门
2016-07-05 15:47 447imag.js是一种NativeScript形式的框架,它兼 ... -
爱码哥移动开发平台的4大开发环境
2016-07-06 14:16 436imag.js是一种NativeScript形式的框架,它兼 ... -
推荐爱码哥移动开发平台十大常用的原生UI控件
2016-07-06 17:52 432imag.js是一种NativeScript形式的框架,它兼 ... -
移动应用开发技术过多,该如何做选择
2016-08-01 18:11 413随着互联网创业的持续 ... -
一个初级开发者完胜十几人团队,此处有秘诀!
2016-07-22 18:55 671最近今日头条很火,作为一名喜欢钻研的开发者,仔细研究了他们的A ... -
H5实现APP和原生方式有多大差距,多少坑?JS才是王道!
2016-07-15 12:52 6941纯H5的APP,虽然开发起来要比纯原生开发畅快的多,但最终效果 ...
相关推荐
《win截屏工具cut_imag.7z详解及应用》 截屏工具在现代计算机使用中扮演着不可或缺的角色,尤其在信息分享、问题反馈以及教学演示等场景中,它提供了便捷的方式来捕捉屏幕上的图像。"cut_imag.7z"便是一款针对...
"fastICA_imag.zip"这个压缩包包含了实现这一功能的源码文件"fastICA_imag.m",这是一个MATLAB代码,用于执行快速ICA算法(FastICA)在图像分离上的应用。 FastICA算法是ICA的一种高效实现,由Aapo Hyvärinen等人...
【标题】4_Add2Imag.zip 这个压缩包文件涉及的是一个OpenCV项目,名为"thisimag",它很可能是关于在图像处理中添加两个图像的实现。OpenCV(开源计算机视觉库)是一个强大的跨平台库,广泛用于图像处理、计算机视觉...
《PyPI官网下载imag3-1.1.0.tar.gz:深入解析Python图像处理库imag3》 在Python编程世界中,PyPI(Python Package Index)是开发者们获取和分享软件包的重要平台。今天我们将聚焦于一个名为"imag3"的Python库,其...
本文讨论了在视频编码和显示设备领域内,如何通过新的标准和进展来改善色彩表示的范围和质量。文章主要聚焦在两个视频色彩标准上:BT.709和BT.2020,探讨了与之相关的新技术和应用前景。 首先,BT.709标准是长期...
在本压缩包“yolov8系列--GUI for marking bounded boxes of objects in imag.zip”中,包含的是一个用于图像目标检测的图形用户界面(GUI)工具。这个工具主要用于在图像上标注物体的边界框,是训练对象检测模型如...
这个“VC_start_up_imag.rar_MFC 启动界面_Start Up”资源是一个实例,展示了如何在MFC应用中创建一个启动界面。下面我们将详细探讨MFC启动界面的实现以及相关知识点。 首先,启动界面通常是应用程序启动时首先显示...
"imag.xy2.dev-main"作为压缩包子文件的文件名,通常代表这是项目的主入口文件,可能是JavaScript代码,负责初始化和管理整个应用。在这个场景下,它可能包含了与CSS相关的JavaScript库,用于动态地应用样式,或者与...
标题:“基于压缩感知和背景减除的红外图像序列中小目标检测方法” 描述:本文介绍了一种新型的自适应背景减除方法,该方法利用压缩感知技术直接检测红外图像序列中的小目标。该方法能够显著减少信号采样和传输带宽...
- **fastICA_imag.m**:这个文件很可能是MATLAB代码,实现了fastICA算法用于图像盲分离的过程。代码可能包括数据预处理、负熵函数计算、权重更新和结果可视化等关键步骤。 5. **实际应用示例** - **混合图像分离*...
图像被模糊以后的模糊图像和去模糊后的恢复图像的对比
result = new Complex((a.real * b.real + a.imag * b.imag) / (b.real * b.real + b.imag * b.imag), (b.real * a.imag - a.real * b.imag) / (b.real * b.real + b.imag * b.imag)); return result; } // 除法...
利于fastICA算法实现混合图像分离的源代码,给大家一个参考
imag.js框架,虽然名字看起来像是JavaScript库,但这里可能是开发者自创的一个组件或者工具,因为没有公开的"imag.js"框架信息。它可能是一个专门为Android定制的JavaScript库,用于增强图形处理、动画效果或者交互...
网站开发 关于 宣言 这部分(编辑器)可能适用于。 由设计。 由。 网页目录结构 wordsbaking-editor | +---editor.html ...+---imag/ | | | +---ico.png | +---js/ | +---editor.js | +---jquery-1.8.3.min.js
antonia@imag.fr http://www-lmc.imag.fr/SMS G′en′eralit′es sur les d′ecompositions en ondelettes • Les ondelettes . Analyses multir′esolution . Algorithmes de calcul • Approximation et ...
本主题主要关注在Android平台上如何利用Java语言来调用API,特别是加载新闻数据和使用JavaScript库imag.js。 首先,理解API调用的基本概念至关重要。API通常是一组预定义的函数、类或方法,允许开发者通过发送请求...
"imag-popupmenu.zip"这个压缩包显然包含了一个关于如何在Android应用中绘制多个PopupMenus的示例。下面我们将深入探讨PopupMenus的相关知识。 首先,PopupMenus通常用于在用户点击某个图标或按钮时显示一系列可选...