How to Create Perlin Noise on iPhone

Question

I want to create an animated perlin noise on an iPhone, so I can end up doing something like this: http://dl.dropbox.com/u/1977230/example.png

I looked and looked, but can't find anything similar or a way to actually display Perlin noise.

I was told to watch OpenGL ES, but even looking for an example of Perlin noise or the lava / plasma effect does not lead to anything.

I would really appreciate help on this.

Thanks guys Andre

Answer 1

Ok, first learn the Perlin Noise algorithm itself. http://en.wikipedia.org/wiki/Perlin_noise looks like just the best place to take off.

Once you have the RGBA data of this effect, the nasty thing starts.

There are basically two options.

• Subclass UIView and override the draw: (CGRect) method. Use the smart mind to convert RGB data to a bitmap in Objective-C ++ Cocoa to create a CGImage from your data and draw that image in the current context in drawing.

  CGContextDrawImage(UIGraphicsGetCurrentContext(), <#CGRect rect#>, <#CGImageRef image#>); 

  If it's a still image, you're fine. if this is a revival, this may not be the best solution.

• Get to know OpenGL ES on iPhone. The OpenGL ES iPhone SDK example is a great starting point. Learn texture mapping. When you are familiar with glTexImage2D, use this to upload an image.

  An example can be easily expanded as follows:

  have the following meanings:

    GLuint spriteTexture; GLubyte *spriteData; // the perlin noise will be here size_t width, height; 

  then in the ESRenderer init method, create space for the texture:

   - (id) init { .... width = 512; // make sure the texture size is the power of 2 height = 512; glGenTextures(1, &spriteTexture); glBindTexture(GL_TEXTURE_2D, spriteTexture); glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, width, height, 0, GL_RGBA, GL_UNSIGNED_BYTE, spriteData); //free(spriteData); // free this if not used any more glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR); glEnableClientState(GL_VERTEX_ARRAY); glEnableClientState(GL_TEXTURE_COORD_ARRAY); 

  If the noise periodically updates, update the texture in the rendering method

    - (void) render { ..... glBindTexture(GL_TEXTURE_2D, spriteTexture); glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, width, height, 0, GL_RGBA, GL_UNSIGNED_BYTE, spriteData); 

Ah, I missed a good old video for $ A000 days :)

Answer 2

I started an open source project on Github that you can use to generate Perlin noise. It supports the full 4-dimensional (x, y, z, t) generation of Perlin. It also includes a sandbox project to play with texture ideas. http://czgarrett.com/code/2011/05/18/perlin-noise-generator-for-ios.html

Answer 3

Now for the GLSL shader, there is another Perlin noise function that does not require search textures: https://github.com/ashima/webgl-noise/tree/master/src . This should work on the iPhone.