JNGradientLabel

An iOS UILabel subclass that uses gradients as its text or background color.

Installation

JNGradientLabel is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'JNGradientLabel'

Usage

First import JNGradientLabel at the top of your Swift file:

import JNGradientLabel

@import JNGradientLabel;

After initializing the label (from a Storyboard/XIB or manually) call one of following methods:

// To produce an `Axial` (Linear) gradient
label.setAxialGradientParameters(startPoint: startPoint,
                                   endPoint: endPoint,
                                     colors: gradientColors,
                                  locations: gradientlocations,
                                    options: ... /* Optional CGGradientDrawingOptions parameter */)
                                    
OR

// To produce a `Radial` gradient
label.setRadialGradientParameters(startCenter: startCenter,
                                  startRadius: startRadius,
                                    endCenter: endCenter,
                                    endRadius: endRadius,
                                       colors: gradientColors,
                                    locations: gradientlocations,
                             radiiScalingRule: ... /* Optional RadialGradientRadiiScalingRule parameter */,
                                      options: ... /* Optional CGGradientDrawingOptions parameter */)

// To produce an `Axial` (Linear) gradient
[label setAxialGradientParametersWithStartPoint:startPoint 
                                       endPoint:endPoint 
                                         colors:gradientColors 
                                      locations:gradientLocations
                                        options:gradientDrawingOptions];

OR

// To produce a `Radial` gradient
[label setRadialGradientParametersWithStartCenter:startCenter 
                                      startRadius:startRadius 
                                        endCenter:endCenter 
                                        endRadius:endRadius 
                                           colors:gradientColors 
                                        locations:gradientLocations 
                                 radiiScalingRule:radiiScalingRule 
                                          options:gradientDrawingOptions];

And thats it!

By default, the label draws the gradient as the color of the text. The label also supports drawing the gradient as the background of the text. To do this, simply set the textGradientLocation property as follows:

label.textGradientLocation = .background

label.textGradientLocation = TextGradientLocationBackground;

OR 

[label setTextGradientLocation:TextGradientLocationBackground];

Screenshots

Foreground Axial Gradient:

Foreground Radial Gradient:

Background Axial Gradient:

Background Radial Gradient:

Author

Joseph Newton, somerandomiosdev@gmail.com

License

JNGradientLabel is available under the MIT license. See the LICENSE file for more info.