A Library to apply Facebook style pride parade effect to photos
With the ongoing LGBT pride month, it reminds me of the pride effect I created a couple of years back. My original source of inspiration was Facebook which allowed people to overlay their photos with pride theme colors.
I thought of doing something similar of a effect on iOS as well. Initially things were not easy given that I had to apply an overlay to actual image. It was not just a mask to an image, but it was going to be the part of final
UIImageView layer. Besides, this layer being a literally
CALayer, the rules of AutoLayout did not apply there.
However, finally after several weeks I was able to finish the library and host it on Github. The source code is open and you are free to use or modify it as per your needs and requirements.
Here is the brief summary of usage and options this library provides.
Use following line in your
podfile to integrate the library in the iOS project. (Make sure to run
pod install after editing the
pod 'JKFacebookPrideEffect', :git => 'firstname.lastname@example.org:jayesh15111988/JKFacebookPrideEffect.git'
JKFacebookPrideEffect class with required parameters such as,
inputImage - Input image to apply pride effect to
size - Size of the input image in terms of bounds
There are various other parameters too which can be applied to this effect such as,
PrideEffect prideEffect - Desired effect of colored stripes such as vertical, horizontal or diagonal
BOOL textRequired - To show text on overlay or not
NSTextAlignment overlayTextAlignment - Alignment of the overlay text
UIFont* overlayTextFont - Font to be used for overlay text
UIColor* overlayTextColor - Color to be used for overlay text
BOOL variableTextColors - Decided whether to use fixed or variable colors for each series of overlay texts
BOOL applyGradientOverlay - Decides whether to apply smooth color gradient image to overlay effect rather than just providing step colors. Can be toggled with this flag value
For example, if you want to apply basic Facebook pride effect to any local folder image, you can use the following code,
// Create an object for pride effect applier with necessary parameter information. This involves input image, image size and colors to apply. JKImageEffectInfo* facebookPrideEffect = [[JKImageEffectInfo alloc] initWithInputImage:self.inputImage andSize:self.imageViewSample.frame.size andColors:colors]; // Pride effect applier is a class whose initializer takes the prideEffect object and then applies appropriate properties to it. JKFacebookPrideEffect* prideEffectApplier = [[JKFacebookPrideEffect alloc] initWithImageEffectInfo:facebookPrideEffect]; // The direction of effect prideEffectApplier.prideEffect = PrideEffectVertical; // Color can also be applied in the form of gradient. prideEffectApplier.applyGradientOverlay = NO; // An output image we get after applying pride color effect. UIImage* proudImage = [prideEffectApplier applyEffect]; // Set the output image to the UIImageView object. self.imageViewSample.image = proudImage;
And here's the output of the above code,
Below are some more examples of custom pride effect applied to my own image,
Hope you enjoyed this post. If you are excited about using this library to apply any other effects, feel free to use it without any permission. If you have any questions about source code or the usage, I will be more than happy to answer them
To reiterate, the source code of this library is freely available on Github, if you want to try out your own examples