• ios开发UI篇—UIScrollView属性及其代理方法


    一、UIScrollView是什么?

    1、UIScrollView是滚动的view,UIView本身不能滚动,子类UIScrollview拓展了滚动方面的功能。
    2、UIScrollView是所有滚动视图的基类。以后的UITableView,UITextView等视图都是继承于该类。
    使用场景:显示不下(单张大图);内容太多(图文混排);滚动头条(图片);相册等

    二、UIScrollView使用

    1、UIScrollview主要专长于两个方面:
    a、滚动:contentSize大于frame.size的时候,能够滚动。
    b、 缩放:自带缩放,可以指定缩放倍数。
    2、UIScrollView滚动相关属性contentSize
     //定义内容区域大小,决定是否能够滑动
    contentOffset    //视图左上角距离坐标原点的偏移量
    scrollsToTop      //滑动到顶部(点状态条的时候)
    pagingEnabled   //是否整屏翻动
    bounces           //边界是否回弹
    scrollEnabled     //是否能够滚动
    showsHorizontalScrollIndicator //控制是否显示水平方向的滚动条
    showVerticalScrollIndicator       //控制是否显示垂直方向的滚动条
    alwaysBounceVertical           //控制垂直方向遇到边框是否反弹
    alwaysBounceHorizontal       //控制水平方向遇到边框是否反弹
    3、UIScrollView缩放相关属性
    minimumZoomScale  //  缩小的最小比例
    maximumZoomScale   //放大的最大比例
    zoomScale                  //设置变化比例
    zooming                      //判断是否正在进行缩放反弹
    bouncesZoom             //控制缩放的时候是否会反弹
    要实现缩放,还需要实现delegate,指定缩放的视图是谁。
    4.UIScrollView滚动实例应用
    - (void)scrollView{
        // 创建滚动视图,但我们现实的屏幕超过一屏时,就需要滚动视图
        UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.view.frame];
        scrollView.backgroundColor = [UIColor yellowColor];
        scrollView.tag = 1000;
        // 设置滚动区域
        scrollView.contentSize = CGSizeMake(4 * CGRectGetWidth(self.view.frame), self.view.frame.size.height);
        [self.view addSubview:scrollView];
        // 添加子视图
        for (int i = 0; i < 4; i ++) {
            UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(CGRectGetWidth(self.view.frame) * i, 0, CGRectGetWidth(self.view.frame), CGRectGetHeight(self.view.frame))];
            label.text = [NSString stringWithFormat:@"这是%d个视图",i];
            label.font = [UIFont systemFontOfSize:30];
            [scrollView addSubview:label];
            UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:[NSString stringWithFormat:@"%d.jpg",i]]]; // (有四张片分别取名0.jpg,1.jpg,2.jpg.3.jpg)
            [imageView setFrame:self.view.frame];
            [label addSubview:imageView];
    
    //        label.backgroundColor = [UIColor colorWithRed:arc4random()%256/255.0 green:
    //            arc4random()%256/255.0  blue:arc4random()%256/255.0  alpha:1];
            
        }
        // 设置分页效果 (默认值为NO)
        scrollView.pagingEnabled = YES;
        // 设置滚动条是否显示(默认值是YES)
        scrollView.showsHorizontalScrollIndicator = YES;
        // 设置边界是否有反弹效果(默认值是YES)
        scrollView.bounces = YES;
        // 设置滚动条的样式
        scrollView.indicatorStyle = UIScrollViewIndicatorStyleWhite; 
        /*
    indicatorStyle(枚举值)  
       UIScrollViewIndicatorStyleDefault,     //白色
       UIScrollViewIndicatorStyleBlack,       //  黑色
         */
        
        // 设置scrollView的代理
        scrollView.delegate = self; // (记得导入协议代理 <UIScrollViewAccessibilityDelegate>)
    }
    5、UIScrollView滚动代理方法
    // 滚动就会触发
    - (void)scrollViewDidScroll:(UIScrollView *)scrollView
    {    NSLog(@"只有scrollview是跟滚动状态就会调用此方法");
    }
    //开始拖拽时触发
    - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{
        NSLog(@"开始拖拽");
    }
    // 结束拖拽时触发
    - (void)scrollViewDidEndDragging:(UIScrollView *)scrollView  willDecelerate:(BOOL)decelerate{
            NSLog(@"结束拖拽");
    }
    // 开始减速时触发
    - (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView{
            NSLog(@"开始减速");
    }
    // 结束减速时触发(停止)
    - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
            NSLog(@"结束减速(停止)");
    }
    6、UIScrollView缩放实例应用
    - (void)viewDidLoad {
        [super viewDidLoad];
        self.view.backgroundColor = [UIColor orangeColor];
        // 初始化一个scrollView
        UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.view.frame];
        scrollView.backgroundColor = [UIColor greenColor];
        scrollView.delegate = self;
    
        // 设置缩放比率
        // 设置可缩小道德最小比例
        scrollView.minimumZoomScale = 0.5;
        // 设置可放大的最大比例
        scrollView.maximumZoomScale = 2.0;
        [self.view addSubview:scrollView];
    
        // 使得要添加的图片宽高成比例
        UIImage *myImage = [UIImage imageNamed:@"7.jpg"];
        // 得到原始宽高
        float imageWidth = myImage.size.width;
        float imageHeight = myImage.size.height;
        // 这里我们规定imageView的宽为200,根据此宽度得到等比例的高度
        float imageViewWidth = 200;
        float imageViewHeight = 200 *imageHeight/imageWidth;
        // 初始化一个UIimageview
        UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, imageViewWidth, imageViewHeight)];
        // 为imageView设置图片
        imageView.image = myImage;
        // 让imageView居中
        imageView.center = self.view.center;
        imageView.tag = 1000;
        [scrollView addSubview:imageView];
    }

    7、UIScrollView缩放有关的代理

    #pragma mark -- 滚动视图与缩放有关的代理方法
    //指定scrollview的某一个子视图为可缩放视图,前提条件是次视图已经添加到scrollview上面
    -(UIView*)viewForZoomingInScrollView:(UIScrollView *)scrollView{
        UIView *imageView = (UIView*)[scrollView viewWithTag:1000];
        return imageView;
    }
    
    // 开始缩放的代理方法  第二个参数view:这个参数使我们将要缩放的视图(这里就是imageView)
    - (void)scrollViewWillBeginZooming:(UIScrollView *)scrollView withView:(UIView *)view{
        NSLog(@"%@",view);
    }
    
    // 正在缩放的代理方法  只要在缩放就执行该方法,所以此方法会在缩放过程中多次调用
    - (void)scrollViewDidZoom:(UIScrollView *)scrollView{
        // 在缩放过程中为了使得该视图一直在屏幕中间,所以我们需要在他缩放的过程中一直调整他的center
        // 得到scrollview的子视图
        UIImageView *imageView = (UIImageView *)[scrollView viewWithTag:1000];
        // 打印imageView的frame,分析为什么他的位置会改变
      //  NSLog(@"frame -- %@",NSStringFromCGRect(imageView.frame));
        
        // 设置imageview的center,是他的位置一直在屏幕中央
        imageView.center = scrollView.center;
        // 打印contentSize  分析为什么缩放之后会滑动
        NSLog(@"contentSize %@",NSStringFromCGSize(scrollView.contentSize));
    }
    
    // 缩放结束所执行的代理方法
    /**
     *  @ view    当前正在缩放的视图
     *  @ scale  当前正在缩放视图的缩放比例
     */
    - (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale{
        // 缩放完成之后恢复原大小,这里运用到2D仿射变换函数中与捏合有关的函数
        view.transform =CGAffineTransformMakeScale(1, 1);
    }
  • 相关阅读:
    I/O中断处理详细过程
    移动端事件touchstart、touchmove、touchend
    页面刷新整理
    transform:rotate在手机上显示有锯齿的解决方案大全
    CSS3盒模型温故
    CSS3颜色特征温故
    CSS3文本温故
    CSS3背景温故
    怪诞咖啡的简介
    CSS3边框温故
  • 原文地址:https://www.cnblogs.com/jiuyi/p/10346269.html
Copyright © 2020-2023  润新知