在ProcessingJS中加載一個充滿圖像的文件夾

Question

我目前在一個項目中，需要加載一個充滿圖像的文件夾。

下面的代碼段可以在Java模式下完美運行，但是無法在JS模式下渲染圖像。 我已經嘗試了很長時間才能使它正常工作，我想知道為什么下面的此片段不起作用，以及是否還有其他方法可以在不知道文件名的情況下加載包含圖像的文件夾。

void setup()
{
for(int i = 0; i < myPNGs.length; i++)
  {
    myClasses.add(new Class(myPNGs[i]));
  }
}

PImage[] myPNGs()
 {  

   ArrayList<PImage> myImages = new ArrayList<PImage>();


   File picturesPath = sketchFile("images"); // Supposes you have a "images" folder in your sketch folder
    File[] files = picturesPath.listFiles(); // Get a list of files
    PImage[] images = new PImage[files.length];
    int imageCount = 0;

    for (int i = 0; i < files.length; i++)
    {
        String fileName = files[i].getName().toLowerCase();
        if (fileName.endsWith(".png") || fileName.endsWith(".PNG"))
        {
          images[imageCount++] = loadImage(files[i].getAbsolutePath());
        }
    }
        return images;
  }

我的原始帖子： http : //forum.processing.org/two/discussion/6324/problem-loading-a-folder-full-of-images#Item_1

謝謝。

Answer 1

圖像需要一個@preload指令（ http://processingjs.org/reference/preload ），並且受互聯網工作方式（而不是文件系統）的限制：您不僅可以獲取目錄，還可以加載文件夾中的每個文件，因為除非您將該功能寫入網絡服務器，否則沒有互聯網上的目錄，並且沒有一些客戶端JavaScript可以解釋結果。

您將必須構建要加載的圖像的列表，並在使用它們之前對其進行預加載，或者編寫一些客戶端-服務器代碼以向服務器詢問目錄內容，構建預加載列表，然后進行加載在草圖源之前加上預加載指令的草圖。

另外，您也可以使用requestImage概念，在其中請求圖像，然后必須檢查img.width是否大於0。 一旦可用，就可以使用該映像，但是您仍然需要服務器/客戶端代碼來獲取目錄列表。