Figure 1.
The main goal of this example is to show how to use the InterWidgetCommunication methods setX() and setY(). This example uses a bargraph (Bar1) and three function buttons (Btn1, Btn2 and Btn3). Btn1 and Btn2 directly use the setX() and setY() methods on Bar1 to move the widget around the LCD. Btn3 uses Internal RAM variables and a Meta Refresh Tag (MetaMove) to perform the moving of Bar1. Btn3 is included to show how an external processor could use serial commands to set Internal RAM variables and move an object or widget on the LCD. Here is a snapshot of what the html page looks like in a "WYSIWYG" tool:
Figure 1.
When one of the buttons is pressed, it performs its href functions. Because each function is separated by a comma, all of the functions are launched upon a single hit. Btn1 specifically sends Bar1 a disappear() method, a setX() method with 0 for the argument, a setY() method with 60 for the argument, and finally a reappear() method.
One important thing to know when dealing with the setX() and setY() methods is that they only change the coordinates of the given widget/object. They do not inherently move the widget/object on the LCD. You should always remove the widget/object from the display before setting the X and Y coordinates, and then redraw the widget/object after setting the coordinates. This means that before using the setX() or setY() methods, you should perform a disappear() method on the given widget/object, which will clear it from the LCD and not allow any further updates. After using the setX() and setY() methods, you can then use the reappear() method which will make the widget/object reappear on the LCD at the new coordinates specified by setX() and setY().
To create Btn1, use the following :
<APPLET CODE="FunctionButton.class" WIDTH="80"
HEIGHT="48" ALIGN="BOTTOM" NAME="Btn1">
<PARAM
NAME="href" VALUE="Amulet:document.Bar1.disappear(),Amulet:document.Bar1.setX(0),Amulet:document.Bar1.setY(60),Amulet:document.Bar1.reappear()">
<PARAM
NAME="fontSize" VALUE="3">
<PARAM NAME="fontStyle"
VALUE="bold">
<PARAM NAME="label" VALUE="(0,60)">
<PARAM
NAME="buttonType" VALUE="spring-loaded">
<PARAM
NAME="onButtonPress" VALUE="depress">
</APPLET>
Btn3 takes a different approach to setting the X and Y coordinates. Instead of using hard-coded numbers as the arguments for the setX() and setY() methods, it uses Internal RAM word variables. The include file, initSetX.ini initializes Internal RAM word variable #0 to 160 and variable #1 to 120. Btn3 sets Internal RAM byte variable #0 to 0xFF. The Meta Refresh Tag, MetaMove, has an ONVAR function which triggers upon the value of Internal RAM byte variable #0 reaching a value of 0xFF. When triggered, it then has a URL which performs the disappear(), setX(), setY() and reappear() methods. It also resets the value of Internal RAM byte variable #0 to 0x00, so MetaMove won't be triggered again until Internal RAM byte variable # 0 is set to 0xFF again.
The purpose of this button is to show how an external processor could change the values of specific Internal RAM variables and then trigger a hit on a META Refresh Tag that performs the disappear(), setX(), setY() and reappear() methods while using the Internal RAM variables as the arguments for the setX() and setY() methods.
Using the Amulet Simulator, you can set Internal RAM word variables #0 and #1 and then hit the (160, 120) button and the bargraph should move to the new coordinates specified by IR word variables #0 and #1.
To create Btn3, use the following:
<APPLET CODE="FunctionButton.class" WIDTH="80"
HEIGHT="48" ALIGN="BOTTOM" NAME="Btn3">
<PARAM
NAME="href" VALUE="Amulet:InternalRAM.byte(0).setValue(0xFF)">
<PARAM
NAME="fontSize" VALUE="3">
<PARAM NAME="fontStyle"
VALUE="bold">
<PARAM NAME="label" VALUE="(160,120)">
<PARAM
NAME="buttonType" VALUE="spring-loaded">
<PARAM
NAME="onButtonPress" VALUE="depress">
</APPLET>
To create MetaMove, use the following:
<META HTTP-EQUIV="Refresh" CONTENT="0.05;ONVAR=Amulet:InternalRAM.byte(0).value();trigger=0xff;
URL=Amulet:document.Bar1.disappear(),Amulet:document.Bar1.setX(internalRAM.word(0)),
Amulet:document.Bar1.setY(internalRAM.word(1)),Amulet:document.Bar1.reappear(),
Amulet:InternalRAM.byte(0).setValue(0x00);name=MetaMove">
NOTES: