Geek Chic

Objective C & OpenGL image exporting

I’ve just spent many hours trying to get something that is essentially extremely simple working with Opengl and Objective C

Exporting an image in something like Processing is easy, you just say beginRaw() and endRaw() and just put your drawing content in between, being used to this I’m amazed the folks at Apple haven’t come up with something similar for OpenGL subviews.

Anyway the problem with OpenGL is that its a raster based system, which basically means exporting vector based images is a no go unless you fancy a headache, so I’ll settle for lousy bitmaps.

Just to help people I’ve shared the code to return NSData from a pixel buffer of your OpenGL view, this works quite well and renders out a PNG, although you can specify more formats if you so please, heres the basics on using this code.

First create an action, say that is generated from a button, mine looks like this in code:

-(IBAction)savePDF:(id)sender

{

    __block NSSavePanel *panel = [NSSavePanel savePanel];

    [panel setAllowedFileTypes:[NSArray arrayWithObject:@”png”]];

    [panel beginSheetModalForWindow:[self window] completionHandler:^(NSInteger result) {

        if(result == NSOKButton){

            //NSRect r = [self bounds];

            NSData *data = [self glToUIImage];

            NSError *error;

            BOOL successful = [data writeToURL:[panel URL] options:0 error:&error];

            if(!successful){

                NSAlert *a = [NSAlert alertWithError:error];

                [a runModal];

            }

        }

        panel = nil;

    }];

}

Now notice theres a call to [self glToUIImage]; in there, implement this method like so.

-(NSData *) glToUIImage {

    NSRect baseRect = [self convertRectToBase:[self bounds]];

    NSInteger myDataLength = baseRect.size.width * baseRect.size.height * 4;

    int width = baseRect.size.width;

    int height = baseRect.size.height;

    // allocate array and read pixels into it.

    GLubyte *buffer = (GLubyte *) malloc(myDataLength);

    glReadPixels(0, 0, baseRect.size.width, baseRect.size.height, GL_RGBA, GL_UNSIGNED_BYTE, buffer);

    // gl renders “upside down” so swap top to bottom into new array.

    // there’s gotta be a better way, but this works.

    GLubyte *buffer2 = (GLubyte *) malloc(myDataLength);

    for(int y = 0; y <height; y++)

    {

        for(int x = 0; x <width * 4; x++)

        {

            buffer2[((height - 1) - y) * width * 4 + x] = buffer[y * 4 * width + x];

        }

    }

    // make data provider with data.

    CGDataProviderRef provider = CGDataProviderCreateWithData(NULL, buffer2, myDataLength, NULL);

    // prep the ingredients

    int bitsPerComponent = 8;

    int bitsPerPixel = 32;

    int bytesPerRow = 4 * width;

    CGColorSpaceRef colorSpaceRef = CGColorSpaceCreateDeviceRGB();

    CGBitmapInfo bitmapInfo = kCGBitmapByteOrderDefault;

    CGColorRenderingIntent renderingIntent = kCGRenderingIntentDefault;

    // make the cgimage

    CGImageRef imageRef = CGImageCreate(width, height, bitsPerComponent, bitsPerPixel, bytesPerRow, colorSpaceRef, bitmapInfo, provider, NULL, NO, renderingIntent);

    // then make the uiimage from that

    CIImage *myImage = [CIImage imageWithCGImage:imageRef];

    NSBitmapImageRep* rep = [[NSBitmapImageRep alloc]

                             initWithCIImage:myImage];

    NSData* PNGData = [rep representationUsingType:NSPNGFileType

                                        properties:nil];

    return PNGData;

}

Thats it! you should be okies to export from an OpenGL view, make sure you connect the action to a component and your good to go!

DMX for Mac

Over the past month i’ve been slowly moving away from Java and onto Objective C, a move I’ve been waiting to take since finishing my MSc thesis.

Now getting to grips with Objective C, I’ve done some research on the app store to see what DMX software packages they have.

Currently some basic software exists for the purpose of control, however there aren’t many packages that support mapping integration from multiple input sources.

The Plan:

Supposedly things are more likely to get done if you write them down, the plan for one half of this year is to write a lighting control system in objective c for the mac app store. 

This will at first include five main sources of mapping integration: Music, WiiMote, OSC, Wave Functions, and the Kinect.

The interface will be grid styled, and easy to use, with more emphasis on simply playing with lights as opposed to the troublesome task of setting them up onto a network.

This work is inspired by Light jams, and i hope that the developer allows me to utilise his branding for a mac version.

Processing code for a moveable resizable object

Here is a nice bit of simple Processing code for a moveable, resizable object in Processing.

It only forms a tiny bit of my entire MSc implementation, however it works nice and the code is quite simple so I thought i would just throw it up on here:

private window wind;

void setup() {

  size(800, 600); 

  wind = new window(width/2, height/2, 200, 200);

}

void draw() {

  background(0); 

  wind.drawWindow();

}

void mouseMoved() {

}

void mouseDragged() {

  if (mouseButton == RIGHT) {

    wind.moveTo(mouseX, mouseY);

  }

  else if (mouseButton == LEFT) {

      wind.resizeWindow(2*(abs(mouseX - wind.x)), 2*(abs(mouseY - wind.y)));   

  }

}

public class window {

  public float x;

  public float y;

  public float width;

  public float height;

  public window(float x, float y, float w, float h) {

    this.x = x;

    this.y = y;

    this.width = w;

    this.height = h;

  }

  public void drawWindow() {

    if (isOver(mouseX, mouseY)) {

      fill(0, 255, 0);

    }

    else {

      fill(255, 0, 0);

    }

    if (isResizeNegative(mouseX, mouseY) || isResizePositive(mouseX, mouseY)) {

      cursor(CROSS);

    }

    else {

      cursor(ARROW);

    }

    rectMode(CENTER);

    rect(this.x, this.y, this.width, this.height);

  }

  public boolean isOver(float mx, float my) {

    return (((mx >= this.x - (this.width / 2)) && (mx <= this.x + (this.width / 2))) && ((my >= this.y - (this.height / 2)) && (my <= this.y + (this.height / 2))));

  }

  public void moveTo(float mx, float my) {

    this.x = (int)mx;

    this.y = (int)my;

  }

  public boolean isResizeNegative(float mx, float my) {

    float scaleFact = 5;

    return (mx <= ((this.x - this.width/2) + scaleFact) && mx >= ((this.x - this.width/2) - scaleFact) || my <= ((this.y + this.height/2) - scaleFact) && my >= ((this.y + this.height/2) + scaleFact ));

  }

  public boolean isResizePositive(float mx, float my) {

    float scaleFact = 5;

    return (mx <= ((this.x + this.width/2) + scaleFact) && mx >= ((this.x + this.width/2) - scaleFact) || my <= ((this.y - this.height/2) - scaleFact) && my >= ((this.y - this.height/2) + scaleFact));

  }

  public void resizeWindow(float mx, float my) {

    this.width = mx;

    this.height = my;

    if (this.width <= 10) {

      this.width = 10;

    }

    if (this.height <= 10) {

      this.height = 10;

    }

  }

}

Processing to OpenGL/Netbeans

Oh the joys of getting someone else’s code and trying to make sense of it, in all honesty it’s not that bad, just a tad hacked together and lacking in summaries of methodical processes.

What is bad is converting it to Netbeans from the Processing IDE, it may be a blag but i’m sure it will make my life much easier in the long run! and also help me to understand the code a bit better!