New menus

Questions
1

Hi!
I’m making a program which should have 4 different buttons which open 4 different menus if I press any of them. How can I do these buttons?

2

Here’s something that i posted long ago.


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
3

Thank you @dave1707, I was trying to do something similar and this really helps

4

@Pontus712 That menu example isn’t the best example to start adding more buttons to. I’ll dig up another example that might help you more.

5

Thank you very much! How can I get a button in a specific place in the easy, normal and hard menu to go back to the “main menu”?

6

@Pontus712 Here’s another example that might help you. It’s easy to write menu programs when you know exactly what screens you want and what buttons will be on them. It’s hard to write a generic menu program.


function setup()
    func=menu
    mb1=button(WIDTH/2,HEIGHT-200,100,50,"EASY")
    mb2=button(WIDTH/2,HEIGHT-400,100,50,"NORMAL")
    mb3=button(WIDTH/2,HEIGHT-600,100,50,"HARD")
    eb1=button(WIDTH/2,HEIGHT-200,100,50,"Menu")
    nb1=button(WIDTH/2,HEIGHT-300,100,50,"Menu")
    hb1=button(WIDTH/2,HEIGHT-400,100,50,"Menu")
end

function draw()
    background(40, 40, 50)
    func()       
end

function touched(t)
    if t.state==BEGAN then
        if func==menu and mb1:touched(t)=="EASY" then
            func=easy
        elseif func==menu and mb2:touched(t)=="NORMAL" then
            func=normal
        elseif func==menu and mb3:touched(t)=="HARD" then
            func=hard
        elseif func==easy and eb1:touched(t)=="Menu" then
            func=menu
        elseif func==normal and nb1:touched(t)=="Menu" then
            func=menu
        elseif func==hard and hb1:touched(t)=="Menu" then
            func=menu
        end 
    end  
end

function menu()
    background(167, 125, 96, 255)
    mb1:draw()
    mb2:draw()
    mb3:draw()
end

function easy()
    background(0,0,255)
    fill(255)
    text("EASY Screen",WIDTH/2,HEIGHT/2)
    eb1:draw()
end

function normal()
    background(0,0,255)
    fill(255)
    text("NORMAL Screen",WIDTH/2,HEIGHT/2)
    nb1:draw()
end

function hard()
    background(0,0,255)
    fill(255)
    text("HARD Screen",WIDTH/2,HEIGHT/2)
    hb1:draw()
end

button = class()

function button:init(x,y,w,h,txt)
    self.x=x
    self.y=y
    self.w=w
    self.h=h
    self.txt=txt
end

function button:draw()
    rectMode(CENTER)
    fill(255)
    rect(self.x,self.y,self.w,self.h)
    fill(255,0,0)
    text(self.txt,self.x,self.y)
end

function button:touched(t)
    if t.state==BEGAN then
        if t.x>self.x-self.w/2 and t.x<self.x+self.w/2 and
            t.y>self.y-self.h/2 and t.y<self.y+self.h/2 then
                return self.txt
        end
    end
end
7

Thank you so much!!! @dave1707

8

@Pontus712 These are the classes that I use for my menus and buttons, its got most of the features that you’d ever want except for circular and curved buttons. You pass the ‘settings’ you want in the Menu init parameters and then just call draw and pass touch to it. touched will return the index of the button that was pressed. There’s also other Menu functions for changing the properties of different buttons.

Its to big to post I shared it on dropbox.
Link to file: https://www.dropbox.com/s/9j6q7o7xogj2xg7/MenuClasses5%3A15%3A2015.rtf?dl=0