+1
Answered

Dumbed down calculator

JohnWeez 8 years ago updated by icahill (Administrator) 8 years ago 11
Trying to make an educational game that uses counting where a series of sounds play then the user clicks the right object to play the sound the same number of times. Ive got the sounds and everything working great, but I'd like to add a counter that goes up by one every time the object is clicked. Tried using the sample calculator code but it seems a little too complicated for what I'm trying to do. Using a combination of and tags but can never get the desired value to display.
While we don't have any direct examples of this scenario, you can achieve what you want by using a combination of setting a wire variable oninit that will store a value of 0 and an eval tag to increment your display counter.



<action name="counter" oninit="yes">
<assign property="var:counter" value="0" />
</action>


Then every time you perform a defined action that will move the counter, add an assign tag to the action that does this:



<action name="increment">
<assign property="var:counter" value="[eval:[var:counter]+1]" />
<assign property="object:DISPLAY.text" value="[var:counter]" />
</action>


So above your DISPLAY object will be the counter that you want to display, so once you know the variable, you can use object properties to update that value on your object.
Hmm still nothing happening. This is a mock up of the code Im using, do I need to set a variable within the text field or the image?




<main>
<panel name="image" width="70%" height="70%">
<image name="yeye" source="images/DC.jpg" bottompad="10" bottommargin="10" topof="voter"></image>
</panel>

<panel name="count" width="50%" height="50%" alignment="center" xpos="25">
<image name="UP" source="images/up.jpg" height="50%" width="50%" ypos="300" leftof="E1" onclickup="counter" onclickuptarget="E1" ></image>

<textfield name="E1" alias="ENTRY" width="25%" height="50%" font="helvetica" bottomof="image" rightof="UP" background="D3D3D3" size="35" text="0" ypos="300">
</textfield>
</panel>

</main>

<actions>

<action name="counter" oninit="yes">
<assign property="var:counter" value="0" />
</action>
<action name="increment">
<assign property="var:counter" value="[eval:[var:counter]+1]" />
<assign property="object:E1.text" value="[var:counter]" />
</action>

</actions>
</wire>

Your "counter" action doesn't need an onclickup assigned. When you set "oninit="yes" to an action, that means it will trigger when the App is launched. Instead, make the value of the onclickup for the UP image to "increment".

Also you aren't quite using alias correctly. For your "increment" action you are calling object:E1.text when you should be using the alias and calling object:ENTRY.text

And finally, are you trying to populate a textfield with the number or just a normal text tag?
I feel like using a number would make the most sense
I understand. I meant, do you want your number to appear in within a textfield or as plain text?
I meant Im trying to populate the textfield with a number
Ok. Your text field tag should be ok as is then.

Were you able to make the other changes I mentioned ok?
Yea still no luck. Do I need to add a value to the textfield?


<main>
<panel name="count" width="50%" height="50%" alignment="center" xpos="25">
<image name="UP" source="images/up.jpg" height="50%" width="50%" ypos="300" leftof="ENTRY" onclickup="increment" onclickuptarget="ENTRY" ></image>

<textfield name="E1" alias="ENTRY" width="25%" height="50%" font="helvetica" rightof="UP" background="D3D3D3" size="35" text="0" ypos="300">
</textfield>
</panel>
</main>
<actions>
<action name="counter" oninit="yes">
<assign property="var:counter" value="0" />
</action>
<action name="increment">
<sync>
<assign property="object:ENTRY.text" value="" />
<assign property="var:counter" value="[eval:[var:counter]+1]" />
<assign property="object:ENTRY.text" value="[var:counter]" />
</sync>
</action>

</actions>
The good news is that you are very close. Try this code. Make sure you compare yours with this one. There are some pretty minor UI changes to take note here.

When you use leftof or rightof, etc. you only have to put it on one of the objects.



<wire>
<main>
<panel name="count" width="50%" height="50%" valign="center" align="center">
<image name="up" alias="UP" source="AAA.png" height="70%" width="50%" onclickup="increment" onclickuptarget="ENTRY" ></image>
<textfield name="E1" alias="ENTRY" width="15%" height="15%" rightof="UP" font="helvetica" background="D3D3D3" size="35" text="0" alignment="center" valignment="center" align="center" valign="center">
</textfield>
</panel>
</main>
<actions>
<action name="counter" oninit="yes">
<assign property="var:counter" value="0" />
</action>
<action name="increment">
<sync>
<assign property="var:counter" value="[eval:[var:counter]+1]" />
<assign property="object:ENTRY.text" value="[var:counter]" />
</sync>
</action>
</actions>
</wire>
Nice its working great thank you. One more question, at times when I click the button the action is only performed when I touch the bottom half of the image, but when I touch the top half nothing happens. Can I fix this with different formatting or by making the image smaller?
This could probably be solved by changing your onclickup to a simple onclick. Also make sure that your image and textfield live inside their parent in harmony so one isn't overlapping the other.