Changing between the game states

Meg

New Member
Joined
Mar 5, 2019
Hello everyone,
I have a big problem with code for the user hitting a button and for the game to move to the correct game state and show the correct image. I've been stuck on this for a while now and I think that I have made things worse instead of better because my game stopped working :( .
 

dawlane

Active Member
CX Code Contributor
Joined
Jun 21, 2017
Without any basic code, we cannot see what you are trying to do.
 

Paul59

Active Member
CX Code Contributor
Joined
Dec 13, 2018
Location
UK
I don't know how to make the selected image appear after pressing the button on the menu
Can you be a bit more specific? Where is the image supposed to appear? As you say it relates to your game state I'm guessing that you want to change from 'main menu' to 'game' state? Without more details, it's tricky trying to help :D
 

Meg

New Member
Joined
Mar 5, 2019
Can you be a bit more specific? Where is the image supposed to appear? As you say it relates to your game state I'm guessing that you want to change from 'main menu' to 'game' state? Without more details, it's tricky trying to help :D
That's exactly what I want to do, change the menu game state to the other ones when the button is pressed.
I tried to do it myself but I must have changed something because now the menu screen isn't coming up like it used to.

This is my code
Code:
 '
Strict








Import mojo





Global Game:Adventure





Function Main:Int()


    Game = New Adventure ()


    Return 0


End Function





'Class Vector


'    Field x:Float


'





' Constants used for setting the game state


Const GSTATE_TITLE:=0


Const GSTATE_PLAYING:=1


Const GSTATE_TUTORIAL:=2


Const GSTATE_LEVELS:=3


Const GSTATE_SCOREBOARD:=4


Const GSTATE_GAMEEND:=5


'tile size of the randomly generated blocks and


'Const TILE_WITGTH:48


'Const TILE_HEIGHT:48








'===========================================================================


'Class for the GAME


Class Adventure Extends App





'IMAGES FOR THE MAIN MENU BUTTONS


    Field intro_screen: Image


    Field play_game: Image


    Field tutorial: Image


    Field game_levels: Image


    Field scoring_board: Image


    'PLAYER


    Field player_ad:Image


    'STARS


    Field star: Image


    Field end_stars: Image


    'FINISH BANNERS


    Global win_banner:Image


    Global lose_banner:Image


    


    'NEW INSTANCE OF PLAYER


    Field ad_sprite:player


    


    'NEW INSTANCE OF STAR


    Field stars:star





'BUTTONS


    Const BTN_PLAY:=0


Const BTN_TUTORIAL:=1


Const BTN_LEVELS:=2


Const BTN_SCOREBOARD:=3








    Field image:Image


        Field gstate:Int 'Setting Game state as intiger


        


    


    Method OnCreate:Int()





'This will run ONCE as soon as the instance of the class is created in here you can load all the start up images AND your INTRO screen and sound files.


SetUpdateRate 60


image = LoadImage ("main.png")





' Get the buttons in to separate images and store them in to a list for easy processing.


TitleButtons()


gstate = GSTATE_TITLE


Return 0


End Method


'--------------------------------------------------------------------------





    Method OnUpdate:Int()


'This will be called as manny times as you wish and it will handle your inputs and the movments of your sprites


        Local mx:= MouseX(), my:= MouseY()


Local button:Int





'This will be called as manny times as you wish and it will handle your inputs and the movments of your sprites





' Select the code to use depending on game state


Select gstate


Case GSTATE_TITLE


' Check the buttons and get the button id if the left mouse button was pressed


button=CheckButtons(mx, my)


Select button


Case BTN_PLAY


gstate = GSTATE_PLAYING





' Clear the button list ready for any new buttons to be used.


ClearButtons()





Case BTN_TUTORIAL


gstate = GSTATE_TUTORIAL


Case BTN_LEVELS


gstate = GSTATE_LEVELS


Case BTN_SCOREBOARD


gstate = GSTATE_SCOREBOARD


End Select


Case GSTATE_PLAYING


         'If MouseHit(BNT_PLAY)


                    GSTATE= GSTATE_PLAYING    


                


Print "GSTATE_PLAYING"


    


Case GSTATE_TUTORIAL


Print "GSTATE_TUTORIAL"





Case GSTATE_LEVELS


Print "GSTATE_LEVELS"





Case GSTATE_SCOREBOARD


Print "GSTATE_SCOREBOARD"





Case GSTATE_GAMEEND


gstate = GSTATE_TITLE


Print "GSTATE_GAMEEND"





' Reset the buttons back into the button list for the title


TitleButtons()


End Select





            Return 0


    


    End Method


    '--------------------------------------------------------------------------


    


        Method OnRender:Int()


          'All drawing commands this is the only place that they can be called in.


      'Beckground colour - BLACK-------------------------------------------------


            Cls (0,0,0)


      'Setting the image dimentions + position-----------------------------------


            DrawImage(image, 0,40)


            SetColor 255,255,255


    


    


            Select gstate


                Case GSTATE_TITLE


    


                Case GSTATE_PLAYING


                    Drawtext("This is the Playing State",320,100,0.5)


                Case GSTATE_TUTORIAL


    


                Case GSTATE_LEVELS


    


                Case GSTATE_SCOREBOARD


    


                Case GSTATE_GAMEEND


            End


             Return 0


            


        End Method


    '--------------------------------------------------------------------------


    


    


       Method OnLoading:Int()


           'You can also drawing commands in here however they will be called on loading insted of on render.


    


    


            Return 0


    


        End Method


    '--------------------------------------------------------------------------


    


       Method OnSuspend:Int()


           'Method you called when the app is suspended, when you go off the app but the app is still running in the background.


    


    


            Return 0


    


        End Method


     '--------------------------------------------------------------------------


    


       Method OnResume:Int()


           'Method called up when you resume playing the app


    


            Return 0


        End Method


    '--------------------------------------------------------------------------


' Set buttons for title screen


Method TitleButtons:Void()


' CreateButton(button id, x position, y position, reference image x position,


'reference image y position, reference image width, reference image height)


CreateButton(BTN_PLAY,442, 192+40, 442, 192, 180, 55, image)


CreateButton(BTN_TUTORIAL, 442, 266+40, 442, 266, 180, 26, image)


CreateButton(BTN_LEVELS, 442, 292+40, 442, 292, 182, 26, image)


CreateButton(BTN_SCOREBOARD, 442, 320+40, 442, 320, 180, 26, image)


End Method


'----------------------------------------------------------------------------





End Class


'===============================================================================================





' Simple button class that will represent a button


Class CButton


Global buttons:=New Stack<CButton>    ' Store any buttons to be used


Field img:Image


Field imgHover:Image


Field x:Int


Field y:Int


Field id:Int


Field hover:Bool





' Create a button by passing the image id, the x and y position,


' reference image x and y position, reference image width and height


Method New(id:Int, x:Int, y:Int, imgX:Int, imgY:Int, imgW:Int, imgH:Int, img:Image)


Self.img = img.GrabImage(imgX, imgY, imgW, imgH, 1)


Self.x = x


Self.y = y


Self.id = id


End Method





' Create a button by passing the image id, the x and y position and two images


Method New(id:Int, x:Int, y:Int, img:Image, imgHover:Image)


Self.img = img


Self.imgHover = imgHover


Self.x = x


Self.y = y


Self.id = id


End Method





' Checks each button in the list to see if the mouse is over a button


Method Check:Int(mx:Float, my:Float)


If Point2RectBounds(mx, my, x, y, x+img.Width(), y+img.Height())


' If the mouse left button is pressed then return the buton id


If MouseHit(MOUSE_LEFT) Then Return id


hover = True


Return -1


Endif


hover = False


Return -1


End Method





' Draw the button image


Method Draw:Void()


' If no second image is used for the hover image, then use the main image and just change the colour.


If imgHover=Null


If hover Then SetColor(255,255,0) Else SetColor(255,255,255)


DrawImage(img, x, y)


Else


If hover Then DrawImage(imgHover, x, y) Else DrawImage(img, x, y)


Endif


End Method





End Class











'IMAGE


'Function for the image resizing -----------------------------------------------


Function argb:Int(r:Int, g:Int, b:Int ,alpha:Int=255)


Return (alpha Shl 24) | (r Shl 16) | (g Shl 8) | b


End Function





'_________________________________________________________________________________








'BUTTON


' Global function to create a button using an image for reference


Function CreateButton:Void(id:Int, x:Int, y:Int, imgX:Int, imgY:Int, imgW:Int, imgH:Int, img:Image)


CButton.buttons.Push(New CButton(id, x, y, imgX, imgY, imgW, imgH, img))


End Function





' Global function to create a button using two image - the first image for a normal button


'and the second for when the mouse is over the button.


Function CreateButton:Void(id:Int, x:Int, y:Int, img:Image, imgHover:Image)


CButton.buttons.Push(New CButton(id, x, y, img, imgHover))


End Function





' Global function to check the buttions


Function CheckButtons:Int(mx:Float, my:Float)


Local id:=-1


For Local i:=Eachin CButton.buttons


id = i.Check(mx, my)


If id>=0 Then Exit


Next


Return id


End Function





'Global function to draw the buttons


Function DrawButtons:Void()


For Local i:=Eachin CButton.buttons


i.Draw()


Next


End Function





Function ClearButtons:Void()


CButton.buttons.Clear()


End Function








#Rem    This is a general purpose function to check if a point is within a rectangle.


x and y is the position of the point in 2D space


x1 and y1 is the top left corner of the rectangle.


#End    x2 and y2 is the bottom right of the rectangle and would be the rectangles x positon + width and the rectangles y position + height





Function Point2RectBounds:Bool(x:Float, y:Float, x1:Float, y1:Float, x2:Float, y2:Float)


If x > x1 And x < x2 And y > y1 And y < y2 Then Return True


Return False


End Function
I have also attached the relevant images
Sorry for being so vague, not the best at explaining things:confused:
 

Attachments

Paul59

Active Member
CX Code Contributor
Joined
Dec 13, 2018
Location
UK
You don't seem to have anything set to be drawn in the 'Select' statement of OnRender() (other than putting a text message on screen).
Cerberus X:
            Select gstate

                Case GSTATE_TITLE

                Case GSTATE_PLAYING

                    Drawtext("This is the Playing State",320,100,0.5)

                Case GSTATE_TUTORIAL


                Case GSTATE_LEVELS


                Case GSTATE_SCOREBOARD


                Case GSTATE_GAMEEND


            End
 

Paul59

Active Member
CX Code Contributor
Joined
Dec 13, 2018
Location
UK
Also, there seems to be no menu state in the select statement :D

Another thing that might save some typing, instead of

Code:
Const GSTATE_TITLE:=0
etc

take a look at 'Enumerate', for example:

Code:
Enumerate TITLE,  MENU, PLAYING, OPTIONS
You can then use 'if gamestate = MENU then ...' and so on.
 

Meg

New Member
Joined
Mar 5, 2019
You don't seem to have anything set to be drawn in the 'Select' statement of OnRender() (other than putting a text message on screen).
Cerberus X:
            Select gstate

                Case GSTATE_TITLE

                Case GSTATE_PLAYING

                    Drawtext("This is the Playing State",320,100,0.5)

                Case GSTATE_TUTORIAL


                Case GSTATE_LEVELS


                Case GSTATE_SCOREBOARD


                Case GSTATE_GAMEEND


            End
Sorry I have sent you the wrong file, I have managed to get it working (but still not in the way that i would like it to) I had couple of syntax errors.
Code:
Strict








Import mojo





Global Game:Adventure





Function Main:Int()


    Game = New Adventure ()


    Return 0


End Function





'Class Vector


'    Field x:Float


'





' Constants used for setting the game state


Const GSTATE_MENU:=0


Const GSTATE_PLAYING:=1


Const GSTATE_TUTORIAL:=2


Const GSTATE_LEVELS:=3


Const GSTATE_SCOREBOARD:=4


Const GSTATE_GAMEEND:=5


'tile size of the randomly generated blocks and


'Const TILE_WITGTH:48


'Const TILE_HEIGHT:48








'===========================================================================


'Class for the GAME


Class Adventure Extends App





'IMAGES FOR THE MAIN MENU BUTTONS


    Field intro_screen: Image


    Field play_game: Image


    Field tutorial: Image


    Field game_levels: Image


    Field scoring_board: Image


    'PLAYER


    Field player_ad:Image


    'STARS


    Field star: Image


    Field end_stars: Image


    'FINISH BANNERS


    Global win_banner:Image


    Global lose_banner:Image


    


    'NEW INSTANCE OF PLAYER


    Field ad_sprite:player


    


    'NEW INSTANCE OF STAR


    Field stars:star





'BUTTONS


    Const BTN_PLAY:=0


Const BTN_TUTORIAL:=1


Const BTN_LEVELS:=2


Const BTN_SCOREBOARD:=3








    Field image:Image


        Field gstate:Int 'Setting Game state as intiger


        


    


    Method OnCreate:Int()





'This will run ONCE as soon as the instance of the class is created in here you can load all the start up images AND your INTRO screen and sound files.


SetUpdateRate 60


image = LoadImage ("main.png")


            intro_screen = LoadImage("main.png") 'Loading the image for main screen


            play_game = LoadImage ("flowers.jpg") ' Loading the inage for the game


            tutorial = LoadImage ("tutorial.png")' Loading the image to show the tutorial


            game_levels= LoadImage ("levels.png") 'Loading page with all the levels on


            scoring_board = LoadImage ("scoring.png") 'Loading the scoring board image


            win_banner =LoadImage ("win.png") ' Loading the win banner which will appear if the player wins a level


            lose_banner= LoadImage("lose.png") 'Loading the lose banner which will appear in the user loses the level


            


' Get the buttons in to separate images and store them in to a list for easy processing.


TitleButtons()


gstate = GSTATE_MENU


Return 0


End Method


'--------------------------------------------------------------------------





    Method OnUpdate:Int()


'This will be called as manny times as you wish and it will handle your inputs and the movments of your sprites


        Local mx:= MouseX(), my:= MouseY()


Local button:Int





'This will be called as manny times as you wish and it will handle your inputs and the movments of your sprites





' Select the code to use depending on game state


Select gstate


Case GSTATE_MENU


' Check the buttons and get the button id if the left mouse button was pressed


button=CheckButtons(mx, my)


Select button


Case BTN_PLAY


gstate = GSTATE_PLAYING





' Clear the button list ready for any new buttons to be used.


ClearButtons()





Case BTN_TUTORIAL


gstate = GSTATE_TUTORIAL


Case BTN_LEVELS


gstate = GSTATE_LEVELS


Case BTN_SCOREBOARD


gstate = GSTATE_SCOREBOARD


End Select


Case GSTATE_PLAYING


         'If MouseHit(BNT_PLAY


Print "GSTATE_PLAYING"


    


Case GSTATE_TUTORIAL


Print "GSTATE_TUTORIAL"





Case GSTATE_LEVELS


Print "GSTATE_LEVELS"





Case GSTATE_SCOREBOARD


Print "GSTATE_SCOREBOARD"





Case GSTATE_GAMEEND


gstate = GSTATE_MENU


Print "GSTATE_GAMEEND"





' Reset the buttons back into the button list for the title


TitleButtons()


End Select





            Return 0


    


    End Method


    '--------------------------------------------------------------------------


    


        Method OnRender:Int()


          'All drawing commands this is the only place that they can be called in.


      'Beckground colour - BLACK-------------------------------------------------


            Cls (0,0,0)


      'Setting the image dimentions + position-----------------------------------


            DrawImage(image, 0,40)


            SetColor 255,255,255


    


    


            Select gstate


                Case GSTATE_MENU


                     DrawImage(intro_screen,0,40)


                Case GSTATE_PLAYING


                    'Drawtext("This is the Playing State",320,100,0.5)


                    DrawImage (play_game,0,40)


                Case GSTATE_TUTORIAL


                    DrawImage (tutorial,0,40)


                Case GSTATE_LEVELS


                    DrawImage (game_levels,0,40)


                Case GSTATE_SCOREBOARD


                    DrawImage (scoring_board,0,40)


                Case GSTATE_GAMEEND


            End


             Return 0


            


        End Method


    '--------------------------------------------------------------------------


    


    


       Method OnLoading:Int()


           'You can also drawing commands in here however they will be called on loading insted of on render.


    


    


            Return 0


    


        End Method


    '--------------------------------------------------------------------------


    


       Method OnSuspend:Int()


           'Method you called when the app is suspended, when you go off the app but the app is still running in the background.


    


    


            Return 0


    


        End Method


     '--------------------------------------------------------------------------


    


       Method OnResume:Int()


           'Method called up when you resume playing the app


    


            Return 0


        End Method


    '--------------------------------------------------------------------------


' Set buttons for title screen


Method TitleButtons:Void()


' CreateButton(button id, x position, y position, reference image x position,


'reference image y position, reference image width, reference image height)


CreateButton(BTN_PLAY,442, 192+40, 442, 192, 180, 55, image)


CreateButton(BTN_TUTORIAL, 442, 266+40, 442, 266, 180, 26, image)


CreateButton(BTN_LEVELS, 442, 292+40, 442, 292, 182, 26, image)


CreateButton(BTN_SCOREBOARD, 442, 320+40, 442, 320, 180, 26, image)


End Method


'----------------------------------------------------------------------------





End Class


'===============================================================================================





' Simple button class that will represent a button


Class CButton


Global buttons:=New Stack<CButton>    ' Store any buttons to be used


Field img:Image


Field imgHover:Image


Field x:Int


Field y:Int


Field id:Int


Field hover:Bool





' Create a button by passing the image id, the x and y position,


' reference image x and y position, reference image width and height


Method New(id:Int, x:Int, y:Int, imgX:Int, imgY:Int, imgW:Int, imgH:Int, img:Image)


Self.img = img.GrabImage(imgX, imgY, imgW, imgH, 1)


Self.x = x


Self.y = y


Self.id = id


End Method





' Create a button by passing the image id, the x and y position and two images


Method New(id:Int, x:Int, y:Int, img:Image, imgHover:Image)


Self.img = img


Self.imgHover = imgHover


Self.x = x


Self.y = y


Self.id = id


End Method





' Checks each button in the list to see if the mouse is over a button


Method Check:Int(mx:Float, my:Float)


If Point2RectBounds(mx, my, x, y, x+img.Width(), y+img.Height())


' If the mouse left button is pressed then return the buton id


If MouseHit(MOUSE_LEFT) Then Return id


hover = True


Return -1


Endif


hover = False


Return -1


End Method





' Draw the button image


Method Draw:Void()


' If no second image is used for the hover image, then use the main image and just change the colour.


If imgHover=Null


If hover Then SetColor(255,255,0) Else SetColor(255,255,255)


DrawImage(img, x, y)


Else


If hover Then DrawImage(imgHover, x, y) Else DrawImage(img, x, y)


Endif


End Method





End Class











'IMAGE


'Function for the image resizing -----------------------------------------------


Function argb:Int(r:Int, g:Int, b:Int ,alpha:Int=255)


Return (alpha Shl 24) | (r Shl 16) | (g Shl 8) | b


End Function





'_________________________________________________________________________________








'BUTTON


' Global function to create a button using an image for reference


Function CreateButton:Void(id:Int, x:Int, y:Int, imgX:Int, imgY:Int, imgW:Int, imgH:Int, img:Image)


CButton.buttons.Push(New CButton(id, x, y, imgX, imgY, imgW, imgH, img))


End Function





' Global function to create a button using two image - the first image for a normal button


'and the second for when the mouse is over the button.


Function CreateButton:Void(id:Int, x:Int, y:Int, img:Image, imgHover:Image)


CButton.buttons.Push(New CButton(id, x, y, img, imgHover))


End Function





' Global function to check the buttions


Function CheckButtons:Int(mx:Float, my:Float)


Local id:=-1


For Local i:=Eachin CButton.buttons


id = i.Check(mx, my)


If id>=0 Then Exit


Next


Return id


End Function





'Global function to draw the buttons


Function DrawButtons:Void()


For Local i:=Eachin CButton.buttons


i.Draw()


Next


End Function





Function ClearButtons:Void()


CButton.buttons.Clear()


End Function








#Rem    This is a general purpose function to check if a point is within a rectangle.


x and y is the position of the point in 2D space


x1 and y1 is the top left corner of the rectangle.


#End    x2 and y2 is the bottom right of the rectangle and would be the rectangles x positon + width and the rectangles y position + height





Function Point2RectBounds:Bool(x:Float, y:Float, x1:Float, y1:Float, x2:Float, y2:Float)


If x > x1 And x < x2 And y > y1 And y < y2 Then Return True


Return False


End Function
If you run this code you will see that the images are showing up when pressed the correct button but they are all over the place.

You will also need this image because I still haven't started the actual playing gstate.
 

Attachments

dawlane

Active Member
CX Code Contributor
Joined
Jun 21, 2017
I think you need to reformat your code so that it's easily readable. If you are going to copy anything, use the icons in the top right corne of the code window.
 

Meg

New Member
Joined
Mar 5, 2019
I think you need to reformat your code so that it's easily readable. If you are going to copy anything, use the icons in the top right corne of the code window.
I'll try and sort the code out, I know that it's a mess. What icon do you mean ?
 

dawlane

Active Member
CX Code Contributor
Joined
Jun 21, 2017
There are two icons, one looks like a broken square and next to it is a little clipboard for copying code.
 

Meg

New Member
Joined
Mar 5, 2019
Also, there seems to be no menu state in the select statement :D

Another thing that might save some typing, instead of

Code:
Const GSTATE_TITLE:=0
etc

take a look at 'Enumerate', for example:

Code:
Enumerate TITLE,  MENU, PLAYING, OPTIONS
You can then use 'if gamestate = MENU then ...' and so on.
Could you explain the Enumerate? Do I have to import something in order to use it?
 

Meg

New Member
Joined
Mar 5, 2019
Does anyone know a way of resizing all images together so that I don't have to change the dimensions of every individual image?
 

Rich

Active Member
3rd Party Module Dev
Joined
Sep 9, 2017
Does anyone know a way of resizing all images together so that I don't have to change the dimensions of every individual image?
Code:
DrawImage img1,100,100,0,0.5,0.5
DrawImage img1,200,100,0,0.5,0.5
Draws 2 images scaled individually. Draws at 100,100 and 200,100

Code:
Scale 0.5,0.5
DrawImage img1,100,100
DrawImage img1,200,100
Scales both images, but also scales the co-ordinates. So they are drawn at 50,50 and 100,50
 

Meg

New Member
Joined
Mar 5, 2019
Code:
DrawImage img1,100,100,0,0.5,0.5
DrawImage img1,200,100,0,0.5,0.5
Draws 2 images scaled individually. Draws at 100,100 and 200,100

Code:
Scale 0.5,0.5
DrawImage img1,100,100
DrawImage img1,200,100
Scales both images, but also scales the co-ordinates. So they are drawn at 50,50 and 100,50
Thank you :)!!
 
Top Bottom