• 轻量级应用开发之(04)UIScrollView-1


      本文是我在学习OC中的一些经验总结,在学习中总结了常用的Mac技巧,欢迎群友对本文提出意见,如有问题请联系我。

    一 什么是UIScrollView

    1)移动设备的屏幕大小是极其有限的,因此直接展示在用户眼前的内容也相当有限

    2)当展示的内容较多,超出一个屏幕时,用户可通过滚动手势来查看屏幕以外的内容

    3)普通的UIView不具备滚动功能,不适合显示过多的内容

    4)UIScrollView是一个能够滚动的视图控件,可以用来展示大量的内容,并且可以通过滚动查看所有的内容

    二 UIScrollView的用法

    1)将需要展示的内容添加到UIScrollView中

    2)设置UIScrollView的contentSize属性,告诉UIScrollView所有内容的尺寸,也就是告诉它滚动的范围(能滚多远,滚到哪里是尽头)

     1 #import "ViewController.h"
     2 
     3 @interface ViewController ()
     4 
     5 @property (weak, nonatomic) IBOutlet UIScrollView *scrollView;
     6 
     7 @end
     8 
     9 @implementation ViewController
    10 
    11 - (void)viewDidLoad {
    12     [super viewDidLoad];
    13    
    14     self.scrollView.contentSize = CGSizeMake(self.scrollView.frame.size.width, 500);
    15     
    16 }
    17 
    18 @end

    第14行: 表示UIScrollView只能纵向滚动,不能横向滚动。

    三 UIScrollView的常见属性

    1)@property(nonatomic) CGPoint contentOffset; 

    这个属性用来表示UIScrollView滚动的位置(其实就是内容左上角与scrollView左上角的间距值

    2)@property(nonatomic) CGSize contentSize; 

    这个属性用来表示UIScrollView内容的尺寸,滚动范围(能滚多远)

    3)@property(nonatomic) UIEdgeInsets contentInset; 

    这个属性能够在UIScrollView的4周增加额外的滚动区域,一般用来避免scrollView的内容被其他控件挡住

    4)隐藏水平滚动条

    scrollView.showsHorizontalScrollIndicator = NO;
    scrollView.showsVerticalScrollIndicator = NO;

    5) 去掉弹簧效果

    scrollView.bounces = NO;

    例子:在UIScrollView里加一个UIImageView

    1 UIImageView * imageView = [[UIImageView alloc ]init];
    2 UIImage * image = [UIImage imageNamed:@"001"];
    3 imageView.image =  image;
    4 imageView.frame = CGRectMake(0, 0, image.size.width, image.size.height);
    5 [self.scrollView addSubview: imageView];
    6 self.scrollView.contentSize = CGSizeMake(image.size.width, image.size.height);

    以上代码等同于以下代码的效果。

    1 UIImageView * imageView = [[UIImageView alloc ]initWithImage: [UIImage imageNamed:@"001"] ]  ;
    2 [self.scrollView addSubview: imageView];
    3 self.scrollView.contentSize = imageView.frame.size;

     UIKit 坐标体系

       在UIKit坐标体系中,在X轴往右,X值增加。在Y轴往下,Y值增加。

    contentOffset偏移量

    1)与UIKit坐标体系正好相反,往左边移X轴增加,往上边移Y轴增加。 

    2)contentOffset的计算方式:内容的左上角和ScrollView的左上角的X&Y的差值,差值就有正负;和UIKit的坐标系正好相反。

    例子:通过左,右,上,下 按钮移动图片 

     1 //图片向左边移动
     2 - (IBAction)left:(id)sender {
     3     self.scrollView.contentOffset = CGPointMake(0, self.scrollView.contentOffset.y );
     4     
     5 }
     6 
     7 //图片向右边移动
     8 - (IBAction)right:(id)sender {
     9     CGFloat offSetX = self.scrollView.contentSize.width - self.scrollView.frame.size.width;
    10     self.scrollView.contentOffset = CGPointMake( offSetX , self.scrollView.contentOffset.y  );
    11 }
    12 
    13 //图片向上边移动
    14 - (IBAction)top:(id)sender {
    15    self.scrollView.contentOffset = CGPointMake( self.scrollView.contentOffset.x, 0 );
    16 }
    17 
    18 //图片向下边移动
    19 - (IBAction)bottom:(id)sender {
    20     CGFloat offSetY = self.scrollView.contentSize.height - self.scrollView.frame.size.height;
    21     self.scrollView.contentOffset = CGPointMake( self.scrollView.contentOffset.x, offSetY);
    22 }

    四 动画

    设置动画效果

    [UIView beginAnimations:nil context:nil ];
    [UIView setAnimationDuration:1.5];
        
    //自定义动作 。。。
    
    [UIView commitAnimations];
  • 相关阅读:
    eslint 的 env 配置是干嘛使的?
    cookie httpOnly 打勾
    如何定制 antd 的样式(theme)
    剑指 Offer 66. 构建乘积数组
    剑指 Offer 65. 不用加减乘除做加法
    剑指 Offer 62. 圆圈中最后剩下的数字
    剑指 Offer 61. 扑克牌中的顺子
    剑指 Offer 59
    剑指 Offer 58
    剑指 Offer 58
  • 原文地址:https://www.cnblogs.com/wangshuo1/p/5342739.html
Copyright © 2020-2023  润新知