iOS头部渐变的表格视图设计(二)

简介: iOS头部渐变的表格视图设计

.m文件中实现的代码如下:

import "YHBaseHeaderAnimatedViewController.h"

@interface YHBaseHeaderAnimatedViewController ()
{

//承载视图
UIView * _privteBGHeaderView;
//宽高比例
CGFloat _privteRate;
//原始宽高
CGFloat _privteOriWidth;
CGFloat _privteOriHeught;
UIVisualEffectView * _blurView;
UINavigationBar * _naviBar;

}
@end

@implementation YHBaseHeaderAnimatedViewController

  • (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    self.edgesForExtendedLayout = UIRectEdgeNone;
    _tableView = [[UITableView alloc]initWithFrame:self.view.frame style:UITableViewStylePlain];
    [self.view addSubview:_tableView];
    _tableView.delegate=self;
    _tableView.dataSource=self;
    [self YHCreatView];
    // Do any additional setup after loading the view.

}

  • (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.

}
//对导航进行处理
-(void)viewWillAppear:(BOOL)animated{

[super viewWillAppear:animated];
if (self.navigationController) {
    [self.navigationController setNavigationBarHidden:YES animated:YES];
    [self showNavigationBar];
}

}
-(void)viewWillDisappear:(BOOL)animated{

[super viewWillDisappear:animated];
if (self.navigationController) {
    [self.navigationController setNavigationBarHidden:NO animated:YES];
}

}
-(void)showNavigationBar{

if (_naviBar==nil) {
    _naviBar = [[UINavigationBar alloc]init];
    [self.view addSubview:_naviBar];
    _naviBar.frame = CGRectMake(0, 0, self.view.frame.size.width, 64);
    [_naviBar setBackgroundImage:[UIImage imageNamed:@"clear"] forBarMetrics:UIBarMetricsDefault];
    [_naviBar setShadowImage:[UIImage imageNamed:@"clear"]];
    _naviBar.backgroundColor = [UIColor colorWithRed:1 green:1 blue:1 alpha:0];
    UINavigationItem * item = [[UINavigationItem alloc]initWithTitle:self.title];
    _naviBar.items = @[item];
    item.leftBarButtonItem = [[UIBarButtonItem alloc]initWithTitle:@"返回" style:UIBarButtonItemStyleDone target:self action:@selector(popToLast)];
}
if (self.animatedHeaderView==nil) {
    _naviBar.hidden=YES;
}else{
    _naviBar.hidden=NO;
}

}
-(void)popToLast{

[self.navigationController popViewControllerAnimated:YES];

}
-(void)YHCreatView{

if (self.maxScrollOffset==0) {
    self.maxScrollOffset=40;
}
if (self.minAlpha==0) {
    self.minAlpha = 0.5;
}
if (self.maxBluer==0) {
    self.maxBluer = 1;
}
_privteBGHeaderView = [[UIView alloc]init];
_privteBGHeaderView.backgroundColor = [UIColor clearColor];
self.tableView.backgroundColor = [UIColor clearColor];
_blurView = [[UIVisualEffectView alloc]initWithEffect:[UIBlurEffect effectWithStyle:UIBlurEffectStyleLight]];
[self reloadAnimatedView];

}

-(void)reloadAnimatedView{

CGFloat viewH=0;
CGFloat aniH=0;
for (UIView * view in _privteBGHeaderView.subviews) {
    [view removeFromSuperview];
}
if (self.tableHeaderView) {
    viewH = viewH+self.tableHeaderView.bounds.size.height;
    [_privteBGHeaderView addSubview:self.tableHeaderView];
}
if (self.animatedHeaderView) {
    _privteRate = self.animatedHeaderView.frame.size.width/self.animatedHeaderView.frame.size.height;
    [self.animatedHeaderView addSubview:_blurView];
    _blurView.frame= self.animatedHeaderView.bounds;
    _blurView.alpha=0;
    _privteOriWidth = self.animatedHeaderView.frame.size.width;
    _privteOriHeught = self.animatedHeaderView.frame.size.height;
    if (self.headerHeight!=0) {
        viewH+=self.headerHeight;
        aniH = self.headerHeight;
    }else{
        viewH+=self.view.frame.size.width/self.animatedHeaderView.bounds.size.width*self.animatedHeaderView.frame.size.height;
        aniH = self.animatedHeaderView.bounds.size.height;
    }
    [self.view insertSubview:self.animatedHeaderView atIndex:0];
}
self.tableHeaderView.frame=CGRectMake(0, aniH, self.tableHeaderView.frame.size.width, self.tableHeaderView.frame.size.height);
_privteBGHeaderView.frame=CGRectMake(0, 0, self.view.frame.size.width, viewH);
self.tableView.tableHeaderView = _privteBGHeaderView;

}
-(void)setAnimatedHeaderView:(UIView *)animatedHeaderView{

if (animatedHeaderView==nil) {
    if (_animatedHeaderView) {
        [_animatedHeaderView removeFromSuperview];
    }
}
_animatedHeaderView = animatedHeaderView;

}
-(void)setMinAlpha:(CGFloat)minAlpha{

if (minAlpha<=0) {
    minAlpha=0.001;
}
if (minAlpha>=1) {
    minAlpha=0.999;
}
_minAlpha=minAlpha;

}
-(void)setMaxBluer:(CGFloat)maxBluer{

if (maxBluer<=0) {
    maxBluer = 0.001;
}
if (maxBluer>=1) {
    maxBluer = 0.999;
}
_maxBluer = maxBluer;

}
-(void)setNaviColor:(UIColor *)naviColor{

_naviColor = naviColor;
_naviBar.backgroundColor = naviColor;

}
-(void)setLeftBarButtons:(NSArray *)leftBarButtons{

_naviBar.topItem.leftBarButtonItems = leftBarButtons;
_leftBarButtons = leftBarButtons;

}
-(void)setRightBarButtons:(NSArray *)rightBarButtons{

_naviBar.topItem.rightBarButtonItems = rightBarButtons;
_rightBarButtons = rightBarButtons;

}
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{

if (self.animatedHeaderView==nil) {
    return;
}
if (self.tableView==scrollView) {
    //获取到偏移量 默认两倍
    CGFloat offset = scrollView.contentOffset.y*2;
    //如果小于0 则进行形变拉伸操作
    if (offset<=0) {
        
        if (offset<-self.maxScrollOffset*2) {
           
        }else{
            CGFloat height = _privteOriHeught+abs((int)offset);
            CGFloat width = height*_privteRate;
            self.animatedHeaderView.frame = CGRectMake(self.view.frame.size.width/2-width/2, offset/2, width, height);
        }
        if (_naviBar) {
            if (_naviBar.shadowImage==nil) {
                 [_naviBar setShadowImage:[UIImage imageNamed:@"clear"]];
            }
        }
    }else{
        //如果大于零 进行推出操作
        if (self.animatedlevel==YHBaseHeaderAnimatedLevelSlow) {
            //慢速
            self.animatedHeaderView.frame = CGRectMake(0, -offset/8, self.animatedHeaderView.frame.size.width, self.animatedHeaderView.frame.size.height);
        }else if(self.animatedlevel==YHBaseHeaderAnimatedLevelFast){
            //快速
            self.animatedHeaderView.frame = CGRectMake(0, -offset/2, self.animatedHeaderView.frame.size.width, self.animatedHeaderView.frame.size.height);
        }else{
            //正常
            self.animatedHeaderView.frame = CGRectMake(0, -offset/4, self.animatedHeaderView.frame.size.width, self.animatedHeaderView.frame.size.height);
        }
        //进行渐隐动画处理
        CGFloat tmp = offset/2/_privteOriHeught;
        if (self.alphaAnimated) {
            self.animatedHeaderView.alpha = 1-(1-self.minAlpha)*tmp;
        }
        //进行模糊动画
        if (self.bluerAnimated) {
            _blurView.alpha = self.maxBluer*tmp;
        }
        //进行导航显示
        if (_naviBar) {
            _naviBar.backgroundColor = [_naviBar.backgroundColor colorWithAlphaComponent:tmp];
            if (_naviBar.shadowImage) {
                [_naviBar setShadowImage:nil];
            }
            
        }
    }
    
   
}

}
@end

在使用时,创建一个视图控制器继承于它,在其viewDidLoad方法中进行一些简单的设置即可,如下:
  • (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    //设置头图
    UIImageView * imageView = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 200)];
    imageView.image = [UIImage imageNamed:@"image"];
    self.animatedHeaderView = imageView;
    //设置tableView的头视图
    UILabel * label = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 30)];
    label.backgroundColor = [UIColor purpleColor];
    label.textColor = [UIColor whiteColor];
    label.textAlignment =NSTextAlignmentCenter;
    label.text = @"下面进行功能演示";
    self.tableHeaderView = label;
    [self reloadAnimatedView];

}

我写了一个完整的演示Demo,Demo中有完整的功能演示,需要的朋友可以自行下载:http://pan.baidu.com/s/1c1VKT00。
目录
相关文章
|
iOS开发
ios贝塞尔曲线表格视图
x轴和y轴都是可自定义,曲线的值也是对应的值
105 0
|
iOS开发
iOS开发-加在透明视图上的控件会透明
iOS开发-加在透明视图上的控件会透明
161 0
|
前端开发 小程序 数据处理
iOS上传图片视图的封装:用法 【下篇】
iOS上传图片视图的封装:用法 【下篇】
262 0
iOS上传图片视图的封装:用法 【下篇】
|
前端开发 API 数据处理
iOS小知识:封装上传图片视图(支持删除和添加)
iOS小知识:封装上传图片视图(支持删除和添加)
241 0
iOS小知识:封装上传图片视图(支持删除和添加)
|
安全 iOS开发
iOS 筛选视图的隐藏方案
iOS 筛选视图的隐藏方案
175 0
iOS 筛选视图的隐藏方案
|
监控 iOS开发
iOS视图置顶方案
iOS视图置顶方案
185 0
iOS视图置顶方案
|
API 开发工具 iOS开发
iOS视图置顶的应用:适配iOS12系统上日期控件被筛选视图遮挡问题
iOS视图置顶的应用:适配iOS12系统上日期控件被筛选视图遮挡问题
217 0
iOS视图置顶的应用:适配iOS12系统上日期控件被筛选视图遮挡问题
|
开发工具 iOS开发 git
iOS订单折扣视图应用于购物车界面(支持添加/删除/选择折扣)
iOS订单折扣视图应用于购物车界面(支持添加/删除/选择折扣)
164 0
iOS订单折扣视图应用于购物车界面(支持添加/删除/选择折扣)
|
iOS开发
iOS支持展开折叠的弹出菜单(水平方向弹出菜单视图) 【修订版】
iOS支持展开折叠的弹出菜单(水平方向弹出菜单视图) 【修订版】
494 0
iOS支持展开折叠的弹出菜单(水平方向弹出菜单视图) 【修订版】
|
iOS开发
iOS支持展开折叠的弹出菜单(水平方向弹出菜单视图)
iOS支持展开折叠的弹出菜单(水平方向弹出菜单视图)
263 0
iOS支持展开折叠的弹出菜单(水平方向弹出菜单视图)

热门文章

最新文章

  • 1
    【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
  • 2
    iOS|解决 setBrightness 调节屏幕亮度不生效的问题
  • 3
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
  • 4
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
  • 5
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
  • 6
    Cellebrite UFED 4PC 7.71 (Windows) - Android 和 iOS 移动设备取证软件
  • 7
    iOS各个证书生成细节
  • 8
    uniapp云打包ios应用证书的获取方法,生成指南
  • 9
    iOS|记一名 iOS 开发新手的前两次 App 审核经历
  • 10
    【iOS-cocos2d-X 游戏开发之十】自定义各类模版&触屏事件讲解!
  • 1
    uniapp云打包ios应用证书的获取方法,生成指南
    27
  • 2
    iOS|解决 setBrightness 调节屏幕亮度不生效的问题
    117
  • 3
    iOS|记一名 iOS 开发新手的前两次 App 审核经历
    20
  • 4
    iOS各个证书生成细节
    35
  • 5
    【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
    158
  • 6
    Cellebrite UFED 4PC 7.71 (Windows) - Android 和 iOS 移动设备取证软件
    55
  • 7
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    73
  • 8
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    54
  • 9
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
    65
  • 10
    uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
    172