CODEWITHSUNDEEP
iosobjective-cuiimageios7gpuimage
maxned
maxned

Reputation: 393

Realtime Blending UIImages

Is it possible to have realtime blending like the arrow in notification center on iOS 7? I wonder if it is possible to have a UIImage blend with soft light with the content (UIView or CALayer) right underneath it, so the background image can move and the blended image would stay in one spot.

I want it to be where you can have a UIImage where you can set a blendMode property to whatever blend mode you need, such as, imageView.blendMode = kCGBlendModeSoftLight;

I tried using GPUImage but I could not figure out how to do what I need. Any help would be appreciated.

So far, the code I use to set the blend mode of a UIImage is this; however, if the background view is moved, the blend on the UIImage is not updated. 

    //blur the background
    GPUImageGaussianBlurFilter *blurFilter = [[GPUImageGaussianBlurFilter alloc] init];
    blurFilter.blurRadiusInPixels = 50.0f;
    blurFilter.blurPasses = 4;
    UIImage *blurredBackground = [blurFilter imageByFilteringImage:[UIImage imageNamed:@"Background.png"]];

    //make the blended images
    UIGraphicsBeginImageContextWithOptions(self.view.bounds.size, NO, 2.0f);
    CGContextSetInterpolationQuality(UIGraphicsGetCurrentContext(), kCGInterpolationHigh);
    [blurredBackground drawInRect:self.view.bounds blendMode:kCGBlendModeNormal alpha:1.0];

    [[UIImage imageNamed:@"BarLineImage.png"] drawInRect:CGRectMake(0, self.view.bounds.size.height - 31, self.view.bounds.size.width, 1) blendMode:kCGBlendModeSoftLight alpha:1.0];

    [[UIImage imageNamed:@"Equalizer-th.png"] drawInRect:CGRectMake(65, self.view.bounds.size.height - 30, 30, 30) blendMode:kCGBlendModeSoftLight alpha:1.0];
    [[UIImage imageNamed:@"Player-th.png"] drawInRect:CGRectMake(145, self.view.bounds.size.height - 30, 30, 30) blendMode:kCGBlendModeSoftLight alpha:1.0];
    [[UIImage imageNamed:@"Container-th.png"] drawInRect:CGRectMake(225, self.view.bounds.size.height - 30, 30, 30) blendMode:kCGBlendModeSoftLight alpha:1.0];

    UIImage *blendedImages = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

Here is a screenshot of what this code does for some visual aid.Screenshot

This looks the way I need it to but I cannot animate the content underneath the images at the bottom. I really need to be able to have realtime blending for UIImages and UIViews.

Upvotes: 5

Views: 1309

Answers (1)

dzana_dj
dzana_dj

Reputation: 1

Check video number 226 from WWDC session. You can find a lot of information how to animate, blend images using new iOS 7 api.

I realize that my answer is not complete and it should be a comment to question but my reputation is too low.

edit: WWDC Session 2013, Video nr 226: Implementing Engaging UI on iOS

Upvotes: 0

Related Questions