Ole Begemann: iOS Development

iOS SDK, Cocoa and Objective-C

Porting RRGlossCausticShader to the iPhone

with 5 comments

Screenshot of the iPhone sample app for the gloss caustic shader

Screenshot of the iPhone sample app for the gloss caustic shader

In September 2008, Matt Gallagher published Drawing gloss gradients in CoreGraphics, a very nice piece of code “that will draw a ‘gloss’ gradient in a single statement. All colors in the gradient are calculated from the single color parameter.”

Roy Ratcliffe later complemented Matt’s article with a generalized Objective-C class called RRGlossCausticShader that exposes a number of parameters to modify the gloss effect to your liking. Roy’s code also includes a nice OS X sample application that helps visualizing the effects of parameter changes on the final result.

Unfortunately, neither Matt’s original version nor Roy’s refactoring work on the iPhone out of the box, mainly because they rely on NSColor, which is only available on the Mac platform. I recently ported Roy’s code to the iPhone and also wrote a little iPhone sample app for it.

Porting was fairly easy:

  • Use conditional compilation (#if TARGET_OS_IPHONE) to substitute UIColor for NSColor.
  • Add some functionality that NSColor has but UIColor lacks, namely getting individual color component values and converting colors between RGB and HSB.

For the iPhone sample app, I wanted to do a little more than just copy the existing OS X app, so I added a button to print the shader’s current settings to the debugger console. That way, you can play with the sliders until you find a shading you like and then just copy and paste the code from the console to your project to configure the shader with the correct settings. The app will also save the current settings to the user defaults on exit.

Screenshot of the debugger console with the iPhone gloss caustic shader sample app running.

You can print the gloss caustic shader's current settings to the debugger console and copy and paste them into your code from there.

Here are a few example shadings that can be created with RRGlossCausticShader:

Gloss caustic shader examples

The code is available on my GitHub account. I will also contact Roy and ask him to incorporate my modifications into his repository. Both his code and mine are released under the liberal MIT license.

Written by Ole Begemann

February 28th, 2010 at 7:02 pm

Posted in Uncategorized

5 Responses to 'Porting RRGlossCausticShader to the iPhone'

Subscribe to comments with RSS or TrackBack to 'Porting RRGlossCausticShader to the iPhone'.

  1. Excellent work Ole! I’ve merged your enhancements as requested, albeit with a few more enhancements. Makes you wonder: where should it go from here?

    Kind regards,
    Roy

    Roy Ratcliffe

    5 Mar 10 at 7:19 am

  2. Fantastic work.

    Have been looking for a way to create nice glossy buttons without relying on images.

    Thank you!

    SIgnar

    7 Apr 10 at 2:38 pm

  3. [...] for shininess is a particularly nifty one: based on RRGCausticShader an OS X implementation and ported to the iPhone, complete with an app to determine precisely the flavor of shininess to [...]

  4. I had to make a change for iPad SDK 3.2+, for some reason the gradient appeared yellowish at the bottom section. I adjusted the following, in RRGlossCausticShader.m

    FROM:

    void RRGlossCausticShaderEvaluate
    ….
    CGFloat f = RRExponentialFunctionEvaluate(&INFO(exponentialFunction), 0.7*(x – 0.5f));

    TO:

    void RRGlossCausticShaderEvaluate
    ….
    CGFloat f = RRExponentialFunctionEvaluate(&INFO(exponentialFunction), 0.7*(x – 0.5f));

    tato123

    14 Apr 10 at 12:37 am

  5. sorry, typo in the from section it should read


    CGFloat f = RRExponentialFunctionEvaluate(&INFO(exponentialFunction), 2*(x – 0.5f));

    tato123

    14 Apr 10 at 12:38 am

Leave a Reply