Tipy a trikypro vývoj her v XNATomáš SlavíčekMVP XNA/DirectX, MS Student Partner   @tomasslavicek     http://tomasslavicek...
Agenda• rychlejší načítání textur• vykreslování ze SpriteSheetů• renderování do textury• 3D snadno a rychle• kamery• „vekt...
Rychlé opakování XNA• herní smyčka, Content Pipeline,  SpriteBatch, SpriteFont…
XNA – situace •   desktop PC        •   Windows 8 / RT •   Xbox 360          •   Windows Phone 8 •   Windows Phone 7   •  ...
Zdroje o XNA• rozcestník na SmartMania.cz  http://bit.ly/xna_smartmania
Další literatura•   XNA 3.0 Game Programming Recipes, Riemer    Grootjans    http://amzn.to/T9rUn8•   3D Graphics with XNA...
1/3Rychlejší načítání textur• pomocí Content Pipeline   • převod do .xnb   • bez komprese, pokud není velikost ^2     = vě...
2/3Příklad: načítání textur• 50 kB PNG obrázek, 800x480 px     • převedeno Content Pipeline: 1.5 MB• 6 obrázků, na Windows...
3/3Rychlejší načítání textur• BuildAction: none, Copy: if newer• pomocná komponenta Operations  • premultiplied alpha!Text...
1/3Tiled grafika• jeden obrázek = SpriteSheet• hra se skládá z výřezů   • proč?
2/3Tiled grafika• jeden obrázek = SpriteSheet• hra se skládá z výřezů   • optimalizace rychlosti vykreslování
3/3Tiled grafika• Tiled editor       mapeditor.org• SpriteSheet packer  spritesheetpacker.codeplex.com
1/2Vykreslování do textury• příklady:  • generování grafiky za běhu  • vlastní SpriteSheet packer?   • WP7: vykreslení Li...
2/2Vykreslování do textury• XNA 4.0: RenderTarget2D ≅ Texture2D  • lze přesměrovat vykreslováníRenderTarget2D texture =   ...
1/2Zrcadlové převrácení• jak vykreslit celou hru zrcadlově  převráceně?• např. podpora psaní zprava doleva  v aplikaci na ...
2/2Zrcadlové převrácení• odpověď:  • vykreslit vše do jiné textury  • předat parametr SpriteEffects.FlipHorizontallysprite...
Zakázání vyhlazování• nastavení spriteBatch.Begin()  • parametr SamplerState.PointClampspriteBatch.Begin(SpriteSortMode.Fr...
Intermezzo: otázky?• než se přesuneme ke 3D
Od 2D ke 3D              x       yy                         x                  z
3D grafika• objekty jsou ve světových souřadnicích  •   = náš virtuální svět  •   díváme se na něj kamerou
Typy kamer• podle pohledu:  • shora, našikmo, zboku, izometrická…  • FPS střílečka, strategie…• podle projekce:  • perspek...
1/2Vlastnosti kamer• pozice, směr pohledu, orientace nahoru…• blízká a vzdálená ořezová rovinazdroj: http://db-in.com/blog...
2/2Vlastnosti kamer• view matrix, projection matrixzdroj: http://robertokoci.com/world-view-projection-matrix-unveiled/
Vlastnosti každého objektu• pozice, otočení, zkosení…• -> world matrixfinal = world * view * projectionworld = scale * she...
1/3Ukázka: jednoduchá kamera• obecný interface ICamerainterface ICamera{    Matrix ViewMatrix { get; }    Matrix Projectio...
2/3Ukázka: jednoduchá kamera• nastavení pohleduviewMatrix = Matrix.CreateLookAt(position,      position + targetDirection,...
3/3Ukázka: jednoduchá kamera• viewMatrix = směr  • nastavit na začátku  • vždy při změně pozice/směru• projectionMatrix = ...
Ukázka: objekt pro modely• načtení modelu: Content Pipeline• parametry:  • pozice, otočení…  world matrix  • osvětlení, p...
1/2Screen2DCamera• skládání geometrie z vertexů a indexů• 3D kamera jakoby „2D“
2/2Screen2DCamera• osa X, Y odpovídá X, Y na obrazovce• osa Z = hloubka (který objekt je před / za)viewMatrix = Matrix.Ide...
1/2„Vektorové kreslení“• můžeme objekt poskládat z trojúhelníků• vertexy, indexy
2/2„Vektorové kreslení“• typy:  • VertexPositionColor  • VertexPositionNormalTexture …• vykreslování:  • DrawPrimitives  •...
Další CZ zdroje ke 3D•   Seriál na CzechGamer.com, projít si přiložené soubory    http://bit.ly/V5iJ7x•   Skládání transfo...
Ukázka: 3D engine
Další akce - seminář• Vývoj her pro Win8 a WP7,  multiplayer pomocí Windows Azure  10. prosince 2012, T. Slavíček, T. Herc...
Děkuji za pozornost!Tomáš SlavíčekMVP XNA/DirectX, MS Student Partner   @tomasslavicek     http://tomasslavicek.cz
Upcoming SlideShare
Loading in …5
×

Tipy a triky pro vývoj her v XNA (MS Fest)

1,181 views

Published on

Prezentace k přednášce, která se konala v neděli 2.12. na konferenci MS Fest 2012. Téma: zajímavé tipy pro 2D grafiku, úvod do 3D grafiky.

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

  • Be the first to like this

No Downloads
Views
Total views
1,181
On SlideShare
0
From Embeds
0
Number of Embeds
440
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Tipy a triky pro vývoj her v XNA (MS Fest)

  1. 1. Tipy a trikypro vývoj her v XNATomáš SlavíčekMVP XNA/DirectX, MS Student Partner @tomasslavicek http://tomasslavicek.cz
  2. 2. Agenda• rychlejší načítání textur• vykreslování ze SpriteSheetů• renderování do textury• 3D snadno a rychle• kamery• „vektorové“ kreslení• struktura herního engine
  3. 3. Rychlé opakování XNA• herní smyčka, Content Pipeline, SpriteBatch, SpriteFont…
  4. 4. XNA – situace • desktop PC • Windows 8 / RT • Xbox 360 • Windows Phone 8 • Windows Phone 7 • PS Vita • přehrávače Zune • Android • iOS, Mac… • Linux…
  5. 5. Zdroje o XNA• rozcestník na SmartMania.cz http://bit.ly/xna_smartmania
  6. 6. Další literatura• XNA 3.0 Game Programming Recipes, Riemer Grootjans http://amzn.to/T9rUn8• 3D Graphics with XNA Game Studio 4.0, Sean James http://amzn.to/QDw8Ir• Moderní počítačová grafika, Jiří Žára a kol. http://bit.ly/modernigrafika
  7. 7. 1/3Rychlejší načítání textur• pomocí Content Pipeline • převod do .xnb • bez komprese, pokud není velikost ^2 = větší velikost, delší načítání• nebo přes Stream • obrázky přímo kopírovány do /bin
  8. 8. 2/3Příklad: načítání textur• 50 kB PNG obrázek, 800x480 px • převedeno Content Pipeline: 1.5 MB• 6 obrázků, na Windows Phone: • pomocí Content Pipeline: 3000 ms! • přes Stream: 550 ms • velikost ^2, s Dxt kompresí: 450 mszdroj: http://jakepoz.com/jake_poznanski__speeding_up_xna.html
  9. 9. 3/3Rychlejší načítání textur• BuildAction: none, Copy: if newer• pomocná komponenta Operations • premultiplied alpha!Texture2D file = null;using (Stream s = TitleContainer.OpenStream(fileName)){ file = Texture2D.FromStream(device, s);}
  10. 10. 1/3Tiled grafika• jeden obrázek = SpriteSheet• hra se skládá z výřezů • proč?
  11. 11. 2/3Tiled grafika• jeden obrázek = SpriteSheet• hra se skládá z výřezů • optimalizace rychlosti vykreslování
  12. 12. 3/3Tiled grafika• Tiled editor mapeditor.org• SpriteSheet packer spritesheetpacker.codeplex.com
  13. 13. 1/2Vykreslování do textury• příklady: • generování grafiky za běhu • vlastní SpriteSheet packer?  • WP7: vykreslení Live tile, uložení screenshotu…
  14. 14. 2/2Vykreslování do textury• XNA 4.0: RenderTarget2D ≅ Texture2D • lze přesměrovat vykreslováníRenderTarget2D texture = new RenderTarget2D(device, size.X, size.Y);device.SetRenderTarget(texture);device.Clear(Color.White);spriteBatch.Begin();spriteBatch.End();device.SetRenderTarget(null);return texture;
  15. 15. 1/2Zrcadlové převrácení• jak vykreslit celou hru zrcadlově převráceně?• např. podpora psaní zprava doleva v aplikaci na zápisky
  16. 16. 2/2Zrcadlové převrácení• odpověď: • vykreslit vše do jiné textury • předat parametr SpriteEffects.FlipHorizontallyspriteBatch.Draw(texture, rectangle, null, Color.White, 0f, Vector2.Zero, SpriteEffects.FlipHorizontally, 0f);
  17. 17. Zakázání vyhlazování• nastavení spriteBatch.Begin() • parametr SamplerState.PointClampspriteBatch.Begin(SpriteSortMode.FrontToBack, BlendState.AlphaBlend, SamplerState.PointClamp, null, null);
  18. 18. Intermezzo: otázky?• než se přesuneme ke 3D
  19. 19. Od 2D ke 3D x yy x z
  20. 20. 3D grafika• objekty jsou ve světových souřadnicích • = náš virtuální svět • díváme se na něj kamerou
  21. 21. Typy kamer• podle pohledu: • shora, našikmo, zboku, izometrická… • FPS střílečka, strategie…• podle projekce: • perspektivní, ortografická
  22. 22. 1/2Vlastnosti kamer• pozice, směr pohledu, orientace nahoru…• blízká a vzdálená ořezová rovinazdroj: http://db-in.com/blog/2011/04/cameras-on-opengl-es-2-x
  23. 23. 2/2Vlastnosti kamer• view matrix, projection matrixzdroj: http://robertokoci.com/world-view-projection-matrix-unveiled/
  24. 24. Vlastnosti každého objektu• pozice, otočení, zkosení…• -> world matrixfinal = world * view * projectionworld = scale * shear * rotation * translation násobení matic
  25. 25. 1/3Ukázka: jednoduchá kamera• obecný interface ICamerainterface ICamera{ Matrix ViewMatrix { get; } Matrix ProjectionMatrix { get; } void Initialize(); void ChangeOrientation(DisplayOrientation orient);}
  26. 26. 2/3Ukázka: jednoduchá kamera• nastavení pohleduviewMatrix = Matrix.CreateLookAt(position, position + targetDirection, upVector);• nastavení projekceprojectionMatrix = Matrix.CreatePerspectiveFieldOfView( MathHelper.PiOver4, device.Viewport.AspectRatio, nearPlaneDistance, farPlaneDistance);
  27. 27. 3/3Ukázka: jednoduchá kamera• viewMatrix = směr • nastavit na začátku • vždy při změně pozice/směru• projectionMatrix = zkreslení • na začátku • při změně orientace displeje / pohledu
  28. 28. Ukázka: objekt pro modely• načtení modelu: Content Pipeline• parametry: • pozice, otočení…  world matrix • osvětlení, průhlednost vržený stín… • bounding sphere / box • ID…
  29. 29. 1/2Screen2DCamera• skládání geometrie z vertexů a indexů• 3D kamera jakoby „2D“
  30. 30. 2/2Screen2DCamera• osa X, Y odpovídá X, Y na obrazovce• osa Z = hloubka (který objekt je před / za)viewMatrix = Matrix.Identity;projectionMatrix = Matrix.CreateOrthographicOffCenter( 0.5f, (float)width - 0.5f, (float)height - 0.5f, 0.5f, -1000f, 1000f);
  31. 31. 1/2„Vektorové kreslení“• můžeme objekt poskládat z trojúhelníků• vertexy, indexy
  32. 32. 2/2„Vektorové kreslení“• typy: • VertexPositionColor • VertexPositionNormalTexture …• vykreslování: • DrawPrimitives • DrawIndexedPrimitives • DrawUserIndexedPrimitives …
  33. 33. Další CZ zdroje ke 3D• Seriál na CzechGamer.com, projít si přiložené soubory http://bit.ly/V5iJ7x• Skládání transformací – záznam semináře http://youtu.be/KfGF5-7vydU• Moje bakalářka – 3D engine http://bit.ly/Svv5Hi• Seriál na vbnet.cz (T. Herceg) http://www.vbnet.cz/kategorie--16.aspx
  34. 34. Ukázka: 3D engine
  35. 35. Další akce - seminář• Vývoj her pro Win8 a WP7, multiplayer pomocí Windows Azure 10. prosince 2012, T. Slavíček, T. Herceg http://gds2012.ceske-hry.cz/
  36. 36. Děkuji za pozornost!Tomáš SlavíčekMVP XNA/DirectX, MS Student Partner @tomasslavicek http://tomasslavicek.cz

×