ios界面特效:倒影

///////////////////////////////////ImageHelper.h///////////////////////////////////////////////////

#import <Foundation/Foundation.h>

#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>
 
@interface ImageHelper : NSObject 
  + (void) addReflectionToView: (UIView *) theView;
@end

///////////////////////////////////ImageHelper.m///////////////////////////////////////////////////

      

#import "ImageHelper.h"

@implementation ImageHelper

const CGFloat kReflectDistance = 10.0f;   //定义倒影与实体的中间间隔

 

+ (void) addReflectionToView: (UIView *) theView   // 外部接口,倒影处理,从这里开始
{
    theView.clipsToBounds = NO;
   
    UIImageView *reflection = [[UIImageView alloc] initWithImage:[ImageHelper reflectionOfView:theView withPercent: 1]]; // 具体处理
    CGRect frame = reflection.frame;
    frame.origin = CGPointMake(0.0f, theView.frame.size.height + kReflectDistance);
    reflection.frame = frame;
    [theView addSubview:reflection];           //将倒影‘贴’在现有视图下方
    [reflection release];
}

//核心函数,cookbook版

+ (UIImage *) reflectionOfView: (UIView *)theView withPercent: (CGFloat) percent // percent这个参数用于设置阴影显示多少
{
   
    // Retain the width but shrink the height
    CGSize size = CGSizeMake(theView.frame.size.width, theView.frame.size.height * percent);
   
    // 制作镜像
    UIGraphicsBeginImageContext(size);
    CGContextRef context =  UIGraphicsGetCurrentContext();
   [theView.layer renderInContext:context];
    UIImage *partialimg = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
   
    // 添加灰蒙渐变效果

    CGImageRef mask = [ImageHelper createGradientImage:size];
    CGImageRef ref = CGImageCreateWithMask(partialimg.CGImage, mask);
    UIImage *theImage = [UIImage imageWithCGImage:ref];
    CGImageRelease(ref);
    CGImageRelease(mask);
   
    return theImage;
}

//核心函数,xes改良版

+ (UIImage *) reflectionOfView_2: (UIView *)theView withPercent: (CGFloat) percent
{
   
    // Retain the width but shrink the height
    CGSize size = CGSizeMake(theView.frame.size.width, theView.frame.size.height * percent);
    
    // 制作镜像
    CGContextRef context =  MyCreateBmpContext(size.width,size.height);/ 
    CGFloat height_left= theView.bounds.size.height - size.height;
    CGContextTranslateCTM(context, 0, -height_left);
    [theView.layer renderInContext:context];
    CGImageRef bmpContext = CGBitmapContextCreateImage(context); 
     // 添加灰蒙渐变效果

    CGImageRef mask = [ImageHelper createGradientImage:size];
    CGImageRef ref = CGImageCreateWithMask(bmpContext , mask);
    UIImage *theImage = [UIImage imageWithCGImage:ref];
    CGImageRelease(ref);
    CGImageRelease(mask);
   
    return theImage;
}

CGContextRef MyCreateBmpContext(int pixelsWide, int pixelsHigh)
{
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
 
 // create the bitmap context
 CGContextRef bitmapContext = CGBitmapContextCreate (nil, pixelsWide, pixelsHigh, 8,
              0, colorSpace,
              // this will give us an optimal BGRA format for the device:
              (kCGBitmapByteOrder32Little | kCGImageAlphaPremultipliedFirst));
 CGColorSpaceRelease(colorSpace);
   
    return bitmapContext;
}


+ (CGImageRef) createGradientImage: (CGSize)size       //蒙化处理函数
{
    CGFloat colors[] = {0.0, 1.0, 1.0, 1.0};
   
    // Create gradient in gray device color space
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceGray();
    CGContextRef context = CGBitmapContextCreate(nil, size.width, size.height, 8, 0, colorSpace, kCGImageAlphaNone);
    CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, colors, NULL, 2);
    CGColorSpaceRelease(colorSpace);
   
    // Draw the linear gradient
    CGPoint p1 = CGPointZero;
    CGPoint p2 = CGPointMake(0, size.height);
    CGContextDrawLinearGradient(context, gradient, p1, p2, kCGGradientDrawsAfterEndLocation);
   
    // Return the CGImage
    CGImageRef theCGImage = CGBitmapContextCreateImage(context);
    CFRelease(gradient);
    CGContextRelease(context);
    return theCGImage;
}


在iphone上经常可以看到图标的倒影效果,看起来挺复杂的,不过网上有很多博客都把cookbook上的代码拷贝了上来,然而经过测试那段代码只能实现一个一模一样的镜像,但不是倒立对称的。

       首先要说的是,cookbook我觉得是故意只给你看一部分的,书上看得到的是一段类方法的函数,其实真正要使用,需要自己做一个类,ImageHelper,然后比如要对myview倒影化处理,只需调用[ImageHelper  reflectToview:myview]即可。

 


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值