WP7 HUB_XNA

998 views

Published on

Fase 2.3 Descripción de las características de XNA.

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
998
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
18
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Start Visual StudioSelect File>New>Project to open the New Project dialogSelect XNA Game Studio 4 from the list of available templates on the leftSelect Windows Phone Game (4.0) from the template selection.Change the name to PongGame.Click OK.The project will now be created.Click Run to run the project. The emulator will start and display the blue screen.Click Stop to stop the program.Close Visual Studio and return to the presentation.
  • Open the PongGame project in Demo 2 Dot Sizes.Run the program.Rotate the emulator display so that it is landscape with the controls on the right. Explain that this is the default orientation for Windows Phone games.Open the file Game1.cs and navigate to the Draw method.Change the draw position and size of the dot in response to suggestions from the class.Try to draw the dot off the screen. Ask what will happen.Answer: XNA will just clip the display. This will work fineTry to draw a really big dot. Ask what will happen.Answer: The dot will be clipped again.Put the
  • Open the PongGame project in Demo 2 Moving Dot.Run the program.Show that the dot moves slowly down the screen.Ask what controls the speed of movement:Answer It is the rate at which Update is called and the size of the change applied to the position of the dot.Open the file Game1.cs and navigate to the Update method.Change the code to:ballRectangle.X++;ballRectangle.X++;Ask what this would do to the game.Answer: It would cause the ball to move across the screen and not down. The ball will also move twice as fast.Make the point that the game is presently being
  • WP7 HUB_XNA

    1. 1. Windows Phone 7 XNA<br /> A different kind of phone, designed for a life in motion<br />
    2. 2. XNA OVerview<br />A frameworktocreategameapplications<br />
    3. 3. XNA <br />XNA is a framework for writing games<br />It includes a set of professional tools for game production and resource management<br />Windows Phone uses version 4.0 of the framework<br />This is included as part of the Windows Phone SDK<br />
    4. 4. 2D and 3D games<br />XNA provides full support for 3D games<br />It allows a game program to make full use of the underlying hardware acceleration provided by the graphics hardware<br />For the purpose of this course we are going to focus on 2D gaming<br />Windows Phone games be either 2D or 3D<br />4<br />
    5. 5. XNA and Silverlight<br />XNA is completely different from Silverlight<br />The way that programs are constructed and execute in XNA is quite different<br />XNA has been optimised for game creation<br />It does not have any elements for user interface or data binding<br />Instead it has support for 3D rendering and game content management<br />5<br />
    6. 6. XNA and Programs<br />XNA provides a set of classes which allow you to create gameplay<br />The classes represent game information and XNA resources<br />XNA is also a very good example of how you construct and deploy a set of software resources in a Framework<br />
    7. 7. Creating a Game<br />The Windows Phone SDK provides a Windows Phone game project type<br />
    8. 8. The Game Project<br />The solution explorer shows the items that make up our game project<br />The solution will also contain any content that we add to the game project<br />
    9. 9. Empty Game Display<br />At the moment all our game does is display a blue screen<br />This is because the behaviour of the Draw method in a brand new project is to clear the screen to blue<br />
    10. 10. Demo 1: New Game<br />Demo<br />10<br />
    11. 11. What a Game Does When it Runs<br />Initialise all the resources at the start<br />fetch all textures, models, scripts etc<br />Repeatedly run the game:<br />Update the game world<br />read the user input, update the state and position of game elements<br />Draw the game world<br />render the game elements on the viewing device<br />
    12. 12. XNA Game Class Methods<br />partialclassPongGame : Microsoft.Xna.Framework.Game<br />{<br />protectedoverridevoidLoadContent<br /> (boolloadAllContent)<br /> {<br /> }<br />protectedoverridevoid Update(GameTimegameTime)<br /> {<br /> }<br />protectedoverridevoid Draw(GameTimegameTime)<br /> {<br /> }<br />}<br />
    13. 13. XNA Methods and games<br />Note that our program never calls the LoadContent, Draw and Update methods<br />They are called by the XNA Framework <br />LoadContent is called when the game starts<br />Draw is called as often as possible<br />Update is called 30 times a second<br />Note that this is not the same as an XNA game on Windows PC or Xbox, where Update is called 60 times a second<br />13<br />
    14. 14. Loading Game Content<br />protectedoverridevoidLoadContent()<br />{<br />// Create a new SpriteBatch, which can be used to <br />// draw textures.<br />spriteBatch = newSpriteBatch(GraphicsDevice);<br />}<br />LoadContent is called when our game starts<br />It is where we put the code that loads the content into our game<br />Content includes images, sounds, models etc.<br />
    15. 15. Game Content<br />Games are not just programs, they also contain other content:<br />Images for textures and backgrounds<br />Sound Effects<br />3D Object Meshes<br />We need to add this content to our project<br />The XNA framework provides a content management system which is integrated into Visual Studio<br />
    16. 16. Image Resources<br />This is a Ball image<br />I have saved it as a PNG file<br />This allows the image to use transparency<br />You can use any image resource you like <br />The resources are added to the Visual Studio project<br />They are held in the Content directory as part of your project<br />
    17. 17. Using the Content Pipeline<br />Each resource is given an asset name <br />The Load method of Content Manager provides access to the resource using the Asset Name that we gave it<br />ballTexture = Content.Load<Texture2D>("WhiteDot");<br />
    18. 18. Storing the Ball Texture in the game<br />// Game World<br />Texture2D ballTexture;<br />XNA provides a Texture2Dtype which holds a 2D (flat) texture to be drawn on the display<br />The game class needs to contain a member variable to hold the ball texture that is to be drawn when the game runs<br />This variable will be shared by all the methods in the game<br />
    19. 19. Loading Content into the Ball Texture<br />protectedoverridevoidLoadContent()<br />{<br />// Create a new SpriteBatch, which can be used to // draw textures.<br />spriteBatch = newSpriteBatch(GraphicsDevice);<br />ballTexture = Content.Load<Texture2D>("WhiteDot");<br />}<br />LoadContentis called when a game starts<br />It loads an image into the ball texture<br />The content manager fetches the images which are automatically sent to the target device<br />
    20. 20. Making a “sprite”<br />A sprite is an object on the screen of a game<br />It has both a texture and a position on the screen <br />We are creating a sprite object for the ball in our game<br />We now have the texture for the object<br />The next thing to do is position it on the screen<br />20<br />
    21. 21. Coordinates and Pixels<br />When drawing in XNA the position of an object on the screen is given using coordinates based on pixels<br />A standard Windows Phone screen is 800 pixels wide and 480 pixels high<br />This gives the range of possible values for display coordinates<br />If you draw things off the screen this does not cause XNA problems, but nothing is drawn<br />21<br />
    22. 22. X and Y in XNA<br />The coordinate system used by XNA sprite drawing puts the origin (0,0) in the top left hand corner of the screen<br />Increasing X moves an object across the screen towards the right<br />Increasing Y moves an object down the screen towards the bottom<br />It is important that you remember this<br />22<br />
    23. 23. Positioning the Ball using a Rectangle<br />// Game World<br />Texture2DballTexture;<br />RectangleballRectangle;<br />We can add a rectangle value to the game to manage the position of the ball on the screen<br />We will initialise it in the LoadContent method <br />
    24. 24. The Rectangle structure<br />Rectangle ballRectangle = newRectangle(<br /> 0, 0,<br />ballTexture.Width, ballTexture.Height),<br />Color.White);<br />Rectangle is a struct type which contains a position and a size<br />The code above creates a rectangle positioned at 0,0 (top left hand corner) the same size as ballTexture<br />We could move our ball by changing the content of the rectangle<br />
    25. 25. Drawing a Sprite<br />In game programming terms a “sprite” is a texture that can be positioned on the screen<br />We now have a ball sprite<br />We have the texture that contains an image of the ball<br />We have a rectangle that gives the position and size of the sprite itself<br />25<br />
    26. 26. XNA Game Draw Method<br />protectedoverridevoid Draw(GameTimegameTime)<br />{<br />GraphicsDevice.Clear(Color.CornflowerBlue);<br />base.Draw(gameTime);<br />}<br />The Draw method is called repeatedly when an XNA game is running<br />It has the job of drawing the display on the screen<br />A brand new XNA game project contains a Draw method that clears the screen to CornflowerBlue<br />We must add our own code to the method to draw the ball<br />
    27. 27. Sprite Batching<br />2D Graphics drawing is handled by a set of “sprite” drawing methods provided by XNA<br />These create commands that are passed to the graphics device<br />The graphics device will not want to draw everything on a piecemeal basis<br />Ideally all the drawing information, textures and transformations should be provided as a single item<br />The SpriteBatch class looks after this for us<br />
    28. 28. SpriteBatch Begin and End<br />protectedoverridevoid Draw(GameTimegameTime)<br />{<br />GraphicsDevice.Clear(Color.CornflowerBlue);<br />spriteBatch.Begin(); <br />// Code that uses spriteBatch to draw the display<br />spriteBatch.End();<br />base.Draw(gameTime);<br />}<br />The call to the Begin method tells SpriteBatch to begin a assembling a new set of drawing operations<br />The call to the End method tells SpriteBatch that the there are no more operations and causes the rendering to take place<br />
    29. 29. Using SpriteBatch.Draw<br />spriteBatch.Draw(ballTexture, ballRectangle, Color.White);<br />The SpriteBatch class provides a Draw method to do the sprite drawing<br />It is given parameters to tell it what to do:<br />Texture to draw<br />Position (expressed as a Rectangle)<br />Draw color<br />
    30. 30. Rectangle Fun<br />new Rectangle(<br /> 0, 0,<br />ballTexture.Width, <br />ballTexture.Height)<br />new Rectangle(<br /> 0, 0, // position<br /> 200,100) // size<br />new Rectangle(<br /> 50, 50, // position<br /> 60, 60) // size<br />
    31. 31. Demo 2: Dot Sizes<br />Demo<br />31<br />
    32. 32. Screen Size and Scaling<br />We need to make our game images fit the size of the screen<br />We can find out the size of the screen from the GraphicsDevice used to draw it<br />GraphicsDevice.Viewport.WidthGraphicsDevice.Viewport.Height<br />We can use this information to scale the images on the screen<br />
    33. 33. Creating the ballRectangle variable<br />ballRectangle = newRectangle(<br /> 0, 0,<br />GraphicsDevice.Viewport.Width / 20,<br />GraphicsDevice.Viewport.Width/ 20);<br />If we use this rectangle to draw our ball texture it will be drawn as a square which is a twentieth of the width of the screen<br />We can then set the position parts of the rectangle to move the ball around the screen<br />
    34. 34. Moving the ball around the screen<br />At the moment the ball is drawn in the same position each time Draw runs<br />To move the ball around we need to make this position change over time<br />We need to give the game an update behaviour<br />We must add code to the Update method in the game<br />The Update method is where we manage the state of the “game world”<br />
    35. 35. The Update Method<br />protectedoverridevoid Update(GameTimegameTime)<br />{<br />// TODO: Add your update logic here<br />base.Update(gameTime);<br />}<br />The Update method is automatically called 30 times a second when a game is running<br />It is in charge of managing the “game world”<br />In a pong game this means updating the bat and the ball positions and checking for collisions<br />
    36. 36. Simple Update Method<br />protectedoverridevoid Update(GameTimegameTime)<br />{<br />ballRectangle.X++;<br />ballRectangle.Y++;<br />base.Update(gameTime);<br />}<br />Each time the game updates the X and Y position of the ball rectangle is increased<br />This will cause it to move across and down the screen<br />Note that I call the base method to allow my parent object to update too<br />
    37. 37. GameTime<br />At the moment the Update method is called sixty time a second or once every 16.66 milliseconds<br />We can also let the update "free run", in which case we need to know the time since the last call so we can move objects the right distance<br />This is what the GameTime parameter is for, it gives the time at which the method was called<br />
    38. 38. Demo 2: Moving Dot<br />Demo<br />38<br />
    39. 39. Summary<br />XNA is a Framework of methods that are used to write games<br />You create the games using Visual Studio <br />Games have initialise, update and draw behaviours<br />Game objects are held as textures objects and their position and dimensions as rectangle structures<br />

    ×