iOS Blur Background like iTunes Remote App

Question

I'm new here so please bear with me. Can you please help me make a transparent blured background like the one used in iTunes Remote iOS7 app in the store? Also, how is the text masked? Screenshot here:
_{(source: rackcdn.com)}

Possible duplicate http://stackoverflow.com/questions/19262199/how-to-implement-a-real-time-ios7-blur-effect-in-the-uitableviewcells-backgroun Hope it's what you need. — wyang26, Nov 13 '13 at 16:15
I'm definitely interested in hearing how the text masking works. That's one of the first questions I had when seeing those screenshots. — paulrehkugler, Nov 16 '13 at 02:38
possible duplicate of [iPhone SDK - Frosted Glass (iOS 7 Blur) Effect](http://stackoverflow.com/questions/11601166/iphone-sdk-frosted-glass-ios-7-blur-effect) — pasawaya, Nov 16 '13 at 03:35

Dănuț Mihai Florian · Accepted Answer · 2013-11-16T02:39:39.570

4

I found the "UIImage+ImageEffect" class made by Apple, in a WWDC example Apple posted here: https://developer.apple.com/downloads/index.action?name=WWDC%202013#. Using this class, is's really simple to blur an image with this code: [image applyLightEffect] where image as an instance of UIImage.

Here are the steps i took to make the text look like it's "cut" from the background view. Use this layering order:

Blurred Image
View with lower opacity (ex 80%) filled with a color. I used a white background color.
2.1. Set a label as a child of this view and set the tint color to Black.
Add any other content you want on top.

And voila! It magically works!

edited Nov 16 '13 at 02:39

answered Nov 16 '13 at 01:47

Dănuț Mihai Florian

3,075
3
26
44

I don't understand your layering solution. Could you add a code snippet or something? – Palimondo Jan 08 '14 at 20:07
If you could please attach code/github illustrating this effect that would be great! – Chris Brasino Jan 27 '15 at 20:04
How can I make the same for UIView instead UIImage? – Dmitry Mar 29 '15 at 20:34
Xcode 6 offers Visual Effect View with Blur. You can find it in Object Library – Dănuț Mihai Florian Mar 29 '15 at 21:02

score 1 · Answer 2 · answered Nov 13 '13 at 18:10

1

Use UIToolBar of UIKit framework which automatically comes with blur and transparent effect on background view (live).

Reason - Since UIToolBar inherits UIView so fundamentally there is no issue in using it in place of UIView.

answered Nov 13 '13 at 18:10

Ashok

6,224
2
37
55

iOS Blur Background like iTunes Remote App

2 Answers2