iOS 自定义瀑布流相册控件

该控件为自定义的实现瀑布流效果的控件，功能较为简单，并提供自定义delegate以供使用 功能会一步步完善起来 注意内存问题：不显示的image设成nil

控件分为.h 和 .m文件

效果图

控件分为3列来显示

1. .h文件包含协议声明和控件声明

@protocol UIPhotosViewDelegate <NSObject>
 
// 当点击某个图片时，返回该图片所在的UIImageView,参数即返回的imageview
- (void)clickedWithView:(UIImageView *)view;
 
@end
 
 
@interface UIPhotosView : UIView <UIPhotosViewDelegate> {
     
}
 
@property (nonatomic, assign) id<UIPhotosViewDelegate> delegate;  // 自定义协议
 
@property (nonatomic, retain) UIView *leftView;                   // 左侧视图框
@property (nonatomic, retain) UIView *midView;                    // 中间视图框
@property (nonatomic, retain) UIView *rightView;                  // 右侧视图框
 
@property (nonatomic, assign) CGFloat subWidth;                   // 视图框的宽度，即1/3
 
- (void)addImage:(UIImage *)image;                                // 向控件加入一张图片
 
@end

2. .m文件包含控件实现

@implementation UIPhotosView
 
// 初始化
- (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        _subWidth = frame.size.width / 3.0;
         
        _leftView = [[UIView alloc] init];
        _leftView.frame = CGRectMake(0, 0, _subWidth, 1);
        [self addSubview:_leftView];
         
        _midView = [[UIView alloc] init];
        _midView.frame = CGRectMake(_subWidth, 0, _subWidth, 1);
        [self addSubview:_midView];
         
        _rightView = [[UIView alloc] init];
        _rightView.frame = CGRectMake(_subWidth*2, 0, _subWidth, 1);
        [self addSubview:_rightView];
    }
    return self;
}
 
// 加入图片
- (void)addImage:(UIImage *)image {
    CGFloat leftHeight = _leftView.frame.size.height;
    CGFloat midHeight = _midView.frame.size.height;
    CGFloat rightHeight = _rightView.frame.size.height;
     
    UIImageView *view = [self createImageView:image];  // 创建imageview
     
    CGFloat wid = _subWidth;
    CGFloat hei = image.size.height / (image.size.width / _subWidth);
     
    // 判断加入最短的view内
    if (leftHeight <= midHeight && leftHeight <= rightHeight) {
        [_leftView addSubview:view];
        view.frame = CGRectMake(0, leftHeight, wid, hei);
        leftHeight = leftHeight + hei;
        _leftView.frame = CGRectMake(0, 0, wid, leftHeight);
    }
    else if (midHeight <= rightHeight) {
        [_midView addSubview:view];
        view.frame = CGRectMake(0, midHeight, wid, hei);
        midHeight = midHeight + hei;
        _midView.frame = CGRectMake(_subWidth, 0, wid, midHeight);
    }
    else {
        [_rightView addSubview:view];
        view.frame = CGRectMake(0, rightHeight, wid, hei);
        rightHeight = rightHeight + hei;
        _rightView.frame = CGRectMake(_subWidth*2, 0, wid, rightHeight);
    }
     
    // 调整当前控件的frame
    CGFloat maxnum = [self max:leftHeight and:midHeight and:rightHeight];
    self.frame = CGRectMake(0, 0, self.frame.size.width, maxnum);
}
 
// 创建imageview   并绑定事件
- (UIImageView *)createImageView:(UIImage *)image {
    UIImageView *view = [[UIImageView alloc] initWithImage:image];
    view.layer.borderWidth = 1.0;
    view.layer.borderColor = [UIColor redColor].CGColor;
     
    view.userInteractionEnabled = YES;
    UITapGestureRecognizer *recognizer = [[UITapGestureRecognizer alloc] init];
    [recognizer addTarget:self action:@selector(handleClicked:)];
    [view addGestureRecognizer:recognizer];
     
    return view;
}
 
// 点击view时获取imageview，传给delegate
- (void)handleClicked:(UITapGestureRecognizer *)recognizer {
    UIImageView *view = recognizer.view;
    [self.delegate clickedWithView:view];
}
 
- (CGFloat)max:(CGFloat)n1 and:(CGFloat)n2 and:(CGFloat)n3 {
    CGFloat maxnum = n1 > n2 ? n1 : n2;
    maxnum = maxnum > n3 ? maxnum : n3;
    return maxnum;
}
 
@end

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点！
本站所提供的图片等素材，版权归原作者所有，如需使用，请与原作者联系。