{"id":137,"date":"2024-06-07T08:59:51","date_gmt":"2024-06-07T11:59:51","guid":{"rendered":"http:\/\/pplay.local\/?page_id=137"},"modified":"2024-06-19T13:15:21","modified_gmt":"2024-06-19T16:15:21","slug":"fazendo-controle-de-fps","status":"publish","type":"page","link":"http:\/\/www2.ic.uff.br\/pplay\/tutoriais\/fazendo-controle-de-fps\/","title":{"rendered":"Fazendo Controle de FPS"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Introdu\u00e7\u00e3o: Frames por Segundo<\/h2>\n\n\n\n<p>Voc\u00ea deve ter percebido no \u00faltimo exemplo que ao pressionar uma tecla eram impressas diversas mensagens \u201cao mesmo tempo\u201d.<\/p>\n\n\n\n<p>Isso ocorre por causa do&nbsp;<em>loop<\/em>&nbsp;infinito. A gente chama cada&nbsp;<em>loop<\/em>&nbsp;completo de 1 frame. Quanto mais r\u00e1pido \u00e9 um processador, mais frames por segundo ser\u00e3o gerados.<\/p>\n\n\n\n<p>Fica evidente um problema: se formos mover um\u00a0<strong><a href=\"http:\/\/www2.ic.uff.br\/pplay\/documentacao\/sprite\" data-type=\"page\" data-id=\"119\">Sprite<\/a><\/strong>\u00a0a 0.1 pixels\/frame, como fizemos no exemplo anterior, em um computador mais r\u00e1pido ele vai SE MOVER mais r\u00e1pido<\/p>\n\n\n\n<p>Para solucionar esse problema, temos o Controle de FPS que vai garantir que um jogo rode na \u201cmesma velocidade\u201d em diferentes m\u00e1quinas, pois vai estar em fun\u00e7\u00e3o do TEMPO e n\u00e3o de FRAMES.<\/p>\n\n\n\n<p>Isso vai ficar mais claro no exemplo abaixo. Vamos mostrar com e sem o controle de FPS.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Controlando FPS com delta_time()<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code># Como sempre, importamos nossa janela\nfrom PPlay.window import *\n# E agora o Sprite\nfrom PPlay.sprite import *\n\njanela = Window(500, 500)\nkobra = Sprite(\"kobra.png\")\n\nspeed_per_FRAME = 60\nspeed_per_SECOND = 60\n\nwhile True:\n    janela.set_background_color((255, 255, 255))\n\n    # Ir\u00e1 se mover 60 pixels a cada FRAME - sumir\u00e1 da tela instantaneamente\n    kobra.move_x(speed_per_FRAME)\n    # Ir\u00e1 se mover 60 pixels a cada SEGUNDO - independente do processador\n    # kobra.move_x(speed_per_SECOND * janela.delta_time())\n\n    kobra.draw()\n    janela.update()\n<\/code><\/pre>\n\n\n\n<p>Se voc\u00ea rodar esse c\u00f3digo, a kobra vai sair da tela em milissegundos. Isso pois o intervalo entre cada frame \u00e9 MUITO baixo!<\/p>\n\n\n\n<p>N\u00f3s temos ent\u00e3o a fun\u00e7\u00e3o janela.delta_time() que retorna em segundos esse intervalo.<\/p>\n\n\n\n<p>Ao multiplicar a speed_per_SECOND por esse delta_time(), n\u00f3s podemos ver que n\u00e3o importa o intervalo (ou seja, um computador mais r\u00e1pido ou mais lento), mas o\u00a0<strong><a href=\"http:\/\/www2.ic.uff.br\/pplay\/documentacao\/sprite\" data-type=\"page\" data-id=\"119\">Sprite<\/a><\/strong>\u00a0vai se mover em rela\u00e7\u00e3o ao tempo (mesmo que seja menos suave).<\/p>\n\n\n\n<p>\u00c9 evidente que quanto mais frames por segundo, mais suave ser\u00e1 o movimento. Observe a tabela abaixo:<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table><tbody><tr><th>delta_time<\/th><th>FPS (1\/delta_time)<\/th><th>speed (100 * delta_time) \u2013 em Pixels\/Frame<\/th><th>Total (speed * FPS) \u2013 em Pixels\/Segundo<\/th><\/tr><tr><td>2.000 s<\/td><td>0.500<\/td><td>200<\/td><td>100<\/td><\/tr><tr><td>1.000 s<\/td><td>1.000<\/td><td>100<\/td><td>100<\/td><\/tr><tr><td>0.100 s<\/td><td>10.00<\/td><td>10<\/td><td>100<\/td><\/tr><tr><td>0.010 s<\/td><td>100.0<\/td><td>1<\/td><td>100<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p>Observe que apesar de a primeira linha ter apenas 1 frame a cada 2 segundos, o movimento do Sprite \u00e9 compensado se movendo muito mais que o outro com 100 FPS. A diferen\u00e7a \u00e9 que quanto menos frames, menos suave \u00e9 o movimento.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p><a href=\"http:\/\/www2.ic.uff.br\/downloads\/tutoriais\/4.0_Controle_de_FPS.rar\"><\/a><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-vivid-red-color\">Download do C\u00f3digo Completo<\/mark><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p><strong>Cr\u00e9ditos do Tutorial<\/strong>: Gabriel Saldanha<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Introdu\u00e7\u00e3o: Frames por Segundo Voc\u00ea deve ter percebido no \u00faltimo exemplo que ao pressionar uma tecla eram impressas diversas mensagens \u201cao mesmo tempo\u201d. Isso ocorre por causa do&nbsp;loop&nbsp;infinito. A gente chama cada&nbsp;loop&nbsp;completo de 1 frame. Quanto mais r\u00e1pido \u00e9 um processador, mais frames por segundo ser\u00e3o gerados. Fica evidente um problema: se formos mover um\u00a0Sprite\u00a0a [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":57,"menu_order":5,"comment_status":"closed","ping_status":"closed","template":"tutorial-template.php","meta":{"footnotes":""},"_links":{"self":[{"href":"http:\/\/www2.ic.uff.br\/pplay\/wp-json\/wp\/v2\/pages\/137"}],"collection":[{"href":"http:\/\/www2.ic.uff.br\/pplay\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/www2.ic.uff.br\/pplay\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/www2.ic.uff.br\/pplay\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www2.ic.uff.br\/pplay\/wp-json\/wp\/v2\/comments?post=137"}],"version-history":[{"count":3,"href":"http:\/\/www2.ic.uff.br\/pplay\/wp-json\/wp\/v2\/pages\/137\/revisions"}],"predecessor-version":[{"id":482,"href":"http:\/\/www2.ic.uff.br\/pplay\/wp-json\/wp\/v2\/pages\/137\/revisions\/482"}],"up":[{"embeddable":true,"href":"http:\/\/www2.ic.uff.br\/pplay\/wp-json\/wp\/v2\/pages\/57"}],"wp:attachment":[{"href":"http:\/\/www2.ic.uff.br\/pplay\/wp-json\/wp\/v2\/media?parent=137"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}