Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Multiple Screens

Hi everyone. I would like to be able to swap between two screens. i.e. I have a main screen with a chart on it and would like to have a second screen (a Settings screen) - selected when clicking on a "settings" button (or sprite) so the user can select a colour for the chart and text etc. then after clicking a "Done" button (or sprite) swap back to the Main screen. I have looked at the Codea samples but can't find anything (or maybe I missed it) Can anyone help me with a solution. Some sample code or steer me in the right direction. I would be very grateful.

Cheers

Will

Comments

  • dave1707dave1707 Mod
    Posts: 8,723

    @WilliamHouten Here’s a simple example of multiple screens. Tap the screen to switch between the 2 screens. A lot more control and info can be added to the screens, but this is just a quick example.

    viewer.mode=FULLSCREEN
    
    function setup()
        scrn1=true
        s1=image(WIDTH,HEIGHT)
        setContext(s1)
        background(67, 179, 236)
        sprite(asset.builtin.Planet_Cute.Character_Horn_Girl,WIDTH/2,HEIGHT/2)
        setContext()
        s2=image(WIDTH,HEIGHT)
        setContext(s2)
        background(236, 106, 67)
        sprite(asset.builtin.SpaceCute.Beetle_Ship,WIDTH/2,HEIGHT/2)
        setContext()
    end
    
    function draw()
        background(0)
        if scrn1 then
            sprite(s1,WIDTH/2,HEIGHT/2)
        else
            sprite(s2,WIDTH/2,HEIGHT/2)
        end
    end
    
    function touched(t)
        if t.state==BEGAN then
            scrn1=not scrn1
        end    
    end
    
  • dave1707dave1707 Mod
    edited December 2020 Posts: 8,723

    Here’s another example for multiple screens. Tap screen to switch. I just did simple sprites, but you can do anything you want on each of the screens.


    viewer.mode=FULLSCREEN function setup() rectMode(CENTER) x1,y1=100,100 xv1,yv1=2,3 x2,y2=200,300 xv2,yv2=-2,3 x3,y3=100,200 xv3,yv3=2,-3 dspl=1 end function draw() background(0) if dspl==1 then screen1() elseif dspl==2 then screen2() else screen3() end end function touched(t) if t.state==BEGAN then if t.x>WIDTH/2-75 and t.x<WIDTH/2+75 and t.y>175 and t.y<225 then dspl=(dspl+1)%3+1 end end end function screen1() background(236, 166, 67) sprite(asset.builtin.Planet_Cute.Character_Boy,x1,y1) x1=x1+xv1 y1=y1+yv1 if x1<1 or x1>WIDTH then xv1=-xv1 end if y1<1 or y1>HEIGHT then yv1=-yv1 end fill(67, 162, 236) rect(WIDTH/2,200,150,50) fill(255) text("Switch screen",WIDTH/2,200) end function screen2() background(67, 200, 236) sprite(asset.builtin.Planet_Cute.Character_Princess_Girl,x2,y2) x2=x2+xv2 y2=y2+yv2 if x2<1 or x2>WIDTH then xv2=-xv2 end if y2<1 or y2>HEIGHT then yv2=-yv2 end fill(236, 200, 67) rect(WIDTH/2,200,150,50) fill(255) text("Switch screen",WIDTH/2,200) end function screen3() background(67, 236, 69) sprite(asset.builtin.Planet_Cute.Character_Cat_Girl,x3,y3) x3=x3+xv3 y3=y3+yv3 if x3<1 or x3>WIDTH then xv3=-xv3 end if y3<1 or y3>HEIGHT then yv3=-yv3 end fill(236, 67, 208) rect(WIDTH/2,200,150,50) fill(255) text("Switch screen",WIDTH/2,200) end
  • Hi Dave. Thanks for your help. Being a noob, it's really helped. Can you give me some sample code to change screens if the sprite is touched rather than the screen? Would really be helpful..

    Thanks mate.

    Cheers

  • dave1707dave1707 Mod
    Posts: 8,723

    @WilliamHouten I changed the above program to tap a button to switch screens. A sprite could be used instead by replacing the rect and text statements for the button and changing the values in the touched function for the size of the sprite. I’ll let you try that. If you have trouble, let me know.

  • Hi Dave. That's fantastic. Exactly what I was after. Thanks so much for your help.

    Cheers buddy

    Will

Sign In or Register to comment.