zoukankan      html  css  js  c++  java
  • iOS开发分析"秘密"App内容页面的效果(两)

                 @我前几天写的"秘密"的Cell制品的效果,想要的效果还是有差距,并且扩展性非常不好,于是重写封装,把总体视图都放到scrollView中,基本是和secret app 一模一样的效果了.

                 @代码例如以下:(模糊效果的类就不写了,大家能够搜"UIImage+ImageEffects",还要导入Accelerate.framework)

    1.MTSecretAppEffect.h

    #import <Foundation/Foundation.h>
    
    @interface MTSecretAppEffect : NSObject
    
    /**
     *  创建总体的scrollView,把headScrollView和tableView所有载入在上面,靠它来上下滑动,其余的滑动所有禁止
     *
     *  @return mainScrollView
     */
    - (UIScrollView *)createMainScrollView;
    
    /**
     *  创建headScrollView
     *
     *  @return headScrollView
     */
    - (UIScrollView *)createHeadScrollView;
    
    /**
     *  创建头部的模糊view
     *
     *  @param scrollview headScrollView
     *
     *  @return blurImageView
     */
    - (UIImageView *)createBlurImageViewOfView:(UIScrollView *)scrollview;
    
    /**
     *  在- (void)scrollViewDidScroll:(UIScrollView *)scrollView 中调用的方法
     *
     *  @param scrollView
     *  @param mainScrollView
     *  @param tableView
     *  @param headScrollView
     *  @param blurImageView
     */
    - (void)scrollDidScrollView:(UIScrollView *)scrollView withMainScrollView:(UIScrollView *)mainScrollView withTableView:(UITableView *)tableView withHeadScrollView:(UIScrollView *)headScrollView withBlurImageView:(UIImageView *)blurImageView;
    @end
    

    2.MTSecretAppEffect.m

    #import "MTSecretAppEffect.h"
    #import "UIImage+ImageEffects.h"
    #import <QuartzCore/QuartzCore.h>
    
    #define HEADER_HEIGHT 200.0f
    #define HEADER_INIT_FRAME CGRectMake(0, 0, 320, HEADER_HEIGHT)
    
    const CGFloat kBarHeight = 50.0f;
    const CGFloat kBackgroundParallexFactor = 0.5f;
    const CGFloat kBlurFadeInFactor = 0.015f;
    
    
    @implementation MTSecretAppEffect
    
    // 欠缺:调用者设置代理
    - (UIScrollView *)createMainScrollView{
    
        // 和Self.view同大小的底部ScrollView
        UIScrollView *mainScrollView = [[UIScrollView alloc] initWithFrame:[UIApplication sharedApplication].keyWindow.frame];
        mainScrollView.bounces = YES;
        mainScrollView.alwaysBounceVertical = YES;
        mainScrollView.contentSize = CGSizeZero;
        mainScrollView.showsVerticalScrollIndicator = YES;
        mainScrollView.scrollIndicatorInsets = UIEdgeInsetsMake(50.0f, 0, 0, 0);
    
        return mainScrollView;
        
    }
    
    - (UIScrollView *)createHeadScrollView{
    
        UIScrollView *headScrollView = [[UIScrollView alloc] initWithFrame:HEADER_INIT_FRAME];
        headScrollView.scrollEnabled = NO;
        headScrollView.contentSize = CGSizeMake(320, 1000);
        
        return headScrollView;
    }
    
    - (UIImageView *)createBlurImageViewOfView:(UIScrollView *)scrollview{
    
        UIGraphicsBeginImageContextWithOptions(scrollview.bounds.size, scrollview.opaque, 0.0);
        [scrollview.layer renderInContext:UIGraphicsGetCurrentContext()];
        UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
        UIImageView *blurImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 320, HEADER_HEIGHT)];
        blurImageView.image = [img applyBlurWithRadius:12 tintColor:[UIColor colorWithWhite:0.8 alpha:0.4] saturationDeltaFactor:1.8 maskImage:nil];
        blurImageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
        blurImageView.alpha = 0;
        blurImageView.backgroundColor = [UIColor clearColor];
        
        return blurImageView;
    }
    
    - (void)scrollDidScrollView:(UIScrollView *)scrollView withMainScrollView:(UIScrollView *)mainScrollView withTableView:(UITableView *)tableView withHeadScrollView:(UIScrollView *)headScrollView withBlurImageView:(UIImageView *)blurImageView{
        
        CGFloat y = 0.0f;
        CGRect rect = HEADER_INIT_FRAME; 
        if (scrollView.contentOffset.y < 0.0f) {
            // 下拉变大效果
            y = fabs(MIN(0.0f, mainScrollView.contentOffset.y));
            headScrollView.frame = CGRectMake(CGRectGetMinX(rect) - y / 2.0f, CGRectGetMinY(rect) - y, CGRectGetWidth(rect) + y, CGRectGetHeight(rect) + y);
            
        }
        else {
            
            y = mainScrollView.contentOffset.y;
            blurImageView.alpha = MIN(1 , y * kBlurFadeInFactor);
            CGFloat backgroundScrollViewLimit = headScrollView.frame.size.height - kBarHeight;
            
            if (y > backgroundScrollViewLimit) {
                headScrollView.frame = (CGRect) {.origin = {0, y - headScrollView.frame.size.height + kBarHeight}, .size = {320, HEADER_HEIGHT}};
                tableView.frame = (CGRect){.origin = {0, CGRectGetMinY(headScrollView.frame) + CGRectGetHeight(headScrollView.frame)}, .size = tableView.frame.size };
                tableView.contentOffset = CGPointMake (0, y - backgroundScrollViewLimit);
                CGFloat contentOffsetY = -backgroundScrollViewLimit * kBackgroundParallexFactor;
                [headScrollView setContentOffset:(CGPoint){0,contentOffsetY} animated:NO];
            }
            else {
                headScrollView.frame = rect;
                tableView.frame = (CGRect){.origin = {0, CGRectGetMinY(rect) + CGRectGetHeight(rect)}, .size = tableView.frame.size };
                [tableView setContentOffset:(CGPoint){0,0} animated:NO];
                [headScrollView setContentOffset:CGPointMake(0, -y * kBackgroundParallexFactor)animated:NO];
            }
        }
    
    }
    
    @end

    3.main.m

    #import "RootViewController.h"
    #import "CommentCell.h"
    #import "MTSecretAppEffect.h"
    
    #define HEADER_HEIGHT 200.0f
    
    @interface RootViewController () <UIScrollViewDelegate, UITableViewDataSource, UITableViewDelegate>
    
    @property (nonatomic,strong) MTSecretAppEffect *secretEffect;     // secretApp 效果对象
    @property (nonatomic,strong) UIScrollView *mainScrollView;        // 与view同样大小的scrollView
    @property (nonatomic,strong) UIScrollView *headScrollView;        //
    @property (nonatomic,strong) UIImageView  *blurImageView;         //
    @property (nonatomic,strong) UITableView *tableView;              //
    
    @end
    
    @implementation RootViewController
    
    - (void)viewDidLoad
    {
        [super viewDidLoad];
    	
        
        // 0.创建SecretApp effect 效果对象
        self.secretEffect = [[MTSecretAppEffect alloc] init];
        // 1.主底部scrollView
        self.mainScrollView = [self.secretEffect createMainScrollView];
        self.mainScrollView.delegate = self;
        self.view = self.mainScrollView;
        // 2.head背景View
        self.headScrollView = [self.secretEffect createHeadScrollView];
        // 3.背景图片视图
        UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 320, HEADER_HEIGHT)];
        imageView.image = [UIImage imageNamed:@"secret.png"];
        imageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
        [self.headScrollView  addSubview:imageView];
        // 4.模糊视图
        _blurImageView = [self.secretEffect createBlurImageViewOfView:self.headScrollView];
        [self.headScrollView addSubview:_blurImageView];
        // 5.tableView
        self.tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, HEADER_HEIGHT, CGRectGetWidth(self.view.frame), CGRectGetHeight(self.view.frame) - 50 ) style:UITableViewStylePlain];
        self.tableView.scrollEnabled = NO;
        self.tableView.delegate = self;
        self.tableView.dataSource = self;
        self.tableView.tableFooterView = [[UIView alloc] initWithFrame:CGRectZero];
        self.tableView.separatorColor = [UIColor clearColor];
        // 6.加入视图
        [self.view addSubview:self.headScrollView];
        [self.view addSubview:self.tableView];
        // 7.设置一下
        self.mainScrollView.contentSize = CGSizeMake(320, self.tableView.contentSize.height + CGRectGetHeight(self.headScrollView.frame));
    
    }
    
    - (void)scrollViewDidScroll:(UIScrollView *)scrollView {
        
        // 8.调用方法
        [self.secretEffect scrollDidScrollView:scrollView withMainScrollView:self.mainScrollView withTableView:self.tableView withHeadScrollView:self.headScrollView withBlurImageView:self.blurImageView];
    }
    
    
    #pragma mark - 隐藏状态栏
    - (BOOL)prefersStatusBarHidden {
        return YES;
    }
    
    
    #pragma mark - UITableView dataSource
    
    - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
        return 1;
    }
    
    - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
        return 20;
    }
    
    - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
        
        return 40;
    }
    
    - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
        
        CommentCell *cell = [tableView dequeueReusableCellWithIdentifier:[NSString stringWithFormat:@"Cell %ld", indexPath.row]];
        if (!cell) {
            cell = [[CommentCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:[NSString stringWithFormat:@"Cell %ld", indexPath.row]];
        }
        cell.textLabel.text = [NSString stringWithFormat:@"section = %ld row = %ld",indexPath.section,indexPath.row];
    
        return cell;
    }
    
    - (void)didReceiveMemoryWarning
    {
        [super didReceiveMemoryWarning];
        // Dispose of any resources that can be recreated.
    }
    
    @end
    
                     @效果图:




    版权声明:本文博客原创文章,博客,未经同意,不得转载。

  • 相关阅读:
    微服务-分布式事务解决方案
    Python cannot import name 'Line' from 'pyecharts'
    powershell 基础
    Linux SSH config
    神奇的Python代码
    GitHub 中 readme 如何添加图片
    Linux 笔记(自用)
    Anaconda 安装 TensorFlow ImportError:DLL加载失败,错误代码为-1073741795
    Ubuntu 分辨率更改 xrandr Failed to get size of gamma for output default
    Git入门教程 Git教程入门
  • 原文地址:https://www.cnblogs.com/zfyouxi/p/4729231.html
Copyright © 2011-2022 走看看