开发者

iphone - Focus effect (just like UIAlertView)

I know title of my question is so bad, but I don't know how to describe it.

When an UIAlertView pops up, anything else on the screen (except the UIAlertView) becomes a bit darker but can be seen. I call this as Focus effect, because you will know clearly and directly that now the UIAlertView 开发者_运维技巧is the focus.

So how can I implement such a focus effect?

thanks


Just add a translucent view below the view you want to "focus" on. Simple example:

UIView *shieldView = [[[UIView alloc] initWithFrame:myView.bounds] autorelease];
shieldView.backgroundColor = [UIColor colorWithWhite:0.0 alpha:0.7];
[myView.superview insertSubview:shieldView belowSubview:myView];

UIAlertView actually uses an image with a radial gradient instead of a simple color, in order to highlight the center of the view.


I know this post is a bit old but I thought it might help someone.

Use this code to generate the radial gradient background:

- (UIImage *)radialGradientImage:(CGSize)size start:(float)start end:(float)end centre:(CGPoint)centre radius:(float)radius{
UIGraphicsBeginImageContextWithOptions(size, YES, 1);

size_t count = 2;
CGFloat locations[2] = {0.0, 1.0};
CGFloat components[8] = {start, start, start, 1.0, end, end, end, 1.0};

CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGGradientRef grad = CGGradientCreateWithColorComponents (colorSpace, components, locations, count);
CGColorSpaceRelease(colorSpace);

CGContextDrawRadialGradient (UIGraphicsGetCurrentContext(), grad, centre, 0, centre, radius, kCGGradientDrawsAfterEndLocation);

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

CGGradientRelease(grad);
UIGraphicsEndImageContext();
return image;}

Define gradient in the .h file like so:

UIImageView *gradient;

Call your gradient like so:

- (void)addGradient{
CGSize size = self.view.bounds.size;
CGPoint centre = CGPointMake(self.view.bounds.size.width/2, self.view.bounds.size.height/2);

float startColor = 1.0f; 
float endColor = 0.0f;
float radius = MIN(self.view.bounds.size.width/4, self.view.bounds.size.height/4); 

gradient = [[UIImageView alloc] initWithImage:[self radialGradientImage:size 
                                                                  start:startColor 
                                                                    end:endColor 
                                                                 centre:centre 
                                                                 radius:radius]];

[gradient setBackgroundColor:[UIColor clearColor]];
[gradient setUserInteractionEnabled:YES];
[gradient setAlpha:0.6f];
[self.view addSubview:gradient];}


UIAlertView works like this. It fades in an alpha mask image to dim out the background. Once that animation is finished it starts the "bounce in" animation of the dialog.

So to reproduce it you need first to generate an alpha mask with a "bright spot" where your dialog will end up and fade that in. Then use a (few) frame animation(s) to get the bounce effect.

More info here: Creating a Pop animation similar to the presentation of UIAlertView


To make it better than "not good" you could ...

  1. create a UIView in a nib (easiest if the part of your code where you need the effect is already utilising a nib) and then add a translucent graphic (with a 'focus' effect) to that view.

  2. connect the UIView in the nib to an IBOutlet

  3. fade in the graphic using an animation into view hierarchy (omz example shows this)

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜