进度条 - 百分比之间的平滑过渡

Question

我正在尝试编写自己的进度条，我已经开始工作了。每次百分比值更改时，条形也会发生变化，以便条形图显示正确的进度。

现在我的问题是，该栏总是（当然）跳到下一个状态，并且它之间没有平滑过渡。现在我的问题是，如何在各阶段之间平稳过渡？

信息： 我知道游戏的fpscount和栏的位置+比例。我用java编程（我认为这些信息是不必要的：P）

Answer 1

一般答案，而非特定语言。

不是直接设置宽度，而是可以将每个帧的宽度增加到所需的宽度/百分比。

假设您使用函数bar.setWidth(val)来设置进度条的宽度。

让这成为您的更新循环（在60FPS运行）：

update {
   ...
   ...

   double percentageLoaded; // this is your parameter probably

   static const int incrementStep = 1; // increase this for faster animation

   // Get the width of the bar for the current percentage   
   int desiredWidth = percentageLoaded * bar.totalWidth;


   if(bar.currentWidth < desiredWidth) {
      bar.currentWidth += incrementStep;
   }
}

如果您的incrementStep大于1，还有一些事情需要检查。（例如：不要将条形宽度设置为大于100％）

这是一张小图，也许它可以帮助您更好地理解。在此示例中，增量步骤为1px，条形宽度为4px，加载设置为50%完成，这意味着您的条形宽度应为2px 。