可以使用滑块而不是颜色来滑动图像吗？ p5.j s

Question

我是编程新手，正在尝试在p5.js中编写草图，我想使用滑块来滑动图像以制作“服装选择器”，但我正努力使滑块在图像中滑动，我只能查找可以通过颜色滑动的示例。这是使用滑块的唯一方法吗？有没有更好的方法来创建草图呢？

谢谢

Answer 1

这是一个冗长的问题，有很多答案，需要做很多工作才能得出答案，但是我将尽力解释如何做。滑块使用范围来工作，因此，如果滑块一直在最左侧，则为0，在最右侧一直是最大值，因此在此示例中。因此，这意味着滑块路径中的任何一点都有相应的百分比或数字。因此，这意味着如果您想做一个服装选择器，那么当它沿着滑块移动时，只需创建括号即可。因此，如果滑块位于1，则装备1，两个装备2，依此类推。为此，您将需要使用数组。像这样的东西。

此外，如果您忘记了滑块https://p5js.org/reference/#/p5/createSlider的语法，请在createSlider（）上查看此链接，>

//this will be somewhere in setup or such
outfitSlider = createSlider(0,10,50,0);

//A function to be called by DRAW
function outfitCheck() {
  i = outfitSlider.value();
  outfit = outfits[i];
}
现在您可以将outfitCheck()由放置在滑块上的观察者调用，也可以直接在draw函数中调用它。这基于将服装安排在阵列中的想法。哪个yo0u可以解决其他地方的问题或观看数组教程。这是一个很好的StackOverflow，因为我看到您提到图像Creating an array of image objects

您还可以在数组内部拥有不同的参数，不仅是src，还有样式或类或id，可以使用CSS或使用P5 dom对其进行一些样式设置。但是由于有很多不同的图片，您或多或少将不得不全部硬编码。但是使用for循环可能会有所帮助。希望这能回答您的问题。或多或少轮流或做出更好的选择，这都取决于您的实际程序及其上下文，因为那里有很多选择。