UIScrollView（二）

最新推荐文章于 2024-08-11 11:27:03 发布
最新推荐文章于 2024-08-11 11:27:03 发布
阅读量1.4k 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： iOS开发入门到精通 文章标签： UIScrollView
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/liu1347508335/article/details/50538199
本文详细介绍如何使用UIScrollView实现图片浏览功能，包括图片缩放、单击与双击手势冲突解决及无限轮播效果实现。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

先做个小补充，上一篇貌似忘记介绍UIScrollView的缩放功能了，这里正好要给大家介绍使用UIScrollView实现图片浏览，会涉及到缩放的操作，所以就在这里介绍一下吧，此外给图片添加单击双击和长按手势也有一些小问题需要注意，就是单击和双击手势冲突问题，请戳这里：OC同时添加单击和双击手势冲突

先说先缩放吧：

- (void)viewDidLoad {
    [super viewDidLoad];
    //创建滚动视图
    UIScrollView *scrollView = [[[UIScrollView alloc]initWithFrame:[UIScreen mainScreen].bounds]autorelease];
    
    scrollView.contentSize = CGSizeMake(1000, 1000);
    
    //缩小的最小比例
    scrollView.minimumZoomScale = 0.5;
    //放大的最大比例
    scrollView.maximumZoomScale = 2;
    //设置变化比例
    //scrollView.zoomScale = 1;
    //设置delegate
    scrollView.delegate = self;
    
    //添加图片到scrollView上
    UIImageView *imgView = [[[UIImageView alloc]initWithFrame:[UIScreen mainScreen].bounds]autorelease];
    imgView.image = [UIImage imageNamed:@"2.png"];
    imgView.userInteractionEnabled = YES;
    [scrollView addSubview:imgView];
    [self.view addSubview:scrollView];
}

//设定要缩放的视图
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{
    return [scrollView.subviews objectAtIndex:0];
}

//缩放时执行的方法
- (void)scrollViewDidZoom:(UIScrollView *)scrollView{
    
    UIImageView *imgView = (UIImageView *)[scrollView.subviews objectAtIndex:0];
    if (scrollView.zoomScale < 1) {
        imgView.center = self.view.center;
    }else{
        //放大后保证边缘无错误
        CGRect rect = imgView.frame;
        rect.origin = CGPointMake(0, 0);
        imgView.frame = rect;

    }
}

无限轮播在这里（到最后一张图片继续滑动到第一张）：多图片无缝滚动组件封装与使用

下面是UIScrollView复用实现图片浏览（到最后一张图片继续滑动不到第一张）：

#import "ViewController.h"
static int i;
@interface ViewController ()<UIScrollViewDelegate>
@property (nonatomic, strong) UIScrollView *scrollView;
@property (nonatomic, strong) NSMutableArray *imagesArray;
@property (nonatomic, strong) UIImageView *currentImageView;
@property (nonatomic, strong) UIImageView *nextImageView;
@property (nonatomic, strong) UIImageView *preImageView;
@property (nonatomic, strong) UIScrollView *currentScrollView;
@end

@implementation ViewController

- (void)viewDidLoad {

    [super viewDidLoad];
    self.view.backgroundColor = [UIColor blackColor];
    
    _imagesArray = [[NSMutableArray alloc]init];
    for (int i = 1; i <= 5; i++) {
        NSString *str = [NSString stringWithFormat:@"%d", i];
        UIImage *image = [UIImage imageNamed:str];
        [_imagesArray addObject:image];
    }
    
    CGFloat width = self.view.frame.size.width;
    CGFloat height = self.view.frame.size.height;
    
    self.scrollView = [[UIScrollView alloc]init];
    self.scrollView.frame = CGRectMake(0, 0, width, height);
    [self.view addSubview:_scrollView];
    if (_imagesArray.count > 1) {
        [self.scrollView setContentSize:CGSizeMake(width * 2, height)];
    }else{
        [self.scrollView setContentSize:CGSizeMake(width, height)];
    }
    self.scrollView.showsHorizontalScrollIndicator = NO;
    self.scrollView.pagingEnabled = YES;
    self.scrollView.delegate = self;
    self.scrollView.contentOffset = CGPointMake(0, 0);
    self.scrollView.bounces = NO;
    
    self.currentScrollView = [[UIScrollView alloc]init];
    self.currentScrollView.frame = CGRectMake(0, 0, width, height);
    [self.scrollView addSubview:_currentScrollView];
    [self.currentScrollView setContentSize:CGSizeMake(width, height)];
    self.currentScrollView.showsHorizontalScrollIndicator = NO;
    self.currentScrollView.showsVerticalScrollIndicator = NO;
    self.currentScrollView.bouncesZoom = YES;
    self.currentScrollView.backgroundColor = [UIColor clearColor];
    self.currentScrollView.delegate = self;
    self.currentScrollView.minimumZoomScale = 0.8;
    self.currentScrollView.maximumZoomScale = 2;
    self.currentScrollView.scrollEnabled = YES;
    self.currentScrollView.contentOffset = CGPointMake(0, 0);
    self.currentScrollView.bounces = NO;
    self.currentImageView = [[UIImageView alloc]init];
    self.currentImageView.image = [_imagesArray firstObject];
    self.currentImageView.frame = CGRectMake(0, 0, width, height);
    [_currentScrollView addSubview:_currentImageView];
    [self.scrollView addSubview:_currentScrollView];
    self.currentImageView.contentMode = UIViewContentModeScaleAspectFit;
    
    if (_imagesArray.count > 1) {
        self.nextImageView = [[UIImageView alloc]init];
        self.nextImageView.image = _imagesArray[1];
        self.nextImageView.frame = CGRectMake(width, 0, width, height);
        [self.scrollView addSubview:_nextImageView];
        self.nextImageView.contentMode = UIViewContentModeScaleAspectFit;
        
        self.preImageView = [[UIImageView alloc]init];
        self.preImageView.frame = CGRectMake(0, 0, 0, 0);
        [self.scrollView addSubview:_preImageView];
        self.preImageView.image = [_imagesArray firstObject];
        self.preImageView.contentMode =UIViewContentModeScaleAspectFit;
    }
}

- (void)reload{
    CGFloat width = self.view.frame.size.width;
    CGFloat height = self.view.frame.size.height;
    
    if (i == 0) {
        [self.scrollView setContentSize:CGSizeMake(width * 2, height)];
        self.scrollView.contentOffset = CGPointMake(0, 0);
        self.currentScrollView.frame = CGRectMake(0, 0, width, height);
        self.nextImageView.frame = CGRectMake(width, 0, width, height);
        self.preImageView.frame = CGRectMake(0, 0, 0, 0);
    }else if (i == _imagesArray.count - 1){
        [self.scrollView setContentSize:CGSizeMake(width * 2, height)];
        self.scrollView.contentOffset = CGPointMake(width, 0);
        self.currentScrollView.frame = CGRectMake(width, 0, width, height);
        self.nextImageView.frame = CGRectMake(width, 0, 0, 0);
        self.preImageView.frame = CGRectMake(0, 0, width, height);
    }else{
        [self.scrollView setContentSize:CGSizeMake(width * 3, height)];
        self.scrollView.contentOffset = CGPointMake(width, 0);
        self.currentScrollView.frame = CGRectMake(width, 0, width, height);
        self.nextImageView.frame = CGRectMake(width*2, 0, width, height);
        self.preImageView.frame = CGRectMake(0, 0, width, height);
    }
}

#pragma mark - scroll delegate

- (void) scrollViewDidScroll:(UIScrollView *)scrollView{
    int page = i;
    float offset = self.scrollView.contentOffset.x;
    
    if (self.nextImageView.image == nil || self.preImageView.image == nil) {
        //下一张
        if (i <= _imagesArray.count - 1) {
            _nextImageView.image = [self getNextImageByIndex:i];
        }
        //上一张
        if (i >= 0) {
            _preImageView.image = [self getPreImageIndex:i];
        }
    }
    
    if(offset == 0){
        _currentImageView.image = _preImageView.image;
        _preImageView.image = nil;
        i = i - 1;
        if (i <= 0) {
            i = 0;
        }
    }

    if ((offset == scrollView.bounds.size.width * 2) || (offset == scrollView.bounds.size.width && i == 0)) {
        _currentImageView.image = _nextImageView.image;
        _nextImageView.image = nil;
        i = i + 1;
        if (i >= _imagesArray.count) {
            i = (int)_imagesArray.count;
        }
    }
    
    if (i == 0) {
        _currentImageView.image = [_imagesArray firstObject];
    }
    
    if (i != page) {
        [self reload];
    }
}

- (UIImage *)getNextImageByIndex:(NSInteger)index{
    if (index < _imagesArray.count - 1) {
        UIImage *image = _imagesArray[index+1];
        return image;
    }
    return nil;
}

- (UIImage *)getPreImageIndex:(NSInteger)index{
    if (index > 0) {
        UIImage *image = _imagesArray[index-1];
        return image;
    }
    return nil;
}


- (UIView *) viewForZoomingInScrollView:(UIScrollView *)scrollView
{
    return _currentImageView;
}

- (void)scrollViewDidZoom:(UIScrollView *)scrollView
{
    
    CGSize boundsSize = scrollView.bounds.size;
    CGRect imgFrame = _currentImageView.frame;
    CGSize contentSize = scrollView.contentSize;
    
    CGPoint centerPoint = CGPointMake(contentSize.width/2, contentSize.height/2);
    
    if (imgFrame.size.width <= boundsSize.width)
    {
        centerPoint.x = boundsSize.width/2;
    }
    
    if (imgFrame.size.height <= boundsSize.height)
    {
        centerPoint.y = boundsSize.height/2;
    }
    
    _currentImageView.center = centerPoint;
}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
    _currentScrollView.zoomScale = 1.0;
}

@end


最后强调一个开发中常遇到的问题，那就是scrollView上的子button或者其他带点击事件的控件的触摸互有一定的延迟，解决办法    scrollView.delaysContentTouches = NO;即可。
防止scrollView手势覆盖侧滑手势：

[[UIBarButtonItemappearance]setBackButtonTitlePositionAdjustment:UIOffsetMake(0, -60)forBarMetrics:UIBarMetricsDefault];

UIScrollView 嵌套二
wang_gwei的博客
08-11 1234
定一个一个类 实例 用户保存 内外 scrollView 的滚动状态，这里不可使用 scrollView.scrollEnabled，因为scrollView.scrollEnabled = NO；当外层 scrollerView 滚动到最大值后 内部scrollerView 接着滚动剩余部分。实现 快速滚动时 内外嵌套ScrollView 能够 无缝衔接 滚动操作。// 修改 内外scrollView 的滚动状态。// 修改 内外scrollView 的滚动状态。
UIScrollView
wode_5211314的博客
08-21 172
属性和方法 contentSize contentInset 不常用 bounces 弹簧效果 pagingEnabled 分页效果 scrollEnabled 是否允许滑动，如果设置为no,则只能通过方法滑动，不能通过手势滑动 showsHorizontalScrollIndicator 显示水平滚动条 showsVerticalScrollIndica
UIScrollView 嵌套一
最新发布
wang_gwei的博客
08-11 1825
滚动视图，如果直接添加的话，就会出现手势的冲突造成了体验上的悲剧。目前网上大部分的方法都是自己写手势监听，实现起来太过繁琐，最近遇到了同样的问题，写了一个比较简单的方法。来控制内外嵌套scrollView的滚动 以及滚动到目标位置后 把后续的滚动传递给另一个scrollView 避免滚动终止的生硬。// 内外层滚动到目标位置后 把滚动距离 传给外层 scrollView。// 外层滚动到目标位置后 把滚动距离 传给内存 scrollView。通过scrollView的代理方法。
UIScrollView学习
会飞的石头
06-10 429
UIScrollView学习
[Swift]UIScrollView嵌套UITableView联动
Gamin
05-07 3239
众所周知，UITableView和UICollectionView都继承于UIScrollView，实际本文说的就是UIScrollView嵌套UIScrollView的事。 首先，自定义NestScrollView继承于UIScrollView，实现UIGestureRecognizerDelegate协议中的方法允许手势同时识别。 import Foundation import UIKit class NestScrollView: UIScrollView { required init
UIScrollView属性总结
IOSPanPan__的专栏
07-02 1262
UITextField *fiel
UIScrollView简介
逢个场，作个戏
12-13 783
管理显示内容： 1.以动画的形式设置内容偏移量： - (void)setContentOffset:(CGPoint)contentOffset animated:(BOOL)animated 调用这个函数，动画不会导致滚动指示条显示，它仅仅是滑动到指定位置。 2.内容偏移量： @property(nonatomic) CGPoint conte
IOS UIScrollView
Mr.xiaoma.wen
06-12 457
UIScrollView 类负责所有基于 UIKit 的滚动操作。 一、创建 [java] view plaincopy CGRect bounds = [ [ UIScreen mainScreen ] applicationFrame ] ;   UIScrollView* scrollView = [ [UIScro
UIScrollView 实践经验
shancheli的博客
10-29 521
15 DECEMBER 2014 on ios, uiscrollview UIScrollView（包括它的子类 UITableView 和 UICollectionView）是 iOS 开发中最常用也是最有意思的 UI 组件，大部分 App 的核心界面都是基于三者之一或三者的组合实现。UIScrollView 是 UIKit 中为数不多能响应滑动手势的 view，相比自己用 UIPa
UIScrollView 用法详解
08-30
第二种是编程方式，通过Swift或Objective-C代码动态添加子视图。无论哪种方式，都需要确保所有子视图的总尺寸大于或等于contentSize。 滚动操作是UIScrollView的核心功能。我们可以设置scrollView的contentOffset来...
iOS利用UIScrollView实现图片的缩放实例代码
01-04
本文介绍了iOS利用UIScrollView实现图片的缩放实例代码，分享给大家： 第一步：添加scrollView到控制器中 UIScrollView *scrollView...第二步：添加图片控件到scrollView中 添加图片方式一： UIImageView *imageVi
iOS利用UIScrollView实现无限滚动效果
01-20
在iOS开发中，实现无限滚动效果常常用于图片轮播器或者欢迎界面，通过UIScrollView的特性可以巧妙地模拟出无限滚动的视觉效果。本教程将详细讲解如何利用UIScrollView来实现这一功能。 首先，我们要理解实现无限...
UIScrollView 原理
03-28
#### 二、UIScrollView的关键属性和方法 ##### 1. 关键属性 - **contentSize**: 定义了scrollView的内容区域大小。 - **scrollEnabled**: 表示scrollView是否允许滚动。 - **showsHorizontalScrollIndicator** 和 ...
右滑返回手势和UIScrollView中手势冲突的解决方法
01-20
因此，我们引入第二种解决方案。在`gestureRecognizerShouldBegin:`代理方法中，我们控制ScrollView仅在切换tab时开始滑动手势，而在进行滑动返回时阻止其开始。这样，滑动返回时，ScrollView不会响应滑动手势，避免...
Objective-C文字加阴影方法总结
热门推荐
EverStar's Blog
07-26 1万+
Objective-C文字加阴影
Objective-C枚举类型详解
EverStar's Blog
04-16 1万+
最近看了一本OC进阶的书，很多人推荐的Effective Objictive-C2.0，看到书中枚举类型的介绍，觉得很不错，这里为大家总结一下。enum由于Objective-C基于C语言，所以C语言有的功能它都有，其中之一就是枚举类型enum。枚举类型只是一种常亮命名方式，某个对象所经历的各种状态或者类型就可以定义为一个简单的枚举类型，比如一个通讯录或者聊天页的页面类型可如下定义：enum Vie
Objective-C页面跳转方法总结
EverStar's Blog
02-26 8982
这里就限制介绍代码实现页面跳转，Storyboard的segues方式就不多介绍了，这种方法不适合团队开发。 最多用到的就是pushViewController和与之对应的方法是popViewControllerAnimated。都需要有navigation。 语句为[self.navigationController pushViewController:newC animated:YES];
Objective-C文字换行方式（解决英文在行末时的换行问题）
EverStar's Blog
08-10 8775
我们在做文字信息展示的时候会遇到这种情况：中文+英文（数字），当英文或者数字在行末并且过长的时候，这种情况下系统会默认把整个英文换到下一行展示。这样就会造成上一行显示不满的情况。 如果是UILabel的话直接设置lineBreakMode属性即可：label.lineBreakMode = UILineBreakModeCharacterWrap;UILineBreakModeCharacterW
Objective-C延迟执行方法总结
EverStar's Blog
08-29 8507
1.performSelector 这种方法使用起来比较方便，也可以传递参数： [self performSelector:@selector(delayAction) withObject:nil afterDelay:2]; 系统也提供了取消要执行的方法： [[self class] cancelPreviousPerformRequestsWithTarget:self sele
UIScrollView实现自动分页滑动教程
### 知识点二：UIScrollView自动分页效果 #### 自动分页机制 通过设置`pagingEnabled`属性为`YES`，UIScrollView可以实现自动分页。这个属性使得滚动视图在用户拖动结束后，会自动停在固定位置（通常是一页的开始）...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值