Using Namepsaces  This section lists the namespaces that the application will be using frequently. Saves the programmer from specifying a fully qualified.

Slides:



Advertisements
Similar presentations
2000 Prentice Hall, Inc. All rights reserved. 1 Outline 3.1Introduction 3.2Game Loop Components 3.3How to Implement in C# 3.4Adding Image to XNA Project.
Advertisements

Summer Computing Workshop. Introduction to Variables Variables are used in every aspect of programming. They are used to store data the programmer needs.
WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
Using Journal and Other Tablet PC Tools. Tools Bars in Journal To access all tool bars click on view and select each tool bar to activate each.
Sprites, User Input, and Collision COSC 315 Fall 2014 Bridget M. Blodgett.
Constructor and New Fields // Don't synch draw() with vertical retrace of monitor graphics.SynchronizeWithVerticalRetrace = false; IsFixedTimeStep = true;
Dan Waters, Academic Relations Manager, Microsoft.
COMPUTER PROGRAMMING 2 Chapter 7 Sound. Objectives Find out how to prepare sounds for inclusion in Microsoft XNA projects. Incorporate sounds into XNA.
Chapter 6 Photoshop and ImageReady: Part II The Web Warrior Guide to Web Design Technologies.
Chapter 4 Adding Images. Inserting and Aligning Images Using CSS When you choose graphics to add to a web page, it’s important to use graphic files in.
BoardMaker Ver 6 Creating Interactive Activities for the Classroom.
GAME:IT Junior Bouncing Ball Objectives: Create Sprites Create Sounds Create Objects Create Room Program simple game.
Microsoft Office Illustrated Fundamentals Unit B: Understanding File Management.
CHAPTER 1 XNA Game Studio 4.0. Your First Project A computer game is not just a program—it is also lots of other bits and pieces that make playing the.
Scratch the Cat. Object Oriented Programing Writing computer programs Based on Objects Instead of Actions Based on Data Instead of Logic.
Java Programming, 2E Introductory Concepts and Techniques Chapter 2 Creating a Java Application and Applet.
11 Games and Content Session 4.1. Session Overview  Show how games are made up of program code and content  Find out about the content management system.
by Chris Brown under Prof. Susan Rodger Duke University June 2012
CHAPTER 4 Images XNA Game Studio 4.0. Objectives Find out how the Content Manager lets you add pictures to Microsoft XNA games. Discover how pictures.
Introduction to TouchDevelop
VIDEO GAME PROGRAMMING Video Game Programming Junior – DigiPutt INSTRUCTOR TEACHER’S ASSISTANT.
PMS /134/182 HEX 0886B6 PMS /39/80 HEX 5E2750 PMS /168/180 HEX 00A8B4 PMS /190/40 HEX 66CC33 By Adrian Gardener Date 9 July 2012.
Introduction to Visual Basic. Quick Links Windows Application Programming Event-Driven Application Becoming familiar with VB Control Objects Saving and.
11 A First Game Program Session Session Overview  Begin the creation of an arcade game  Learn software design techniques that apply to any form.
BIM211 – Visual Programming Objects, Collections, and Events 1.
Getting Started. XNA Game Studio 4.0 To download XNA Game Studio 4.0 itself, go to XNA Game.
Web Programming: Client/Server Applications Server sends the web pages to the client. –built into Visual Studio for development purposes Client displays.
Developing the Game User Interface (UI) Lesson 5.
Chapter 10 Fireworks: Part II The Web Warrior Guide to Web Design Technologies.
Nonvisual Arrays and Recursion by Chris Brown under Prof. Susan Rodger Duke University June 2012.
Addison Wesley is an imprint of © 2010 Pearson Addison-Wesley. All rights reserved. Chapter 5 Working with Images Starting Out with Games & Graphics in.
Creating a Logo – Lesson 3 1 Creating a Logo Lesson 3.
11 Adding Sounds Session 7.1. Session Overview  Find out how to capture and manipulate sound on a Windows PC  Show how sound is managed as an item of.
Addison Wesley is an imprint of © 2010 Pearson Addison-Wesley. All rights reserved. Chapter 7 The Game Loop and Animation Starting Out with Games & Graphics.
Introduction to XNA Graphics Programming Asst. Prof. Rujchai Ung-arunyawee COE, KKU.
Lesson 11: Looking at Files and Folders what a file or folder is on the computer how to recognize a file or folder on the desktop how to recognize the.
McGraw-Hill © 2009 The McGraw-Hill Companies, Inc. All rights reserved. Chapter 6 Multiform Projects.
XNA An Introduction. What XNA is… Microsoft® XNA™ is composed of industry- leading software, services, resources, and communities focused on enabling.
XNA Game Studio 4.0 Keyboard and Mouse Controls + more on Animated Sprites.
Introduction to Flash Animation CS 318. Topics Introduction to Flash and animation The Flash development environment Creating Flash animations  Layers.
11 Making a Sprite Session 4.2. Session Overview  Describe the principle of a game sprite, and see how to create a sprite in an XNA game  Learn more.
Game Maker Terminology
Game Maker – Getting Started What is Game Maker?.
Sprites, User Input, and Collision COSC 315 Fall 2014 Bridget M. Blodgett.
XP Tutorial 8 Adding Interactivity with ActionScript.
XNA Basic Displaying Image & Collision Detect. What’s format image that XNA support? XNA support only.bmp.png and.jpg image..PNG have transparent region.
Visual Basic for Application - Microsoft Access 2003 Programming applications using Objects.
CHAPTER 14 Classes, Objects, and Games XNA Game Studio 4.0.
Creating a Java Application and Applet
CHAPTER 2 The Game Loop - Variables, Types, Classes and Objects in XNA XNA Game Studio 4.0.
11 Writing Text Session 5.1. Session Overview  Show how fonts are managed in computers  Discover the difference between bitmap fonts and vector fonts.
Playing with Sprites. XNA Game Lifecycle In the faceBall demo program we bounced a smiley face around the graphical display against a background image.
Copyright © Texas Education Agency, All rights reserved.1 Web Technologies Motion Graphics & Animation.
XNA ● Proprietary Microsoft framework ● C#. Interface.
XP Tutorial 3 Creating Animations. XP New Perspectives on Macromedia Flash MX Elements of Animation Layers are used to organize the content of.
XNA Tutorial 1 For CS134 Lecture. Overview Some of the hard work has already been done for you. If you build and run your game now, the GraphicsDeviceManager.
XP New Perspectives on Macromedia Dreamweaver MX 2004 Tutorial 5 1 Adding Shared Site Elements.
111 State Management Beginning ASP.NET in C# and VB Chapter 4 Pages
2D Graphics CMT3311. This covers... How to make a transparent sprite How to add a sprite to your project and draw it Properties of sprites and how to.
CHAPTER 5 Text XNA Game Studio 4.0. Objectives Discover how text is drawn using Microsoft XNA. Add some font resources to your XNA program. Draw some.
Sprites (Images) and Sounds
Tutorial 3 Creating Animations.
Graphical Output Basic Images.
Pixels, Colors and Shapes
PYGAME.
Flash Interface, Commands and Functions
Chapter 5 Working with Images
Introduction to Object-Oriented Programming
Arrays
Microsoft Office Illustrated Fundamentals
Presentation transcript:

Using Namepsaces  This section lists the namespaces that the application will be using frequently. Saves the programmer from specifying a fully qualified name every time that a method that is contained within is used.  (MSDN, 2012)

New Namespace  When you create a new game, XNA automatically creates a new namespace that is named whatever your game (filename) is named. In this example, the filename is “collision”.

 When you create a new game, your game is split into two projects  Gamename and GamenameContent  Collision Game1.cs holds the guts of your game (all pertinent actions) Program.cs holds the “Main” method which creates a new object of type “Game1”  CollisionContent Holds your resources: images/sounds/effects, etc for game (reed, 2010)

XNA generated code  When your game is created, by default it will automatically create a constructor/class for Game1, a couple class level variables, and five other methods (initialize(), LoadContent(), UnloadContent(), Update(), Draw())  (reed, 2010).

Class-level variables  Class level variables can be used anywhere within the class (class we begin working with is Game1).  Two class-level variables created by default: GraphicsDeviceManager graphics; SpriteBatch spriteBatch; Don’t forget the syntax for declaring variables: VariableType VariableName;  The variable type: GraphicsDeviceManager allows you to access the graphics device on your PC, Xbox 360, or Windows Phone 7 device (GraphicsDeviceManager has a property called “GraphicsDevice” that acts as a “pipeline” between the XNA game and the graphics card on your machine (GPU – Graphics Processing Unit); everything you do on the screen in your XNA game will run through this object  The variable type: SpriteBatch allows you draw sprites (2D or 3D image integrated into a larger scene). (reed, 2010)

The Five Methods  Initialize Method is called first. It is used to initialize variables (set values) and other objects associated with the Game1 object.  LoadContent Method is used to load any content (sounds, images, etc) needed for the game; called after the initialize method and any time the game needs to reload (player changes settings).  After the LoadContent method is finished loading, your XNA game will enter into what is referred to as a “Game Loop”.  The Game Loop consists only of the Update and Draw Method (called 60 times per second).  When the game is exited (back button on gamepad, red X on window, or alt+F4) the UnloadContent method will start. (reed, 2010)

XNA Game Cycle Initialize Update Draw LoadContent UnloadContent Game Loop (reed, 2010)

Using the Draw and Update Methods  All logic that will affect the game play should be in the Update or Draw method.  The draw method (used to draw things) should only be used when drawing your seen. Everything else needed to run your game (moving objects, checking for collisions, updating scores, etc) should be coded in the Update method. (reed, 2010)

Typical (nongame) development vs. Game development (VB.NET vs. XNA/C#)  Nongame development is event-driven (waits for the user to do something; i.e. vb.NET = clickEvent, checkboxChangedE vent, etc.)  Game development is “poll-driven”. The game is constantly looping (via game loop – draw/update) and “polling” to see if an event has taken place. (reed, 2010)

Draw Method  Protected is the access modifier. The protected modifier denotes that a member of a class is accessible only within that class and all derived classes. override is a keyword that denotes that the method overrides another method void is the return type (in this case, the method returns nothing) (  Parameters are sets of data that are passed to a method. The method will not be able to use the information if it is not sent to it. Similar to forwarding /text msgs.  The draw method receives a parameter. Type is GameTime, variable name is gameTime.  This variable (which is also passed to the Update Method) is used to keep track of the time in the game.  GameTime will be used later to help control framerate, animations, sounds, and other effects. (reed, 2010)

The Clear method via the GraphicsDevice The Clear method erases everything on the screen and covers the screen with the color specified (i.e. CornflowerBlue). This screen is erased and draw 60 times per second. It is more efficient to erase and redraw everything 60 times per second, rather than keep track of everything that moves in a scene from one frame to the next, draw the moved items in their new locations, and draw whatever was behind the object previously…. 1.Each scene that is drawn (from draw method) is referred to as a frame. 2.Displaying frames (very quickly) gives the illusion of motion – persistence of vision; multiple frames make up an animation in a game. 3.The number of frames drawn per second is known as the “framerate” (60fps = 60 frames per second). (reed, 2010).

Adding Sprites  All graphics, sounds, effects, and other items are loaded in XNA through the “content pipeline”. This tool converts files (jpg, png, bmp, etc) into an XNA friendly format (reed, 2010).  At this time please find an XNA logo (png) file from the internet. Save this file in your documents; name it: logo.png  Once you have done this please go to your XNA game.

Adding Sprites  You should have a new game named collision (Windows Game 4.0)  In the solution explorer, right-click “collisionContent”, click Add, and select a New Folder. Name your New Folder images

Adding Sprites  Right click your newly created images folder  Click add and select “existing item”.  Once the file window opens up, navigate to your logo file.  Click add.

Adding Sprites  Your logo.png file should now appear within the images folder.  Click on the logo.png file  The properties should display at the bottom. You know there are no problems using your file if you see “Texture – XNA Framework” located in the Content Importer and Processor properties. A texture is a 2D image that will be applied to a surface; this will be discussed in more detail when we get to 3D objects.  Please note the Asset Name (logo) not the filename (logo.png) is used to reference this file during runtime (this will be explained in further detail).  Asset Names can be changed, but they must be unique (no duplicates).  By creating subfolders (i.e. images) for your resources, you can use duplicate resource names in different folders (i.e. creating a sound called explosion and placing in a subfolder named “sound” and using an image named “explosion” and putting it in the “image” folder. (reed, 2010)

Using your Sprite  Now that content pipeline recognizes your image, it can be drawn on the screen.  Before the image can be drawn, resources need to be loaded from the content pipeline into variables that can be manipulated.  The default object used to store an image is Texture2D. We will add a variable named texture using this object/type  Syntax:  Texture2D texture; Declare this variable in the Game1 class (right beneath the graphics and spriteBatch variables). (reed, 2010)

Creating the texture variable  Your code should look like the code above  This creates the variable (texture) to hold your image file in.

 The content property of the Game class is how you assign the image to the variable. As you can see from the code below, the Content.Load method is passed a parameter = the path to the image file.  symbol makes sure the string that follows (“ ”) is interpreted literally and ignores the escape sequences (/).  can also be written as (“images//logo”)  Now that you have loaded your image file into your texture variable, it can be drawn on the screen. To the Draw Method we go! (reed, 2010)

Drawing our Sprite  Add the three lines of code:  spriteBatch.Begin();  spriteBatch.Draw(texture, Vector2.Zero, Color.White);  spriteBatch.End();  Your code should now resemble the code below. RUN THE PROGRAM…..

Your screen should look like this:

Let’s look at those last three lines….  All three lines are using the spriteBatch variable/object. It is of the “SpriteBatch” type and we defined earlier as a class-level variable  And we instantiated (set) it as a new SpriteBatch (using the GraphicsDevice of the PC, Xbox, or Windows Phone 7 device) in the LoadContent method (reed, 2010)

What’s happening?  With Begin and End calls, the SpriteBatch object is telling (through XNA) the graphics device that it’s going to send it a sprite (or 2D image). The graphics device will receive large amounts of data throughout the XNA game, and the data will be in different formats and types. You have to let the graphics device know what kind of data is being sent. Thus, in order to call the spriteBatch.Draw method you must let the graphics card know the sprite data that is being sent, hence the texture, Vector2.Zero, and Color.White parameters that are passed to the method. (reed, 2010)

spriteBatch.Draw parameters ParameterTypeDescription TextureTexture2DThe Texture2D object that holds the image file you want to draw. PositionVector2The position (in 2D coordinates) at which you want to begin drawing the image. The image is always drawn starting from the upper-left corner. Color The tinting color. Specifying White will not tint the image, whereas specifying any other color will cause the image drawn to be tinted with that color (try it). (reed, 2010)

 Vector2.Zero is a simplified way of saying new Vector2(0,0) with 0 for X and Y coordinates (X,Y)  Vector2.Zero = new Vector2(0,0).  In 2D the X,Y coordinate set to 0,0 is the upper-left corner of the screen. Coordinates move in positive X to the right and positive Y downward.  Play with the coordinates to move the sprite/image. (reed, 2010)

Centering the Image  In order to center an image you must first find the center of the window and offset the upper-left corner coordinate appropriately. You can find the size by accessing the Window.ClientBounds property of the Game class. The Window.ClientBounds properties are always equal to the width and height of the window. Dividing this value by 2 will center the image. (reed, 2010)

Your screen should look like this….

spriteBatch.Draw parameters ParameterTypeDescription textureTexture2DThe texture to be drawn. PositionVector2The coordinate for the upper-left corner of the drawn image. SourceRectangleRectangleAllows you to draw only a portion of the source image. Use null for now. Color The tinting color. RotationFloatRotates the image. Use 0 for now. OriginVector2Indicates an origin around which to rotate. Use Vector2.Zero for now. ScaleFloatScales the image. Use 1f to draw the image the same size as the original image. For now use 1.5f (150% of image) EffectsSpriteEffectsUses the SpriteEffects enum to flip the image horizontally or vertically. LayerDepthFloatAllows you to specify which images are on top of other images. Use 0 for now. (reed, 2010 )

Let’s do it again!  Search the web for a transparent XNA game or open up PhotoShop and make your XNA logo transparent.  Save the file as: logo_transparent.png  Load your file to the image folder in your XNA game  Create a new variable of the Texture2D type named textureTransparent  Instantiate your new variable to the file path of your image.  Draw your new sprite beneath your texture sprite. (note: you only need one Begin and End for spriteBatch).  Change the clear method to draw a black screen.  Set spriteEffects to 0.

References  MSDN. (2012). Using Namespaces (C# Programming Guide). Retrieved on November 3, 2012 from us/library/dfb3cx8s.aspxhttp://msdn.microsoft.com/en- us/library/dfb3cx8s.aspx  Reed, Aaron (2010). Learning XNA 4.0. O’reilly Media, Inc.: ebook.