It looks like you're new here. If you want to get involved, click one of these buttons!
I'm quite new to Codea but I need to make this program that does math. The description of the program is:
"Create a program that will allow the user to enter in the answer from a simple math problem. Both numbers for the question are in the range from 1 -> 99. If the user gets it right, a message tells them this and then increments the “Number Correct” count. If the user gets it wrong, a message tells them they got it wrong, tell them the correct answer and then increments the “Number Wrong” count. Both numbers should be generated randomly and the program should randomly select an operation each time as well (+, -, *, /). Also don't use the iPad keyboard to input the answer"
I would appreciate any input from anyone on how I would go about doing this. Thanks!
Comments
School project?
If so, how much can you figure out for yourself? While we are happy to help, you won't learn anything if we do all the thinking for you.
I suggest you break the problem into its parts
creating random numbers and arithmetic operations
displaying the problem on the screen
providing a way for the user to enter an answer without the keyboard
keeping score of correct and incorrect answers
Looking at each of these separately makes it easier to solve.
(and welcome to the forum).
:-h
Check this for ideas: http://codea.io/talk/discussion/6936/guess-the-number
@Ignatz Yeah it kind of is a project but my teacher hasn't taught us a lot. I know the print function and we skimmed through if statements in Codea. We haven't learned about buttons or generating random mathematical equations. But thanks anyways, I'll search the forum.
@quezadav Thanks as well. Although I don't quite understand that code, but it's alright. I'll just figure it out somehow.
If that's all you know, you haven't any chance of doing this.
You need to understand the drawing cycle, how to draw text on the screen, how to make simple clickable "buttons" and how touch works.
You could do it more simply by printing the test questions and the results in the output area at the left of screen, but you'd still need buttons and touches for the user to input an answer.
There's not much point us writing it for you, either, because you won't understand it.
I would discuss with your teacher that this is probably too hard based on what you know.
I don't mean to hijack this post, but this link might be relevant. It's 2 years old and I would like to ask anyone who started Codea about Dec 2013: Was it better to give you code so you could see how it was done without you doing anything, or was it better to give you suggestions so you had to figure it out yourself. A lot of people on this forum can write the code for the above post in a couple of minutes, but are we helping or hurting those trying to learn. I'm not sure if I should write the code for this as I normally do and post it, or just let it go with the suggestions above.
Dave, I think sample code is great when you have some basic skills and just need some help with the shape of a program or some technique.
The problem here is that the knowledge deficit is so great that our code - especially anything to do with drawing or touch - is going to look like greek.
Additionally, homework is supposed to be done by you personally, not by other people. It's unfair to the rest of the class if we write a great program for one student.
So I suggest our role here is to help unblock problems, and to explain, but not to solve the assignment or write the code.
Writing sample codes wouldn't hurt. I'm familiar with touch events a bit and the text function. Also the code isn't being presented to the class so it won't affect anyone. Thanks anyways
Ah, well, that's a bit different from what you said above.
I go back to my original advice of breaking the project into its parts and tackling each separately. It will be more fun than just having someone write the whole thing for you.
@CodingIsLife Here's an example. I'll leave it to you to add the bells and whistles.
Tap the button with the correct answer. You don't go to the next problem unless you get the current one right.
I think this is a pedagogically appropriate answer to the question. It offers a solution to the problem of not using the keyboard, and the touch handler offers a lesson for UI design. You have covered the design issues specified by @Ignatz, while still leaving plenty of bells and whistles to implement given the original specification. I encourage @CodingIsLife to post their solution. I would be interested in seeing how they handled the design trade offs for generating a problem, getting the answer, and providing feedback.
Moving beyond multiple choice opens up interesting user interface problems for negative numbers and precision for division.
I think I would put the numbers 0 to 9 on the screen so you could touch them in turn to give your answer, like a calculator keypad.
But there are several ways to do it, of course...
@Ignatz I did the 0-9 . - keys to start, but it started to get too complicated for just a simple example. As mentioned above, the precision on the divide would be a problem.
@dave1707 Thanks for your example. It works but I don't understand it. I'll see what I come up with and @nfgdayton I'll definitely post my code if I figure out how to do it. In addition, @Ignatz you're right, a 0-9 keypad is the better option in my opinion. Thanks to all of you
This is all I have so far. It's mainly just the draw function. The program doesn't do much. I still need to generate random numbers and operations, program the buttons to display numbers when touched + an enter button and tell the user the right answer if answered wrong. It's not perfect I know and it can probably be shortened but this is what I have. [Screenshot of my program] http://imgur.com/yGyOCmY
@CodingIsLife Don't forget the Clear, Backspace, Minus, and Decimal point buttons. When you show a divide problem, how many places past the decimal point will you expect the user to key. Also, will you round up the answer or just truncate the answer. You're off to a good start, but you have a long way to go.
You're getting there. You may find this is neater
When the user touches the screen, it is easy to tell which button has been pressed
@dave1707 Thanks for the heads up. Although I believe having a decimal and minus button will over complicate the program. Is there a way to program the division problems to only be even (e.g. 18/6=3)? (No floats just integers)
@Ignatz I haven't tried your code just yet but it looks good. I like keeping things organized so thanks
Where would I put the buttons={} chunk of code? Under any function or just at the beginning OR as a new blank file? Also could you possibly do a further example using 2 or 3 buttons? Just so get an idea of what specifics I must put.
I'm going to keep trying at this.
@CodingIsLife For whole division, pick 2 numbers so when they're multiplied together is below some limit you set. Then use the multiplied value divided by one of the 2 numbers. The result will be your other number.
@dave1707 That makes sense in my head but I don't know exactly how to code that perfectly. I'm very visual so examples help (in code).
(I understand why that reverse math works)
@CodingIsLife - For the division problem, it's probably best to work backwards from the divisor, ie choose that first.
For example,
Can you figure some of this code out for yourself?
You should put buttons={} just before you start allocating images and positions, and the obvious place for all that code is in setup.
for the button positions, here's the second one
(I'm just copying the positions you used in draw)
@Ignatz Thanks for the example. That'll help a bunch. I'm sure I can figure out the math.random function. That step-by-step process really helps!
@CodingIsLife Here's a simple example. You can adjust the numbers in calc() to fit your needs. Keep taping the screen for another problem.
@dave1707 That works nicely. I would rather have the equations in a text function than print (if that's even possible)
@Ignatz This is how I interpreted your comment.
@CodingIsLife Here's an example with text added.
@dave1707 Thanks. Now I just need to randomly generate the operation and display that in an output rect and have an input rect too for the keypad.
Yes.
You can make it neater still by putting the button positions into a table, like so
The temporary pos table lists the ten screen positions of the button, leaving out WIDTh and HEIGHT because they are the same for all of them, so we can add them later.
Then our loop that sets the images, can also set the positions, avoiding the need for 10 separate statements.
@Ignatz I've attempted to make the list but when I press the start program button I get to errors. Screenshot line 20 is
buttons[i].pos=vec2(WIDTH/2,HEIGHT/2)+pos[i]
and line 46 is
sprite(buttons[i].img,buttons[i].pos.x,buttons[i].pos.y,75)
Yes, the problem is that when we set up a table this way, it starts from 1, not 0 as we want. So what we can do is just give it the positions 1 to 9, then add position 0 afterward, like this
I've changed that part of the code and the "Right" & "Wrong" and the rect displays, but the number keypad does not. Although the output sidebar still prints "touch" when I tap on where they'd be.
Do your button images exist?
You don't need them anyway, you can draw text numbers instead
For some reason it works now. I just deleted the sprite(buttons[i].img...) stuff under the draw function and retyped it
Okay so I've added a clear and backspace button. The next thing I want to do is when the buttons are pressed they actually do something
) Also in case you want to see my code (anyone) this is it: (http://imgur.com/69mKCPP)
I've looked up project data and assets. I have pulled in a windmill image with the statement:
sprite("Small World:Windmill",pos._x,_pos.y,75)
And looked at moving data into my global project file on post
http://codea.io/talk/discussion/6448/downloading-multiple-images-via-http-request
Where is @CodingIsLife's project data coming from?
I looked at this post:
http://codea.io/talk/discussion/58/persistent-data
To see that project data is stored in a Data.plist file. When I look up Data.plist I go to an iOS developer page, which is way out of the scope for Codea
The data is stored locally on the iPad, so unless he shares the pictures with you, you'll have to make your own, or else just print numbers on the screen instead of pictures (see my code for this a little higher up).
Yes I am using my own images. They are straight from either Google or some icon website. I'd be happy to share the images if it allows other people to use the program I'm making
@CodingIslife ... I used the wrong Google search the first time I looked for buttons. Found a link to a site http://dabuttonfactory.com/ which should help me experiment with buttons. I will need to do this and will use your program as a template.
I think you have reached a difficult part in your development and recommend that you read http://codeatuts.blogspot.com.au/2012/07/tutorial-5-finite-state-machines.html before attempting the buttons on your own. The user experience for your program is going to be initially a little frustrating for negative numbers I suspect. I am looking forward to seeing your code for presenting answers for addition problems!
@ignatz I have been messing with Codea for a couple of months now and am finally getting a feel for the language. Text and Sprite both use the center of the displayed object making your obj vec2(touch.x,touch.y) ... obj:dist(object location) ... Coding pattern really cool. I've been messing with my own button logic that I drew from the lower left corner, making handling the touch event a lot more complicated. I really appreciate the work you have done with Codea. I hope to be able to discuss graphics with you a little more intelligently real soon now :-bd
@CodingIsLife Here's a keyboard that I had that uses built in emoji images, so anyone can use it. It handles BACKSPACE (single triangle), CLEAR (double triangle), ENTER (curly arrow). The * and # buttons do nothing in this example.
@dave1707 Code works nicely and it's very appreciated but I'm probably going to stick with my own buttons for my program but I'm sure others can figure out how to add your code into mine
This comment is for anyone to help. I've achieved drawing the sprites where I'd like. The only problem I face now is coding/displaying the math and coding the buttons to do what they should. Any insight is appreciated even if it's an organization tip. (http://imgur.com/qfmVGZN)
@CodingIsLife That's fine. I just put this out to show a keyboard using emoji images instead of using local images that others on the forum don't have access to.
@CodingIsLife My code above does what you need, but I don't know if you understand or used classes yet. The code in the function button:touched() gets a key value and builds the final value. It also does the backspace, clear, and enter code.
@dave1707 Yes I assumed that. It'd be great if I could take the part of your code that does all that button code and merge into my code. Is that possible?
@CodingIsLife The exact code won't work, but the way I do the calculations and backspace, clear, enter code should work with your keys.
@dave1707 What specific parts of the code should I copy? And is there anything I need to change in yours to work with mine buttons?
@CodingIsLife I don't think there anything you could copy and have it work with yours, but the math should work. When you tap a digit (0-9) then value=value*10+digit. That will build value as you key digits. When you hit backspace, then value=value//10. That will remove the rightmost digit. When you hit clear, value=0. When you hit enter, do whatever you need to do with value then move 0 to it.
@dave1707 Thanks. Again that makes sense in my mind but I'm not sure how I'd code it. I'm thinking using an if statement and possibly the t.state == ENDED code. Any tips?
@CodingIsLife Everything is going to be based on what's touched on the keypad. If you tap the digits, you build the value. If you tap backspace, the rightmost digit is removed. If you tap clear, you move 0 to value. If you tap enter, you compare the value to the answer of your calculation. If they match, you create a new problem. If they don't match, you move 0 to value and the user tries again.
@dave1707 Perfect. I believe I know what to do. I'll post an update when I get it working (of if I have any other errors :P )