Adobe AIR: Calculator

If you’ve installed the AIR SDK (and it’s dead easy, just extract and copy it somewhere), you’ve got a lightweight cross-plaform VM to program apps in. Best of all, it works with HTML and Javascript.

In about an hour, I hitched up a calculator application. It’s very easy:

Calculator.xml:


<pre>
<?xml version="1.0" encoding="UTF-8"?>
<application xmlns="http://ns.adobe.com/air/application/1.0.M4"
appId="in.vish.Calculator"
version="1.0">
<name>Calculator</name>
<title>Calculator Installer</title>
<description>Simple Calculator in HTML</description>
<copyright></copyright>
<rootContent systemChrome="standard" transparent="false" visible="true">
Calculator.html
</rootContent>
</application>
</pre>

Calculator.html:


<pre>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Calculator</title>
<style>
body, html { margin: 0; padding: 0; }
body { background-color: black; color: #888; line-height: 1.5em;
font-family: verdana, arial, sans-serif;
}
#wrap { margin: auto; width: 70%; }
h1 { font-family: Tahoma, Arial, serif; font-size:2em; color: orange; }
#sum_button { margin-top: 5px; }
</style>
<script>
init = function() {
runtime.trace("init function called");
}
calculate = function() {
runtime.trace("calculate called!");
value1 = document.getElementById(&apos;val1&apos;).value;
value2 = document.getElementById(&apos;val2&apos;).value;
sum_value = parseInt(value1) + parseInt(value2);
if (isNaN(sum_value)) {
document.getElementById(&apos;result&apos;).innerHTML = "You didn&apos;t enter valid numbers.";
} else {
document.getElementById(&apos;result&apos;).innerHTML = "The sum is " + sum_value + ".";
}
}
resetForm = function() {
runtime.trace("resetForm called!");
document.getElementById(&apos;sum&apos;).reset();
}
</script>
</head>
<body onload="init()">
<div id="wrap">
<h1>Calculate a Sum!</h1>
<form id="sum">
<label for="val1">Value 1:
<input type="text" name="val1" id="val1" size="4"/>
</label>
<label for="val2">Value 2:
<input type="text" name="val2" id="val2" size="4"/>
</label>
<input type="button" value="Sum!" id="sum_button" onclick="calculate();">
<input type="button" value="Reset" onclick="resetForm();">
<p id="result"></p>
</form>
</div>
</body>
</html>
</pre>

And voila, there you have it: a simple calculator:

There’s also a zip file with the code: calculator.zip and the AIR file for installation (to use that you need the AIR runtime)

3 responses

  1. When i run your .air file in my system , i got this error. “This application requires a version of Adobe AIR which is no longer supported. Please contact the application author for an updated version.”
    I have these system configuration.
    1. Windows XP with SP2
    2. 512 RAM.
    3. Dreamweaver CS3.
    Can anyone help me in this?

  2. hi.
    i downloaded the zip file and when tried to install the package didn’t install and showed the error message”This Application requires a version of Adobe AIR which is no longer supported.Please contact the application author for an updated version.”

Leave a Reply