UINavigationController中UINavigationBar的透明例子(三)

在上一篇文章有介绍 导航控制器的组成,是有3部分,这里不再重复

可以点击这里查看
今天主要说的是 在个人信息页,常用的一个小例子,其中用的 导航条透明,黑线的处理

效果图:

从效果图中,我们知道,tableView ,UIimageView是同层级的

注意:其中的tableView,imageView(钢铁侠)都是以superView的top部,并不是安全区域,不然的话 看不到效果,而且导航条是半透明的状态,这是因为 安全区域的作用影响

1 - 基础设置布局

- (void)viewDidLoad {
    [super viewDidLoad];
    //导航条透明,设置一个透明的背景图片或者一个nil image
    [self.navigationController.navigationBar setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault];
    //去除黑线
    [self.navigationController.navigationBar setShadowImage:[[UIImage alloc] init]];
    
    //去除黑线
 //self.navigationController.navigationBar.clipsToBounds = YES;
    self.automaticallyAdjustsScrollViewInsets = NO;
    //
    self.tableView.contentInset = UIEdgeInsetsMake(244, 0, 0, 0);
   
}

2 - tableView的代理方法

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    
    
    return 20;
}



- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    
    static NSString *ID = @"cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:ID];
    }
    
    cell.textLabel.text = [NSString stringWithFormat:@"%zd",indexPath.row];
    
    return cell;
    
}

3- 核心代码 监听 UIScrollView的代理方法
UIImageView(钢铁侠 200的高度),View(粉色 44的高度)

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    
    //计算便宜量(向上滑动的距离)  (-244 是 imageview 和 View的高度)
    //当你使用 self.tableView.contentInset 会调用一次这个方法
    CGFloat offset = scrollView.contentOffset.y - (-244);
    //计算 图片向上移动的H(image的高度 减去 偏移量 )
    CGFloat h =  200 - offset;
    if (h < 64) {
        h = 64;
    }
    
    //g赋值
    self.imageViewConstrain.constant = h;
    //比例计算
    CGFloat alpha = offset/(200.0 - 64.0);
    
    if (alpha >= 1) {
        alpha = 0.99;
       
    }
    
    
    UIColor *navColor = [UIColor colorWithWhite:1 alpha:alpha];
    UIImage *navImage = [self imageWithColor:navColor];
    [self.navigationController.navigationBar setBackgroundImage:navImage forBarMetrics:UIBarMetricsDefault];
}


//绘制一张图片
- (UIImage *)imageWithColor:(UIColor *)color{
    //描述一个矩形
    CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
    //开启上下文
    UIGraphicsBeginImageContext(rect.size);
    //获取到上下文
    CGContextRef context = UIGraphicsGetCurrentContext();
    //渲染颜色
    CGContextSetFillColorWithColor(context, [color CGColor]);
    CGContextFillRect(context, rect);
    
    //获取到图片
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    //关闭
    UIGraphicsEndImageContext();
    
    
    return image;
    
}