今天开始构思第一个有实际功能的手机app - 计算器。在功能上非常简单，支持0-9输入和加减乘除等于运算，可以清零。
在程序逻辑结构上，跟嵌入式代码基本没差别：
- 对0-9按钮定义一个数字功能：实现对输入的数值更新并保存到一个变量
- 对功能键定义一个操作功能：根据不同操作对输入变量进行操作
- 对UI显示定义一个刷新函数：每次按键操作后刷新一次UI
简单看了下button的，使用onclick就可以直接检测按钮按下并调用一个函数了，果然比以前搞硬件简单多了T.T 神马键值扫描啊神马中断触发啊神马防抖啊都不用考虑的...
在不考虑UI就考虑功能基础上，下面代码就实现了一个简单的计算器功能：比较简单就都丢到index.html文件里了，没有到js文件中写控制逻辑。
<body>
<div>
<div>
<p id="total">0</p>
</div>
<div>
<p id="symbol"> NULL </p>
</div>
<div>
<p id="value">0</p>
</div>
<div>
<button onclick="NumFun(1)">1</button>
<button onclick="NumFun(2)">2</button>
<button onclick="NumFun(3)">3</button>
<button onclick="NumSym(1)">+</button>
<br>
<button onclick="NumFun(4)">4</button>
<button onclick="NumFun(5)">5</button>
<button onclick="NumFun(6)">6</button>
<button onclick="NumSym(2)">-</button>
<br>
<button onclick="NumFun(7)">7</button>
<button onclick="NumFun(8)">8</button>
<button onclick="NumFun(9)">9</button>
<button onclick="NumSym(3)">x</button>
<br>
<button onclick="NumFun(0)">0</button>
<button onclick="NumClean()">C</button>
<button onclick="NumSym(symbol)">=</button>
<button onclick="NumSym(4)">/</button>
</div>
<script>
var value = 0
var total = 0
var symbol = 0
function NumFun(Key)
{
value=value*10+Key
updateUI()
}
function NumClean()
{
value = 0
total = 0
updateUI()
}
function NumSym(sym)
{
switch (sym)
{
case 1:
symbol=1
total=total+value
value=0
updateUI()
break
case 2:
symbol=2
total=total-value
value=0
updateUI()
break
case 3:
symbol=3
//total=total*value
//if (value)
//{
if (total)
{total=total*value}
else
{total=value}
//}
value=0
updateUI()
break
case 4:
symbol=4
//total=total/value
if (value)
{
if (total)
{total=total/value}
else
{total=value}
}
value=0
updateUI()
break
default:
break
}
}
function updateUI()
{
document.getElementById("total").innerHTML=total
document.getElementById("value").innerHTML=value
switch (symbol)
{
case 1:
document.getElementById("symbol").innerHTML="+"
break
case 2:
document.getElementById("symbol").innerHTML="-"
break
case 3:
document.getElementById("symbol").innerHTML="x"
break
case 4:
document.getElementById("symbol").innerHTML="/"
break
default :
break
}
}
</script>
<!--script type="text/javascript" src="cordova.js"></script-->
<!--script type="text/javascript" src="js/index.js"></script-->
</body>
开始没注意乘法和除法的运算，导致当value是0时会出错.. 将
total=total/value
改为了
if (value)
{
if (total)
{total=total/value}
else
{total=value}
}
在页面上测试后没问题，简单一个命令
run cordova android
运行成功后会提示：
打开手机app，试了一下，虽然界面简陋，但是至少在手机上把一个有功能的app跑起来了！剩下的内容是优化界面... 无奈对html和css真不熟，一个个标签一个个参数去看狠废时间... 求达人10分钟帮我排个版面吧！！自己来做花一个下午一个晚上的真心懒得弄。
到现在已经可以从0起步，通过cordova 完成一个有实际功能的app的开发了。不过细心的人也会发现，到现在为止我们还没调用 cordova 提供的任何关于android的api！完全都是使用html和js本身的功能来实现的 ~ 下一步，就是开始学习了解cordova的android api，打开蓝牙并连接其他蓝牙设备进行通讯。
