Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
So the next thing we need to add to our menu state is our Play button, and this is obviously what you're going to click on when you want to actually start playing the game. So Starling actually has a class called Button which makes it very easy obviously to create buttons. So I'm going to come under our logo here, create a new variable called play, I'm going to set that equal to a new instance of the Starling.display.button class. Into this you can pass in different textures for the up and the down states, we're not going to deal with that, we're just going to do an up state to keep it simple.
And for the texture, again, we're going to use a texture which is in that texture atlas. So Assets.ta.getTexture and the texture is called "playButton", and let's go ahead and create that playButton as an instance variable. Now when we're dealing with buttons there is a special event in Starling called a triggered event and that's essentially going to be fired whenever you click on the button. So let's listen for that now, so play. addEventListener (Event, and again make sure you're using Starling.events and it's Event.TRIGGERED, and we'll have it call a method called onPlay.
So go ahead and create that method now, and the only thing you have to do is to come in and put in that event object. Now we need to position the play button, so it's in the right location. And much like I did before for the logo we're going to first set its pivot point, so we are going to say play.pivotX = play.width * 0.5; and we'll position it on the X axis in the center of our game, so play.X = 400, play.y is going to be equal to 450.
And lastly let's add that Play button to the display list. So now when the button is clicked on, this is where we're going to actually change the state of our game. So we're going to call back out to our main Game class, called the changeState method and change the state to the play state. So in our onPlay method here, we're going to say game, then we're going to call the changeState method, and we're going to use that constant of the game class called PLAY_STATE. Let's save it.
And let's go ahead and test it now. So we have it launched and we can see we have our image and we have our Play button. So again, now when we press this PLAY GAME button it's essentially going to go out and change the state, but we haven't put any visuals yet on the Play State so when I click it, you can see we don't see anything that's because first of all we haven't destroyed the menu state. And then we also don't have any visuals yet in the actual play state, and that's what we're going to do in the next movie.
Get unlimited access to all courses for just $25/month.Become a member
82 Video lessons · 98450 Viewers
61 Video lessons · 85739 Viewers
71 Video lessons · 69645 Viewers
56 Video lessons · 101971 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.