ScrollView的基础使用方法以及多图的循环滚动和缩放

来源:互联网 发布:万众创新 大众创业知乎 编辑:程序博客网 时间:2024/05/18 02:12

UIScrollView滚动视图的基本属性和缩放使用


1. 初始化:设置位置,View的长度和宽度背景色以及滚动区域                              

     initWithFrame:CGRectMake(x, y, width, height),

     setContentSize:CGSizeMake(width, height),设置背景颜色:backGroundColor:(UIColor),设定滚动区域大小:contentSize


2. 滚动方向:

    (1). 水平滚动:showsHorizontalScrollIndicator:BOOL

    (2). 垂直滚动:showsVerticalScrollIndicator:BOOL

    (3). 水平滚动遇边界是否弹回:alwaysBounceHorizontal:BOOL

    (4). 垂直滚动遇边界是否弹回:alwaysBounceVertical:BOOL

3. 是否能拖拽:scrollEnabled:BOOL

4. 全屏滚动:pagingEnabled = BOOL

5. 遇到边界是否弹回:bounces = BOOL

6. 设置偏移量: 正数向右偏移,负数向左偏移 

      contentOffset:CGPointMake(x, y)

7. 设置视图的放大和缩小

    (1).  最小比例:minimumZoomScale

    (2).  最大比例:maximumZoomScale

    (3).  缩放方法:返回值是要被缩放的View

           - (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView;


UIPageControl分页控件  


1. 初始化方法和滚动视图的初始化方式一样,在设置的时候要对其初始坐标以及长度宽度设置。

2. 设置背景颜色和滚动视图一样

3. 设置页数:numberOfPages:(int)

4. 设置换页点击事件:根据页编号的改变控制(UIControlEventValueChanged)

     在点击事件的Action中需要给视图设置偏移量

5.  设置是否开启动画:animated:BOOL


ScrollView中多张照片进行循环和缩放

  除了上面我为大家总结的ScrollView的一些基本使用属性和方法之外,ScrollView内多张照片的循环滚动,以及每张照片的缩放也是一个亮点。

  下面是我自己根据自己的尝试得到的一些心得,希望能够帮到大家。

关于多张照片的循环滚动:毫无以为如果要想使照片能够循环滚动就要无缝隙的逐次滚动,根据上面的偏移量属性对每个页面进行判断。

关于对每张照片进行缩放:通常我们在使用ScrollView的时候创建一个scrollView即可,可是在储存多张照片的时候,我们就要考虑到缩放每张照片的时候其他照片会不会因为位置大小关系出现重叠覆盖等状况。所以我的思路是创建两个ScrollView大的ScrollView控制小的ScrollView,小的ScrollView内存放着多张照片,并且对照片进行缩放操作,大的ScrollView只需要控制小的ScrollView,这样分层操作,会有效的防止上面我所说的出现重叠,覆盖,找不到放大照片的情况。下面是我测试这些功能时候的代码,希望能够帮到大家。


- (void)viewDidLoad

{

    [superviewDidLoad];

    // Do any additional setup after loading the view.

    self.scroll = [[UIScrollViewalloc]initWithFrame:CGRectMake(0,0, 320,528)];

    _scroll.backgroundColor = [UIColorpurpleColor];

   _scroll.delegate =self;

    [_scrollsetContentSize:CGSizeMake(_scroll.frame.size.width*5 + 80, 528)];

    //scroll属性

   

    [_scrollsetPagingEnabled:YES];//是否整屏翻动

    [_scrollsetScrollEnabled:YES];//判断控件是否能够滚动

    [_scrollsetShowsHorizontalScrollIndicator:YES];//控制是否显示水平方向的滚动条

    

    _scroll.maximumZoomScale =2.0;

    _scroll.minimumZoomScale =0.2;

 

    [self.viewaddSubview:_scroll];

    [_scrollrelease];

    //屏幕左上角距离坐标原点的偏移量

    //[_scroll setContentOffset:CGPointMake(320, 0)];

    

   for (int i =0; i < 5; i++) {

       NSString *name = [NSStringstringWithFormat:@"美女%d.jpg",i +1];

       UIImage *image = [UIImageimageNamed:name];

       UIImageView *imageView = [[UIImageViewalloc]initWithImage:image];

        [imageViewsetFrame:CGRectMake(0,0, 320, 528)];

        

       UIScrollView * sc = [[UIScrollViewalloc]initWithFrame:CGRectMake(i *320, 0, 320, 528)];

        sc.delegate =self;

        

        sc.maximumZoomScale =2.0;

        sc.minimumZoomScale =0.2;

        

        [scaddSubview:imageView];

        [imageViewrelease];

        [_scrolladdSubview:sc];

        [screlease];

        

    }

    self.page = [[UIPageControlalloc]initWithFrame:CGRectMake(0,528, 320, 40)];

    _page.numberOfPages =5;

    [_pagesetBackgroundColor:[UIColorblackColor]];

    [_pagesetAlpha:0.2];

    [_pageaddTarget:selfaction:@selector(pageAction:)forControlEvents:UIControlEventValueChanged];

    [self.viewaddSubview:_page];

    [_pagerelease];

    

}


- (void)pageAction:(id)sender{

   UIPageControl *pageControl = (UIPageControl *)sender;

    NSLog(@"page == %d",pageControl.currentPage);

    [_scrollsetContentOffset:CGPointMake(pageControl.currentPage *_scroll.frame.size.width,0) animated:NO];

}

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

    //根据偏移量设置页面

    _page.currentPage = scrollView.contentOffset.x /self.scroll.frame.size.width;

      NSLog(@"currentpage == %.2f",scrollView.contentOffset.x);

   if (scrollView.contentOffset.x >1300) {

      [scrollView setContentOffset:CGPointMake(0,0)];

    }elseif(scrollView.contentOffset.x <0){

        [scrollViewsetContentOffset:CGPointMake(1280,0)];

    }

}

    //对照片进行缩放的方法

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{

   return [scrollView.subviewsfirstObject];

}




0 0
原创粉丝点击