help with a simple info button to display new window or screen?

I have been looking through the examples in Codea - specifically the ‘Spritely’ example because it uses an info button to display instructions - however, I am having difficulty reading through the various tabs trying to decipher and pick out the relevant code to help me do this. I must not be fully understanding the touch class with regard to this? I have tried examples and I get output that tells me the button has been activated… (using a sprite as a button - thanks ChrisF!)… also that a single or double tap has occurred and swiping too but I just can’t work out how to make the action bring up a window / new screen. I am new to coding in general so sorry in advance if this is a dumb question but is there anyone that could explain this in simple terms to me and help me out please?

Here is something I had from long ago that might give you an idea. There are a lot of different ways to do what you are asking.


displayMode(FULLSCREEN)
supportedOrientations(PORTRAIT)        -- set for portrait mode

function setup()
    func=menu
end

function draw()
    func()
end

function menu()
    background(0,0,200)  
    
    w=WIDTH/2            -- set width value
    eh=HEIGHT-400        -- set height of different options
    nh=HEIGHT-600        -- eh easy, nh normal, hh hard
    hh=HEIGHT-800
     
    fontSize(48)            -- set font size
    fill(255,0,0)            -- set font color
    
    menuTitle1="Main Menu"            -- main title
    menuTitle2="Select Option"    
    text(menuTitle1,w,HEIGHT-100)     -- display titles 
    text(menuTitle2,w,HEIGHT-200)      
 
    fill(0,255,0)           -- set easy values
    
    t1="Easy"
    text(t1,w,eh)
    w1,h1=textSize(t1)     -- width and height of easy text 
     
    t2="Normal"            -- set normal values
    text(t2,w,nh)
    w2,h2=textSize(t2)      -- width and height of normal text
    
    t3="Hard"                -- set hard values
    text(t3,w,hh)  
    w3,h3=textSize(t3)      -- width and height of hard text  
end

function easy()
    background(40,40,50)
    text("EASY screen",WIDTH/2,HEIGHT/2)
    text("tap screen for menu",WIDTH/2,HEIGHT/2-200)
end

function normal()
    background(40,40,50)
    text("NORMAL screen",WIDTH/2,HEIGHT/2)
    text("tap screen for menu",WIDTH/2,HEIGHT/2-200)
end

function hard()
    background(40,40,50)
    text("HARD screen",WIDTH/2,HEIGHT/2)
    text("tap screen for menu",WIDTH/2,HEIGHT/2-200)
end

function touched(t)
    if t.state==BEGAN then
        if func ~= menu then
            func=menu
            return
        end
        if func==menu then
            if t.x>w-w1/2 and t.x<w+w1/2 and t.y>eh-h1/2 and t.y<eh+h1/2 then
                func=easy
            end
            if t.x>w-w2/2 and t.x<w+w2/2 and t.y>nh-h2/2 and t.y<nh+h2/2 then
                func=normal
            end
            if t.x>w-w3/2 and t.x<w+w3/2 and t.y>hh-h3/2 and t.y<hh+h3/2 then
                func=hard
            end  
       end
    end  
end

This is great! It makes it really clear for me and I now totally get it. Thanks so much … :smiley:

this is really what i’m looking for but I feel I dont understand the everything here. Please bare with the noob questions.

Why doesn’t it work calling menu() from draw()?

When does the easy, medium and hard functions get called?

trying to learn how to set up buttons but feel i dont really get it.

If you call menu() from draw, that’s all you’ll be calling 60 times per second. The call to func() allows you to change what function is getting called. Func() starts out as being Menu, so that’s what gets executed. While you’re in menu, you have the option to call easy, normal, or hard depending on what button you touch. When you make a selection, Func is assigned a function ( easy, normal, or hard ) and that’s what gets called in draw. You just keep moving between screens based on what you select.

thx dave for super quick response. I think what was confusing to me was that func could change which function it was in that way.

Ok, so here’s another noob follow up question. I used your code and trying to apply it to how think / would like to design the code. Problem is: I dont understand why it doesnt write “click” when state is set to 1 by the touch event. I know the code gets into the if but why doesnt it print “click”?


-- z001

-- displayMode(FULLSCREEN)
-- supportedOrientations(PORTRAIT)        -- set for portrait mode

-- Use this function to perform your initial setup
function setup()
    print("Hello World!")
    createMainMenu()
    state = 0
end



-- This function gets called once every frame
function draw()
    -- This sets a dark background color 
    background(0, 0, 0)

    -- This sets the line thickness
    strokeWidth(5)
    
    -- place main menu
   createMainMenu()
    
    
end

function createMainMenu()
    -- set positions for main menu
    menuLeftColumn = WIDTH/4
    menuRightColumn = menuLeftColumn+WIDTH/2
    menuTopRow = HEIGHT-850
    menuBottomRow = HEIGHT-910
    
    -- set style of main menu
    fill(255,255,255)
    fontSize(24)
    font("AmericanTypewriter-Bold")
    
    -- set main menu text
    create = "create"
    explore = "explore"
    use = "use"
    endDay = "end day"
    
    -- set size of menu buttons
    createWidth, createHeight = textSize(create)
    
    -- draw buttons
    text(explore, menuLeftColumn, menuTopRow)
    text(create, menuRightColumn, menuTopRow)
    
    if state == 1 then
        w = WIDTH/2
        h = HEIGHT/2
        fill(255,255,255)
        fontSize(42)
        text("click"' w, h)
        print(state)
    end
end

function touched(t)
    if t.state==BEGAN then
            if t.x>menuLeftColumn-createWidth/2 and t.x<menuLeftColumn+createWidth/2 and t.y>menuTopRow-createHeight/2 and t.y<menuTopRow+createHeight/2 then
                print("create")
                state = 1
            end
    end  
end

In FULLSCREEN mode you cant see the output panel where things are printed. Comment this line to see it.

In the section “if state == 1 then” the line of code “text(“click” ’ w, h)” is wrong. The ’ should be a , . It should be text(“click”, w,h) . Also, when to tap explore, you set state to 1 and print the value 1 every time draw is called, 60 times a second. Each time you tap explore, the word click prints, but is pushed off the top of the print window by all the 1’s printing.

Try changing the if statement to this. The problem is you’re mixing text and print. If you want print to work, then set state to 0. If you want text to show, then you don’t set state to 0 but print will show 60 times a second which is what you don’t want to do.


    if state == 1 then
        w = WIDTH/2
        h = HEIGHT/2
        fill(255,255,255)
        fontSize(42)
        text("click", w, h)     -- fixed the error here
        print(state)
        state=0         -- set state back to 0
    end

Oh, fantastic! I just had the print there for debug reasons. Maybe i should have said so.

Thinking of what im trying to achieve i think your example will be perfect. Will do some more coding and see how it goes.

Once again, super big thanks!