Create a Math Game

@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)

-- MathGame

-- Use this function to perform your initial setup
function setup()
supportedOrientations(LANDSCAPE_ANY)
--displayMode(FULLSCREEN)
noFill()
noSmooth()
noStroke()
pushStyle()
-- Sprites in variables  
    right=0
   wrong=0
   clearButton = "Project:clearButton"
   backspaceButton = "Project:backspaceButton"
   professor = "Project:professor"
   speechBubble = "Project:speechBubble"

   -- List of positions for the keypad
    local pos =     {vec2(-250,0),vec2(-150,0),vec2(-50,0),vec2(-250,-100),vec2(-150,-100),vec2(-50,-100),  vec2(-250,-200),vec2(-150,-200),vec2(-50,-200)}
 pos[0]=vec2(-150,-300)

buttons={}
for i=0,9 do
buttons[i]={} 
buttons[i].img="Project:button"..i
buttons[i].pos=vec2(WIDTH/2,HEIGHT/2)+pos[i]
end
end

-- This function gets called once every frame
function touched(t)
    if t.state==ENDED then --wait for touch to end
    local touch=vec2(t.x,t.y)
    for i=0,9 do
        if touch:dist(buttons[i].pos)<75 then
            keyTouched=i
            return
            print("touch") --just a test to see if it registers the touch
        end
    end
end
end

-- This function gets called once every frame
function draw()

-- This sets a dark background color 
background(40, 40, 50)

-- This displays the 0-9 keypad
for i=0,9 do
    sprite(buttons[i].img,buttons[i].pos.x,buttons[i].pos.y,75)
end

-- This displays the input rectangle correlating with the keypad
rect(WIDTH/2-100, HEIGHT/2-300)

-- This displays the backspace and clear button
sprite(clearButton, WIDTH/2-250, HEIGHT/2-300, 75)
sprite(backspaceButton, WIDTH/2-50, HEIGHT/2-300, 75)

-- This displays the "Right" and "Wrong" at the top of the screen and the increments 
fill(255)
fontSize(48)
text("Right "..right,WIDTH/2-100,HEIGHT-50) -- "Right 0" 
text("Wrong "..wrong,WIDTH/2+100,HEIGHT-50) -- "Wrong 0"
rect(WIDTH/2-300, HEIGHT/2+100, 300, 50) -- Input bar

-- This displays the professor sprite and his speech bubble
sprite(professor, WIDTH/2+225,HEIGHT/2-100, 350, 600)
sprite(speechBubble, WIDTH/2+75, HEIGHT/2+200, 250, 150)
end

@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 :stuck_out_tongue: )

I’ve got a new button and I have the math being randomly generated. I still don’t have the buttons programmed yet. My thought is to have a variable like keypadInput with a value of 0 and have if statements for each button correlating with the variable. And the variable will be in a text() positioned in the rect. Here’s my code so far

-- MathGame

-- Use this function to perform your initial setup
function setup()
    supportedOrientations(LANDSCAPE_ANY)
    --displayMode(FULLSCREEN)
    noFill()
    noSmooth()
    noStroke()
    pushStyle()
  -- Sprites in variables  
    right=0
    wrong=0
    clearButton = "Project:clearButton"
    backspaceButton = "Project:backspaceButton"
    enterButton = "Project:enterButton"
    professor = "Project:professor"
    speechBubble = "Project:speechBubble"
      -- List of positions for the keypad
local pos = {vec2(-250,0),vec2(-150,0),vec2(-50,0),vec2(-250,-100),vec2(-150,-100),vec2(-50,-100),vec2(-250,-200),vec2(-150,-200),vec2(-50,-200)}
pos[0]=vec2(-150,-300)

buttons={}
for i=0,9 do
    buttons[i]={} 
    buttons[i].img="Project:button"..i
    buttons[i].pos=vec2(WIDTH/2,HEIGHT/2)+pos[i]
end
end

function create()
    a={}
    ans={}
    str={}
    choice=math.random(4)
    c=math.random(4)    -- + - x /
    for z=1,4 do
    a[z]=vec2(math.random(99),math.random(99))
    if c==1 then
        str[z]=string.format("%d + %d = ",a[z].x,a[z].y)
        ans[z]=math.tointeger(a[z].x+a[z].y)
    elseif c==2 then
        str[z]=string.format("%d - %d = ",a[z].x,a[z].y)
        ans[z]=math.tointeger(a[z].x-a[z].y)
    elseif c==3 then
        str[z]=string.format("%d x %d = ",a[z].x,a[z].y)
        ans[z]=math.tointeger(a[z].x*a[z].y)
    elseif c==4 then
        str[z]=string.format("%d / %d = ",a[z].x,a[z].y)
        ans[z]=a[z].x/a[z].y
    end        
end
end

-- This function gets called once every frame
function touched(t)
    if t.state==ENDED then --wait for touch to end
    local touch=vec2(t.x,t.y)
    for i=0,9 do
        if touch:dist(buttons[i].pos)<75 then
            keyTouched=i
            return
            print("touch") --just a test to see if it registers the touch
        end
    end
end
end

-- This function gets called once every frame
function draw()

-- This sets a dark background color 
background(40, 40, 50)

-- This displays the 0-9 keypad
for i=0,9 do
    sprite(buttons[i].img,buttons[i].pos.x,buttons[i].pos.y,75)
end

-- This displays the input rectangle correlating with the keypad
rect(WIDTH/2-100, HEIGHT/2-300)

-- This displays the backspace, clear button and enter button
sprite(clearButton, WIDTH/2-250, HEIGHT/2-300, 75)
sprite(backspaceButton, WIDTH/2-50, HEIGHT/2-300, 75)
sprite(enterButton, WIDTH/2+50, HEIGHT/2+130, 75)

-- This displays the "Right" and "Wrong" at the top of the screen and the increments 
fill(255)
fontSize(48)
text("Right "..right,WIDTH/2-100,HEIGHT-50) -- "Right 0" 
text("Wrong "..wrong,WIDTH/2+100,HEIGHT-50) -- "Wrong 0"
rect(WIDTH/2-300, HEIGHT/2+100, 300, 50) -- Input bar

-- This displays the professor sprite and his speech bubble
sprite(professor, WIDTH/2+225,HEIGHT/2-100, 350, 600)
sprite(speechBubble, WIDTH/2+75, HEIGHT/2+225, 250, 150)

fill(0, 0, 0, 255)
text(str[choice],WIDTH/2+75,HEIGHT/2+230)
end

(http://imgur.com/oV9YB7d)

@CodingIsLife It’s hard to look at code that has images that can’t be seen. When I tried to run your code, I got an error. Apparently the function create() isn’t being executed. The picture above looks good.

@CodingIsLife I replaced your images with my own and fixed the error so the code runs.

@CodingIsLife Find these lines of code in your program. Make the changes I indicated with moved here or added. This should give you some help.

supportedOrientations(LANDSCAPE_ANY)    -- moved here
displayMode(FULLSCREEN)     -- moved here

-- Use this function to perform your initial setup
function setup()
    value=0     -- added
    create()    -- added
    noFill()
    noSmooth()
    noStroke()
    pushStyle()
function touched(t)
    if t.state==ENDED then --wait for touch to end
        local touch=vec2(t.x,t.y)
        for i=0,9 do
            if touch:dist(buttons[i].pos)<75 then
                keyTouched=i
                value=value*10+i    --added
                return
            end
        end
    end
end
    text("Wrong "..wrong,WIDTH/2+100,HEIGHT-50) -- "Wrong 0"
    rect(WIDTH/2-300, HEIGHT/2+100, 300, 50) -- Input bar
    
    fill(0)     -- added
    text(value,WIDTH/2-150,HEIGHT/2+120)    -- added
    
    -- This displays the professor sprite and his speech bubble
    sprite(professor, WIDTH/2+225,HEIGHT/2-100, 350, 600)
    sprite(speechBubble, WIDTH/2+75, HEIGHT/2+225, 250, 150)

@dave1707 Wow! You’re the best. Honestly this has helped so much. This program is almost there! :slight_smile:

Now the clear and backspace buttons need to be programmed and the correlation between the value and answer of the question. Time to get back at it

@dave1707 The emojii are a cool feature. I knew I could add print and add them with Unicode, but just picking them from the keyboard … Forehead smack … Of course.

Using the text function to implicitly convert the value … SMACK again … I was thinking of building the string … But it’s a number … Make that work for you!

@CodingIsLife. I think we have covered all the roadblocks. I’m interested in your final implementation… I think there is a lot to said for dave1707’s implementation of the state machine with a button class and an array mapped onto buttons, and using the state to calculate the value is way more maintainable than testing for the value. This saves a lot of effort and maintainable.

I’m probably going to continue this later on in the week due to my busy school schedule. I’ll definitely be popping in asking questions. I believe I have enough information to do the rest, but I’m sure I’ll be back asking questions :stuck_out_tongue: Thanks to everyone who wrote in this post.

@dave1707 Ugh I can’t seem to figure out the clear and backspace button mechanism. I understand that the value has to go back to 0 o for backspace value=value//10 but it just gives me errors. I know the code must go under the touch function but it isn’t working. It just gets confusing because all the keypad numbers are in a list and have their own chunk of code in the touch function that I don’t know what to do for the clear, backspace and enter button. This is my touch function, still the same.

function touched(t)
    if t.state==ENDED then --wait for touch to end
        local touch=vec2(t.x,t.y)
        for i=0,9 do
            if touch:dist(buttons[i].pos)<75 then
                keyTouched=i
                value=value*10+i
                return
            end
        end
    end
end