Nos partenaires et nous-mêmes utilisons différentes technologies, telles que les cookies, pour personnaliser les contenus et les publicités, proposer des fonctionnalités sur les réseaux sociaux et analyser le trafic. Merci de cliquer sur le bouton ci-dessous pour donner votre accord. Vous pouvez changer d’avis et modifier vos choix à tout moment. Informations RGPD
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/xhtml;charset=UTF-8"/> <title>PS Suite SDK: 1. Structure des Programmes</title> <link href="tabs.css" rel="stylesheet" type="text/css"/> <link href="search/search.css" rel="stylesheet" type="text/css"/> <script type="text/javascript" src="search/search.js"></script> <link href="navtree.css" rel="stylesheet" type="text/css"/> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="navtree.js"></script> <script type="text/javascript" src="resize.js"></script> <script type="text/javascript"> $(document).ready(initResizable); </script> <link href="doxygen.css" rel="stylesheet" type="text/css"/> </head> <body onload='searchBox.OnSelectItem(0);'> <div id="top"> <div id="titlearea"> <table cellspacing="0" cellpadding="0"> <tbody> <tr style="height: 40px;"> <td style="padding-left: 0.5em;"> <div id="projectname"><img src="image/title.png" alt="" width="289" height="40" /></div> </td> <td> <div id="MSearchBox" class="MSearchBoxInactive"> <span class="left"> <img id="MSearchSelect" src="search/mag_sel.png" onmouseover="return searchBox.OnSearchSelectShow()" onmouseout="return searchBox.OnSearchSelectHide()" alt=""/> <input type="text" id="MSearchField" value="Search" accesskey="S" onfocus="searchBox.OnSearchFieldFocus(true)" onblur="searchBox.OnSearchFieldFocus(false)" onkeyup="searchBox.OnSearchFieldChange(event)"/> </span><span class="right"> <a id="MSearchClose" href="javascript:searchBox.CloseResultsWindow()"><img id="MSearchCloseImg" border="0" src="search/close.png" alt=""/></a> </span> </div> </td> </tr> </tbody> </table> </div> <!-- Generated by Doxygen 1.7.3 --> <script type="text/javascript"><!-- var searchBox = new SearchBox("searchBox", "search",false,'Search'); --></script> </div> <div id="side-nav" class="ui-resizable side-nav-resizable"> <div id="nav-tree"> <div id="nav-tree-contents"> </div> </div> <div id="splitbar" style="-moz-user-select:none;" class="ui-resizable-handle"> </div> </div> <script type="text/javascript"> initNavTree('programing_guide01_en.html',''); </script> <div id="doc-content"> <div class="header"> <div class="headertitle"> <h1>1. Structure des programmes </h1> </div> </div> <div class="contents"> <div class="textblock"><p>En s'aidant de la création d'un jeux de tire en 2D, ce document explique les méchanismes basiques d'un jeux et la méthode de développement avec le PS suite Studio SDK.</p> <div class="contents topic" id="contents"> <p class="topic-title first">Contenu</p> <ul class="simple"> <li><a class="reference internal" href="#smallest-ps-suite-program" id="id1">Petit programme PS Suite</a></li> <li><a class="reference internal" href="#basic-framework-of-ps-suite-applications" id="id2">Structure Basique d'une application PS Suite</a></li> <li><a class="reference internal" href="#process-flow" id="id3">Déroulement des opérations</a><ul> <li><a class="reference internal" href="#double-buffer" id="id4">Double mémoire tampon</a></li> <li><a class="reference internal" href="#term-definitions" id="id5">Définitions des termes utilisés</a></li> </ul> </li> </ul> </div> <dl class="docutils"> <dt>Notez que ce document est écrit en tenant compte des personnes suivantes.</dt> <dd><dl class="first last docutils"> <dt><strong>Lecteurs cibles</strong></dt> <dd><ul class="first last simple"> <li>Ceux qui développent une application de jeu pour la première fois.</li> <li>Ceux qui possédent les spécifications basiques du C#.</li> </ul> </dd> </dl> </dd> </dl> <div class="section" id="smallest-ps-suite-program"> <h1><a class="toc-backref" href="#id1">Petit programme PS Suite</a></h1> <p>Premièrement, essayez d'éxecuter le petit programme PS Suite.</p> <p>Lancez PS Suite Studio et ouvrez le dossier "Sample/Tutorial" avec Fichier -> Ouvrir.. .</p> <blockquote> <p>Le dossier Sample/Tutorial est installé dans à l'endroit suivant, par défaut.</p> <blockquote> <ul class="simple"> <li>Windows XP: "C:/Documents and Settings/All Users/Documents/Pss/"</li> <li>Windows 7 : "C:/Users/Public/Documents/Pss/"</li> </ul> </blockquote> <p>sample/Tutorial/Sample01</p> <blockquote> <div class="figure"> <img alt="image/program_guide/explore.PNG" src="image/program_guide/explore.PNG" /> </div> </blockquote> </blockquote> <p>Les fichiers avec l'extension sln sont appelés solutions. Ils décrivent les structures des fichiers du project.</p> <p>Les fichiers avec l'extension csproj sont appelés fichiers de projet. Ils dévcrivent les structures du code source (fichiers cs) et la méthode de compilation.</p> <p>Le contenu du dossier Sample01 pour construire une application est appelé "Project".</p> <p>Note: S'il vous plaît soyez conscient que "le fichier de projet: csproj" et "Projet" ont des sens différents.</p> <blockquote> <div class="figure"> <img alt="image/program_guide/sln_csproj.PNG" src="image/program_guide/sln_csproj.PNG" style="width: 400px;" /> <p class="caption"><strong>Structure relationnel entre les fichiers Solutions et les fichiers Projets</strong></p> </div> </blockquote> <p>Un fichier de solution est le point de départ d'un projet; ouvrez ce fichier lorsque vous commencez le développement d'une application.</p> <p>Une fois que le fichier solution est ouvert, compiler et appuyez sur la touche F5 pour exécuter.</p> <blockquote> <div class="figure"> <img alt="image/program_guide/sample01.PNG" src="image/program_guide/sample01.PNG" style="width: 600px;" /> </div> </blockquote> <p>Félicitation! Toutefois, seul un écran noir s'affichera pour ce programme, rien d'autre ne va se passer. Cliquez sur le bouton X dans le coin supérieur droit de la fenêtre ou appuyez sur Maj + F5 dans PS Suite Studio pour quitter le programme.</p> <!-- //TODO: Explanation of the created exe file? --> <!-- //TODO: Tutorial for file structure here --> <!-- //TODO: Console.WriteLine explanation. Where will it be output? --> </div> <div class="section" id="basic-framework-of-ps-suite-applications"> <h1><a class="toc-backref" href="#id2">Structure basique d'une application PS Suite</a></h1> <p>Tout d'abord, regardez le code source. Pour regarder le code source, double-cliquez sur AppMain.cs dans "Solution Explorer" sur le côté gauche.</p> <blockquote> <div class="highlight"><pre><span class="k">public</span> <span class="k">class</span> <span class="nc">AppMain</span> <span class="p">{</span> <span class="k">static</span> <span class="k">protected</span> <span class="n">GraphicsContext</span> <span class="n">graphics</span><span class="p">;</span> <span class="k">public</span> <span class="k">static</span> <span class="k">void</span> <span class="nf">Main</span> <span class="p">(</span><span class="kt">string</span><span class="p">[]</span> <span class="n">args</span><span class="p">)</span> <span class="p">{</span> <span class="n">Initialize</span> <span class="p">();</span> <span class="k">while</span> <span class="p">(</span><span class="k">true</span><span class="p">)</span> <span class="p">{</span> <span class="n">SystemEvents</span><span class="p">.</span><span class="n">CheckEvents</span><span class="p">();</span> <span class="n">Update</span> <span class="p">();</span> <span class="n">Render</span> <span class="p">();</span> <span class="p">}</span> <span class="p">}</span> <span class="k">public</span> <span class="k">static</span> <span class="k">void</span> <span class="nf">Initialize</span> <span class="p">()</span> <span class="p">{</span> <span class="n">graphics</span> <span class="p">=</span> <span class="k">new</span> <span class="n">GraphicsContext</span><span class="p">();</span> <span class="p">}</span> <span class="k">public</span> <span class="k">static</span> <span class="k">void</span> <span class="nf">Update</span> <span class="p">()</span> <span class="p">{</span> <span class="p">}</span> <span class="k">public</span> <span class="k">static</span> <span class="k">void</span> <span class="nf">Render</span> <span class="p">()</span> <span class="p">{</span> <span class="n">graphics</span><span class="p">.</span><span class="n">Clear</span><span class="p">();</span> <span class="n">graphics</span><span class="p">.</span><span class="n">SwapBuffers</span><span class="p">();</span> <span class="p">}</span> <span class="p">}</span> </pre></div> <!-- end-of-code-block --> </blockquote> <p>Ici, notez Main(), Initialize(), SystemEvents.CheckEvents(), Update(), Render(), et SwapBuffers().</p> <p><strong>Main()</strong></p> <ul class="simple"> <li>Un programme commence par Main(). Toutes les applications recquiert une fonction Main(). Si il y en a deux ou plus, une erreur de compilation se produira.</li> </ul> <p><strong>Initialize()</strong></p> <ul class="simple"> <li>Le contenu de la fonction Initialize() décrit essentiellement le traitement d'initialisation. Ce traitement est effectué une seule fois lors du démarrage dans cette structure de programme.</li> </ul> <p><strong>while</strong></p> <ul> <li><p class="first">Ensuite, on entre dans une boucle avec "while". En d'autres mots, les processus SystemEvents.CheckEvents(), Update(), et Render() sont répétés à l'intérieur de cette boucle.</p> <blockquote> <p><strong>SystemEvents.CheckEvents()</strong></p> <ul class="simple"> <li>Les événements dépendants l'OS seront vérifiés avec SystemEvents.CheckEvents(). Un appareil sous android, par exemple, detectera un événement quand une application sera réduite. Dans Windows le traitement des messages en fenêtre sera détécté ici, etc.</li> </ul> <p><strong>Update()</strong></p> <ul class="simple"> <li>Le traitement de calcul, etc. Traités par le CPU est principalement décrit dans Update().</li> </ul> <p><strong>Render()</strong></p> <ul class="simple"> <li>Le traitement de rendu et le traitement de calcul, etc. Traités par le GPU est principalement décrit dans Render(). Dans Render(), les frame buffers (mémoires d'écran) sont d'abord effacé avec graphics.Clear().</li> </ul> <p><strong>SwapBuffers()</strong></p> <ul class="simple"> <li>Les frame buffers (mémoires d'écran) sont commutées avec le cadencement de synchronisation verticale à l'aide SwapBuffers ().</li> </ul> </blockquote> </li> </ul> <p>"Les frame buffers (mémoires d'écran) qui sont commutées avec le cadencement de synchronisation verticale" (décrit ci-dessus) seront expliqué plus en détail ici.</p> <p>Pour faciliter la compréhension du fonctionnement du programme, nous allons changer le programme comme suit. <-sections à ajouter.</p> <blockquote> <div class="highlight"><pre><span class="k">public</span> <span class="k">class</span> <span class="nc">AppMain</span> <span class="p">{</span> <span class="k">static</span> <span class="k">protected</span> <span class="n">GraphicsContext</span> <span class="n">graphics</span><span class="p">;</span> <span class="k">static</span> <span class="kt">int</span> <span class="n">colorValue</span><span class="p">=</span><span class="m">0</span><span class="p">;</span> <span class="c1">//<- here.</span> <span class="k">public</span> <span class="k">static</span> <span class="k">void</span> <span class="nf">Main</span> <span class="p">(</span><span class="kt">string</span><span class="p">[]</span> <span class="n">args</span><span class="p">)</span> <span class="p">{</span> <span class="n">Initialize</span> <span class="p">();</span> <span class="k">while</span> <span class="p">(</span><span class="k">true</span><span class="p">)</span> <span class="p">{</span> <span class="n">SystemEvents</span><span class="p">.</span><span class="n">CheckEvents</span> <span class="p">();</span> <span class="n">Update</span> <span class="p">();</span> <span class="n">Render</span> <span class="p">();</span> <span class="p">}</span> <span class="p">}</span> <span class="k">public</span> <span class="k">static</span> <span class="k">void</span> <span class="nf">Initialize</span> <span class="p">()</span> <span class="p">{</span> <span class="n">graphics</span> <span class="p">=</span> <span class="k">new</span> <span class="n">GraphicsContext</span><span class="p">();</span> <span class="p">}</span> <span class="k">public</span> <span class="k">static</span> <span class="k">void</span> <span class="nf">Update</span> <span class="p">()</span> <span class="p">{</span> <span class="n">colorValue</span><span class="p">++;</span> <span class="c1">//<- here.</span> <span class="k">if</span><span class="p">(</span><span class="n">colorValue</span><span class="p">></span><span class="m">255</span><span class="p">)</span> <span class="c1">//<- here.</span> <span class="n">colorValue</span><span class="p">=</span><span class="m">0</span><span class="p">;</span> <span class="c1">//<- here.</span> <span class="n">graphics</span><span class="p">.</span><span class="n">SetClearColor</span><span class="p">(</span><span class="n">colorValue</span><span class="p">,</span> <span class="n">colorValue</span><span class="p">,</span> <span class="n">colorValue</span><span class="p">,</span> <span class="m">255</span><span class="p">);</span><span class="c1">//<- here.</span> <span class="p">}</span> <span class="k">public</span> <span class="k">static</span> <span class="k">void</span> <span class="nf">Render</span> <span class="p">()</span> <span class="p">{</span> <span class="n">graphics</span><span class="p">.</span><span class="n">Clear</span><span class="p">();</span> <span class="n">graphics</span><span class="p">.</span><span class="n">SwapBuffers</span><span class="p">();</span> <span class="p">}</span> <span class="p">}</span> </pre></div> <!-- end-of-code-block --> </blockquote> <p>Lorsque ce programme est exécuté, la couleur de fond d'écran devient de plus en plus blanc, puis passe à nouveau au noir.</p> <blockquote> <div class="figure"> <img alt="image/program_guide/sample01_02.PNG" src="image/program_guide/sample01_02.PNG" style="width: 600px;" /> </div> </blockquote> <p>graphics.SetClearColor(int r, int g, int b, int a) efface l'écran avec les couleurs entrées en argument.</p> <p>r=255, g=255, b=255 correspond au blanc.</p> <p>"a" est appelé cannal alpha et indique le niveau de transparence. La valeur 0 correspond à totalement transparent, et 255 complétement opaque.</p> <p>Donc vous pouvez voir que colorValue++; est traité encore et encore.</p> <p>Sur le simulateur sur PC, cette valeur est mise à jour 60 fois à la seconde, en d'autres mots elle est mise à jour toutes les 16.6 millisecondes.</p> </div> <div class="section" id="process-flow"> <h1><a class="toc-backref" href="#id3">Déroulement des opérations</a></h1> <div class="section" id="double-buffer"> <h2><a class="toc-backref" href="#id4">Double mémoire tampon</a></h2> <p>Le schéma suivant illustre le déroulement des opérations.</p> <img alt="./image/program_guide/SwapBuffers.BMP" src="./image/program_guide/SwapBuffers.BMP" /> <p>La zone de (mémoire vidéo) affichée sur l'écran est appelée un <strong>frame buffer</strong>.</p> <p>En général, les applications de jeux ont deux zones d'images qui sont affichées sur l'écran. C'est appelé un double buffer (double mémoire tampon).</p> <p>Les flux de rendu utilisent le mode opératoire suivant.</p> <blockquote> <ol class="arabic simple"> <li>Tout d'abord la zone arrière(back) sera effacée avec r=1, g=1, b=1 (le schéma précédent a été ajusté en blanc pour être facilement compréhensible).</li> <li>On attend pendant 16 millisecondes après que se soit terminé le rendu.</li> <li>Quand 16 millisecondes se sont écoulées, la zone effacée avec r=1, g=1, b=1 est déplacée vers l'avant (front)..</li> <li>Maintenant, la zone arrière devra être effacée par r=2, g=2, b=2.</li> <li>Après, on attend 16 millisecondes que le rendu se termine.</li> <li>Quand 16 millisecondes se sont écoulées, la zone effacée avec r=2, g=2, b=2 est déplacée vers l'avant (front).</li> </ol> </blockquote> <p>Le programme s'exécute tant que ce traitement se répète.</p> <p>La commutation des zones et l'affichage évite un écran brouillé au milieu du rendu.</p> <p>Adapter la synchronisation de l'écran et commuter au moment où l'affichage est rafraîchi est appelé "En attente de (d'adaptation) synchronisation verticale de l'écran".</p> <p>Parce que le rythme auquel l'affichage est rafraîchi est d'environ 16,6 millisecondes (Note 1), le moment auquel le frame buffer (mémoire écran) est commuté est adapté à cette valeur.</p> <p>L'emplacement de cette série de traitement est SwapBuffers ().</p> <p>La fenêtre affichée en attendant la fonction SwapBuffers() pour basculer d'affichage s'appelle <strong>une frame</strong>.</p> <p>"FPS" (Frames Par Secondes) est utilisé comme unité pour indiquer le nombre de rafraichissement de la Frame par seconde. Quand la Frame est rafraichit 60 fois par seconde, on l'écrit 60fps.</p> <p>(Note 1) Notez que sur certains appareils Android, le taux n'est pas de 60fps.</p> </div> <div class="section" id="term-definitions"> <h2><a class="toc-backref" href="#id5">Définitons des termes utilisés</a></h2> <p>Puisque des termes similaires sont apparus, nous allons vous expliquer les termes afin d'éviter toute confusion.</p> <ul class="simple"> <li>"Ecran" se réfère à un dispositif matériel (hardware) d'affichage.</li> <li>"Afficher" se réfère à un écran du logiciel.</li> <li>"Frame buffer" se réfère à la zone alloué à la mémoire vidéo pour l'affichage.</li> </ul> <p>Le traitement et les termes expliqués dans ce chapitre apparaissent également dans les chapitres suivants, alors assurez-vous de les mémoriser.</p> <!-- //TODO:What is rendering? Explanation --> </div> </div> </div></div> </div> <div id="nav-path" class="navpath"> <ul> <!--- window showing the filter options --> <div id="MSearchSelectWindow" onmouseover="return searchBox.OnSearchSelectShow()" onmouseout="return searchBox.OnSearchSelectHide()" onkeydown="return searchBox.OnSearchSelectKey(event)"> <a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(0)"><span class="SelectionMark"> </span>All</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(1)"><span class="SelectionMark"> </span>Classes</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(2)"><span class="SelectionMark"> </span>Namespaces</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(3)"><span class="SelectionMark"> </span>Functions</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(4)"><span class="SelectionMark"> </span>Variables</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(5)"><span class="SelectionMark"> </span>Enumerations</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(6)"><span class="SelectionMark"> </span>Properties</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(7)"><span class="SelectionMark"> </span>Events</a></div> <!-- iframe showing the search results (closed by default) --> <div id="MSearchResultsWindow"> <iframe src="" frameborder="0" name="MSearchResults" id="MSearchResults"> </iframe> </div> <!--<div id="footer">--> <div style='text-align : right'> ©2012 Sony Computer Entertainment Inc. All Rights Reserved. SCE CONFIDENTIAL <br> </div> </body> </html>