图片模糊、下拉图片放大

先来一张效果图

项目暂未上线，所以就部分马赛克咯

这里的布局主要是分为两部分，整体使用UITableView，上面的图片及卡片为UITableView的头部，下面就是Cell了
下面主要介绍高斯模糊和图片下拉放大两个部分：

高斯模糊

这里的高斯模糊主要使用的是UIImage+ImageEffects，只需要两个文件即可，里面提供了以下几个方法：

#pragma mark - Blur Image

/**
 *  Get blured image.
 *
 *  @return Blured image.
 */
- (UIImage *)blurImage;

/**
 *  Get the blured image masked by another image.
 *
 *  @param maskImage Image used for mask.
 *
 *  @return the Blured image.
 */
- (UIImage *)blurImageWithMask:(UIImage *)maskImage;

/**
 *  Get blured image and you can set the blur radius.
 *
 *  @param radius Blur radius.
 *
 *  @return Blured image.
 */
- (UIImage *)blurImageWithRadius:(CGFloat)radius;

/**
 *  Get blured image at specified frame.
 *
 *  @param frame The specified frame that you use to blur.
 *
 *  @return Blured image.
 */
- (UIImage *)blurImageAtFrame:(CGRect)frame;

#pragma mark - Grayscale Image

/**
 *  Get grayScale image.
 *
 *  @return GrayScaled image.
 */
- (UIImage *)grayScale;

#pragma mark - Some Useful Method

/**
 *  Scale image with fixed width.
 *
 *  @param width The fixed width you give.
 *
 *  @return Scaled image.
 */
- (UIImage *)scaleWithFixedWidth:(CGFloat)width;

/**
 *  Scale image with fixed height.
 *
 *  @param height The fixed height you give.
 *
 *  @return Scaled image.
 */
- (UIImage *)scaleWithFixedHeight:(CGFloat)height;

/**
 *  Get the image average color.
 *
 *  @return Average color from the image.
 */
- (UIColor *)averageColor;

/**
 *  Get cropped image at specified frame.
 *
 *  @param frame The specified frame that you use to crop.
 *
 *  @return Cropped image
 */
- (UIImage *)croppedImageAtFrame:(CGRect)frame;

每个方法都有注释，总体来说这些方法分为三类：

Blur Image 模糊图片
- (UIImage *)blurImage; // 调用后直接返回一张模糊的图片
- (UIImage *)blurImageWithMask:(UIImage *)maskImage; // 返回带有遮罩层的模糊图片
- (UIImage *)blurImageWithRadius:(CGFloat)radius; // 返回一张模糊图片，模糊度可以自己设置
- (UIImage *)blurImageAtFrame:(CGRect)frame; // 返回一张特定大小的模糊图片
Grayscale Image 灰度图片
Some Useful Method 一些有用的方法
- (UIImage *)scaleWithFixedWidth:(CGFloat)width; // 根据宽度缩放图片
- (UIImage *)scaleWithFixedHeight:(CGFloat)height; // 根据高度缩放图片
- (UIColor *)averageColor; // 获得图片的平均色值
- (UIImage *)croppedImageAtFrame:(CGRect)frame; // 裁剪出特定大小的图片

下载地址

图片下拉放大

下拉图片放大的原理也是非常简单的。主要就是在UITableView上边添加一个图片子视图，在UITableView拖动的时候动态的改变图片的frame。

1. 设置UITableView

UITableView的设置跟平常的一样，使用xib也可以，代码也可以。我这里以代码示例

    self.tableV = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, kScreenWidth, kScreenHeight - 49) style:(UITableViewStyleGrouped)];
    _tableV.backgroundColor = [UIColor groupTableViewBackgroundColor];
    _tableV.separatorStyle = UITableViewCellSeparatorStyleNone;
    _tableV.delegate = self;
    _tableV.dataSource = self;
    _tableV.tableFooterView = [[UIView alloc] init];
    [self.view addSubview:_tableV];

注意，我们要通过设置UITableView的内容偏移来为图片预留出位置

_tableV.contentInset = UIEdgeInsetsMake(kHeaderViewHeight, 0, 0, 0);  // kHeaderViewHeight是宏定义，预留出的位置 200

2. 设置图片子视图

接下来就是设置图片子视图了，因为项目中这个子视图不仅仅只有图片，还有别的内容，就单独拉出来使用xib实现了，效果图就是本文第一张图了

    self.headerView = kBundleLoadNibName(NSStringFromClass([HmMineHeaderView class]));
    self.headerView.frame = CGRectMake(0, - kHeaderViewHeight, kScreenWidth, kHeaderViewHeight);
    [self.tableV addSubview:_headerView];

注意：这里的子视图不论是直接一个UIImageView，还是包含有其他的控件，一定要把UIImageView的contentMode设置为UIViewContentModeScaleAspectFill，只有这样才能保证图片在放大的过程中宽高同时放大。我的是在xib中就设置好了。

3. UITableView拖动事件处理

UITableView继承自UIScrollView，所以关于拖动事件的处理，我们可以放在UIScrollView的代理中实现

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    CGFloat y = scrollView.contentOffset.y;
    if (y < - kHeaderViewHeight) {
        CGRect frame = self.headerView.frame;
        frame.origin.y = y;
        frame.size.height = -y;
        self.headerView.frame = frame;
    }
}