#pragma mark ---添加头部视图---
- (void)addHeaderView{
//headerView
_headerView = [[JZSMeHeaderView alloc] initWithFrame:CGRectMake(0, 0, kScreenWidth, 240)];
_headerView.delegate = self;
_headerView.backgroundColor = [UIColor redColor];
_tableView.tableHeaderView = _headerView;
//转换头视图
[_headerView stretchHeaderForTableView:_tableView];
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
[_headerView scrollViewDidScroll:scrollView];
}
#import <UIKit/UIKit.h>
@protocol JZSMeHeaderViewDelegate <NSObject>
- (void)JZSMeHeaderViewClickBack;
- (void)JZSMeHeaderViewClickIcon;
@end
@interface JZSMeHeaderView : UIView
@property (nonatomic,strong)id<JZSMeHeaderViewDelegate>delegate;
//转变
- (void)stretchHeaderForTableView:(UITableView *)tableView;
//滑动
- (void)scrollViewDidScroll:(UIScrollView *)scrollView;
@end
#import "JZSMeHeaderView.h"
#import "JZSWaveView.h"
@interface JZSMeHeaderView ()
{
//back
CGRect originBgFrame;
CGFloat originBgHeight;
//icon
CGRect originIconFrame;
CGFloat originIconHeight;
CGFloat originIconY;
}
@property (nonatomic,strong)UITableView * tableView;
@property (nonatomic,strong)UIImageView * backImgView;
@property (nonatomic,strong)UIImageView * iconImageView;
@property (nonatomic,strong)UILabel * nameLabel;
@property (nonatomic,strong)JZSWaveView * waveView;
@end
@implementation JZSMeHeaderView
- (instancetype)initWithFrame:(CGRect)frame{
self = [super initWithFrame:frame];
if (self) {
}
return self;
}
#pragma mark ---转换头视图---
- (void)stretchHeaderForTableView:(UITableView *)tableView{
_tableView = tableView;
//backImg
_backImgView = [UIImageView creatImageViewWithFrame:self.bounds Image:@"me_header_backgroud" BackGroudColor:[UIColor greenColor] Hidden:NO];
_backImgView.userInteractionEnabled = YES;
[_tableView addSubview:_backImgView];
UITapGestureRecognizer * backImageTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(backImageTap:)];
[_backImgView addGestureRecognizer:backImageTap];
//icon
_iconImageView = [UIImageView creatImageViewWithFrame:CGRectMake(0, 0, 100, 100) Image:@"me_header_icon" BackGroudColor:[UIColor greenColor] Hidden:NO];
_iconImageView.center = _backImgView.center;
_iconImageView.userInteractionEnabled = YES;
[_iconImageView imageViewWithCircularValue:50.0];
[_backImgView addSubview:_iconImageView];
UITapGestureRecognizer * iconTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(iconImageTap:)];
[_iconImageView addGestureRecognizer:iconTap];
//name
_nameLabel = [UILabel creatLabelWithFrame:CGRectZero Text:@"王先生" Font:18 Thick:NO TextColor:KColorRGB(255, 255, 255) Alignment:NSTextAlignmentCenter BgColor:[UIColor clearColor] Hidden:NO];
[_backImgView addSubview:_nameLabel];
[_nameLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.bottom.mas_equalTo(_backImgView.mas_bottom).offset(-30);
make.left.mas_equalTo(_backImgView.mas_left).offset(0);
make.right.mas_equalTo(_backImgView.mas_right).offset(0);
make.height.mas_equalTo(20);
}];
//添加波浪动画
_waveView = [JZSWaveView addToView:_backImgView withFrame:CGRectMake(0, CGRectGetHeight(_backImgView.frame) - 3, _backImgView.width, 3)];
[_waveView startWave];
//记录背景图片原始位置
originBgFrame = _backImgView.frame;
originBgHeight = originBgFrame.size.height;
//记录原头像的原始位置
originIconFrame = _iconImageView.frame;
originIconHeight = originIconFrame.size.height;
originIconY = originIconFrame.origin.y;
}
#pragma mark ---点击头部背景视图的事件---
- (void)backImageTap:(UITapGestureRecognizer *)tap{
if (_delegate && [_delegate respondsToSelector:@selector(JZSMeHeaderViewClickBack)]) {
[_delegate JZSMeHeaderViewClickBack];
}
}
#pragma mark ---点击头像的事件---
- (void)iconImageTap:(UITapGestureRecognizer *)tap{
if (_delegate && [_delegate respondsToSelector:@selector(JZSMeHeaderViewClickIcon)]) {
[_delegate JZSMeHeaderViewClickIcon];
}
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
if (scrollView.contentOffset.y < 0) {
CGFloat offsetY = (scrollView.contentOffset.y + scrollView.contentInset.top) * -1;
//===back
//让背景图片y值改变，一值保持在0位置
originBgFrame.origin.y = offsetY * -1;
//高度增加
originBgFrame.size.height = originBgHeight + offsetY;
//重新赋值
_backImgView.frame = originBgFrame;
//===icon
originIconFrame.size.height = originIconHeight + offsetY * .3;
originIconFrame.size.width = originIconHeight + offsetY * .3;
_iconImageView.frame = originIconFrame;
_iconImageView.center = CGPointMake(self.center.x, originIconY + originIconFrame.size.height * .5);
_iconImageView.layer.cornerRadius = originIconFrame.size.height * .5;
//wave
_waveView.frame = CGRectMake(0, CGRectGetHeight(_backImgView.frame) - 3, _backImgView.frame.size.width, 3);
}
}
#import <UIKit/UIKit.h>
@interface JZSWaveView : UIView
+ (instancetype)addToView:(UIView *)view withFrame:(CGRect)frame;
//开始动画
- (void)startWave;
//停止动画
- (void)stopWave;
#import "JZSWaveView.h"
@interface JZSWaveView ()
{
CGFloat angularSpeed; //幅度
CGFloat waveSpeed; //破浪速度
UIColor * waveColor; //破浪颜色
}
@property (nonatomic,strong)CAShapeLayer * waveShapeLayer;
@property (nonatomic,assign)CGFloat offsetX;
@property (nonatomic,strong)CADisplayLink * waveDisplayLink;
@end
@implementation JZSWaveView
+ (instancetype)addToView:(UIView *)view withFrame:(CGRect)frame{
JZSWaveView * waveView = [[JZSWaveView alloc] initWithFrame:frame];
waveView.backgroundColor = [UIColor clearColor];
[view addSubview:waveView];
return waveView;
}
- (instancetype)initWithFrame:(CGRect)frame{
self = [super initWithFrame:frame];
if (self) {
angularSpeed = 2.0f;
waveColor = kColorRGBA(255, 255, 255, .3);//波浪的颜色
waveSpeed = 5.0f;
}
return self;
}
//开始动画
- (void)startWave{
//shapeLayer
_waveShapeLayer = [CAShapeLayer layer];
_waveShapeLayer.fillColor = waveColor.CGColor;//闭环填充颜色
[self.layer addSublayer:_waveShapeLayer];
//计时器
_waveDisplayLink = [CADisplayLink displayLinkWithTarget:self selector:@selector(currentWave)];
[_waveDisplayLink addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSRunLoopCommonModes];
}
//开始计时器
- (void)currentWave{
self.offsetX -= (waveSpeed * self.superview.frame.size.width / 320);
CGFloat width = CGRectGetWidth(self.frame);
CGFloat height = CGRectGetHeight(self.frame);
CGMutablePathRef path = CGPathCreateMutable();
CGPathMoveToPoint(path, NULL, 0, height / 2);
CGFloat y = 0.f;
for (CGFloat x = 0.f; x <= width ; x++) {
//-1 ~ 1
y = height * sin(0.01 * (angularSpeed * x + self.offsetX));
CGPathAddLineToPoint(path, NULL, x, y);
}
CGPathAddLineToPoint(path, NULL, width, height);
CGPathAddLineToPoint(path, NULL, 0, height);
CGPathCloseSubpath(path);
self.waveShapeLayer.path = path;
CGPathRelease(path);
}
- (void)stopWave{
[UIView animateWithDuration:1.0f animations:^{
self.alpha = 0.0f;
} completion:^(BOOL finished) {
[_waveDisplayLink invalidate];
_waveDisplayLink = nil;
_waveShapeLayer.path = nil;
self.alpha = 1.0f;
}];
}
@end