Make a loading bar


I have to load a lot of images at the launch of my application, so I would like to create a loading bar, so I ask you how to do this under cinder, I thought to draw my loading bar at each passage of the loop to load my images .

Thanks you


one way to do it, is to first fill a std::vector<ci::fs::path> mFiles with the paths to the files you want to load. Next, you store how many files you start with in a variable, e.g. size_t mTotal = mFiles.size().

Then, you pass that vector to a background thread, which loads the images. Have a good look at the FlickrTestMultithreaded sample on how to do this. The background thread removes a path from the queue and loads it, so you can keep track of how many paths are still queued. You can calculate the progress (from 0 to 1) like this:

float YourLoader::getProgress() const {
    // Guard to protect against concurrent access.
    std::lock_guard<std::mutex> lock( mMutex ); 

    return ( mTotal - mFiles.size() ) / float( mTotal );

On your main thread, you then simply draw a progress bar:

void YourApp::draw()
    const auto progress = mLoader.getProgress();
    const auto bar = Rectf( 100, 100, 500, 50 ); 
    gl::drawSolidRect( { bar.x1, bar.y1, bar.x1 + progress * bar.getWidth(), bar.y2 } );
    gl::drawStrokedRect( bar );


Hoo thank you! I did not know it was possible to do this thanks to Cinder I will implement this, thank you very much!


I’ve created a Gist for you, showing in detail how you could do this. Create a new ProgressBar project with Cinder’s TinderBox or manually, then copy-paste the code of the Gist. Add some PNG images to your assets folder and run it.

Have fun!



It works perfectly! Thank you very much Paul!
I have an another question that is not related, I will like during the thread to load a video, so I tried to compile Quicktime samples of cinder, it compiles but when I run the program and chose my video the program tells me that the video can not load without telling me why? You have a solution? Maybe the format? (I tried mp4 flv and mov)
Thanks you so much for your answer!


unfortunately, there is no easy solution to that. Video libraries with support for OpenGL are a bit flaky at the moment. The built-in support for Quicktime also works on Windows, but you will need to install Quicktime (try to find a “lite” version like this one) and then at least you should be able to decode and render video. But it will use your CPU only, so unless you have a very (very!) beefy computer, a 4K video will be out of the question.

Search the forum for better alternatives, like the Cinder-WMF block or a gStreamer solution. They both attempt to leverage the DirectX library for hardware decompression, then share the texture with OpenGL. Your mileage may vary.