如何每秒编程帧数 [英] How do I program frames per second

问题描述

嘿，我是一年级学生，我想尝试使用html，javascript，css和php在我的网站上制作一个简单的2D游戏。我还在写我将如何做到这一点，但我仍然坚持每秒帧数是如何制作的，它们是否神奇地出现在我的游戏中，或者我是否需要自己编程。我之前写过一个简单版的口袋妖怪系列，你可以四处走动，随意遇到怪物，它们只是有不同的等级和属性。然而，角色每次点击走了16px，他不能分步走16px。这就是我想要的但是我无法理解它。

Hey I'm a first year student and I'd like to try making a simple 2D game on my website using html, javascript, css and php. I'm still writing out how I am going to do it but I get stuck on how frames per second are made, do they magically appear in my game or do I need to program them myself. I've wrote a simple version of the Pokemon franchise before, where you could walk around, randomly encounter monsters and they just had varying levels and properties. However the character walked 16px each click and he couldn't walk 16px, in steps. That's what I wanted but I couldn't get my finger on it.

现在我想找出类似的东西，一个走动的角色，收集东西，沿途做一些小任务。我希望这个角色能够顺利地走向NPC。

Now I'd like to work out something similar, a character that walks around, collects stuff and does little quests along the way. I'd like the character to walk smoothly and the NPC's as well.

我想知道如何让我的游戏60fps，每次按下60帧的按钮，每次在1秒钟内我想要我的角色来走一些像素，以32像素为例，但他必须在30帧，0.5秒内走另外32个像素。我该如何对此进行编码？

I'd like to know how I to make my game 60fps, and every time I press a button 60 frames go by, each in 1 second I want my character to walk a number of pixels, take as an example 32 pixels, but he has to walk al 32 of them in 30 frames, 0.5 seconds. How do I code this ?

我正在寻找一个非常特别的答案，你可能无法从上面的文字中找到我想要的内容，所以我将列出我不打算让答案更容易。

I'm looking for a very particular answer and you might not get what I'm looking for from the text above so I'll list down the answers I'm not looking for to make it easier.

我不寻找：

• 关于游戏编程位置的提示，例如统一。


• 大量代码行。


• 制作游戏的教程。


• 如何编制FPS计数器。

• Tips on where to programming a game, like in unity.
• Loads of code lines.
• Tutorials for making games.
• How to Program a FPS counter.

我正在寻找：

• 解释它是如何编码的，或者它是如何神奇地出现的。


• 作为一小段示例代码来理解它是如何完成的。


• 如果无法在网络应用程序中完成，请告诉我原因。


• 链接到有用的信息来源，可以帮助我理解FPS

• An explanation to how it's coded, or how it magically appears.
• As little lines of example code to understand how it's done that way.
• If it can't be done in web apps, tell me why.
• Links to helpful sources of information that could help me understand FPS

我已经尝试找到答案：

• 通过大量的Google搜索工作rms，我尝试了很多不同的搜索条件我应该使用但它要么发送给我关于如何编程FPS计数器或第一人称射击游戏的页面。


• 看看是否有问题堆栈溢出已经通过尝试一堆不同的搜索术语得到了答案。


• 试图了解他们是如何在Unity中完成的。

我不确定我没有使用正确的搜索术语，但我使用了很多涉及编码fps，每秒帧速率编程，编程游戏的核心，但我找不到它。如果您知道更好的方法来解决我的问题或了解更好的搜索条件，请告诉我。

I'm not sure wether I'm not using the right search terms, but I've used quite a bunch involving "Coding fps", "Frame rates per second programming", "programming the core of the game" but I couldn't find it. If you know a better way to address my problem or know better search terms please tell me that as well.

推荐答案

例如javascript，为了制作一个游戏，我会使用'绘制循环'。

For example in javascript, To make a game I would use a 'draw loop'.

例如，如果我有一个charachter，我想在每帧60左右移动1个像素帧一秒我会这样做：

For example if I have a charachter that I want to move 1 pixel to left every frame at 60 frames a second I would do this:

    var fps = 60; 
    var charX = //Whatever your charachters x position
    function moveChar(){
        charX++;
    };

    var loop = setInterval(moveChar,1000/fps);

显然，moveChara看起来非常不同。这段代码 - 如果你添加所有必要的部分，将以60 fps的速度移动一个精灵。你仍然需要一个图像（用JS或HTML动态添加）

Obviously the moveChara would look very different. This code - If you add in all the necessary pieces would move a sprite at 60 fps. You would still need to have a image (Either dynamically added with JS or with HTML)

这是为了vanilla JS和html。

This is for vanilla JS and html.

这篇关于如何每秒编程帧数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！