UIScrollView遇上AutoLayout

2024-05-14 02:08

本文主要是介绍UIScrollView遇上AutoLayout,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在使用storyboard和xib的时候,我们经常会碰上UIScrollView的情况,而我们使用storyboard和xib的时候,经常是使用的AutoLayout自动布局,但是UIScrollView碰上AutoLayout的时候,相对来说是有点复杂的。为什么呢?原因在这:
由于Scrollview的contentSize由其subviews确定,其subviews的布局依赖于其父视图Scrollview的边界。这个矛盾,要不解决前者问题,要不解决后者,即要么不让UIScrollView的contentSize由其subviews确定,要么就让ScrollView的subviews不依赖其contentSize(即Scrollview的边界)。很显然,我们只能选择后者,因为前者你无法改变,其实从宏观上来看,改变了一个就相当于改变了两个,其实二者并没有什么特别区别,都是同一个问题导致的。
今天小编带大家实现一个简单的UIScrollView碰上AutoLayout的例子,效果图:
这里写图片描述

  1. 创建一个空的项目,拖一个UIScrollView到storyboard中,并对 UIScrollView添加上下左右都为0的约束,如下图:
    这里写图片描述

  2. 拖一个view到scrollView上充当它的contentSize的view,并且添加相对于scrollview的上下左右为0的约束,添加完之后,会有一个报错,我们暂时不用管。
    这里写图片描述

  3. 我们要确定一下我们是想要水平方向滚动还是竖直方向上的滚动。
    a.水平方向上的滚动需要对view添加这样一条约束
    这里写图片描述

    b.竖直方向上的滚动需要对view添加这样一条约束
    这里写图片描述

  4. 我们以水平方向上滚动为例,我们需要确定我们想要的宽度,添加一个固定宽度的约束(PS:我们需要将这条约束拖成属性,这样的话我们能够随时更改我们想要的宽度):
    这里写图片描述

  5. 选中view,更新一下frame
    这里写图片描述

  6. 现在我们在拖出来一个view放到之前的view,为了便于区分,我们对现在拖出来的这个view命名为绿色,并设置背景颜色为绿色,将它的坐标设置为(0,0,600,600),并且添加上,左,下三个约束(PS:此处会报错误,我们暂时不用管):
    这里写图片描述

  7. 我们再拖出来一个view放到之前的view(PS:别放到绿色的view里面,应该和绿色的view同层级),同样我们为了便于区分,对这个view命名为红色,并且设置背景颜色为红色,将它的坐标设为(600,0,600,600),为它添加上,左(PS:相对于绿色view),下,右四个约束:
    这里写图片描述

  8. 我们还需要对红色的view添加一个相对于superView(PS:scrollView里面那个view)的左约束,并且把这个约束拖出来作为一个属性,我命名为secondLeft。
    这里写图片描述

这里写图片描述

接着,我们在storyboard中将UIScrollView的pageEnable勾选,用代码更新约束。

- (void)updateViewConstraints
{[super updateViewConstraints];self.width.constant = CGRectGetWidth([UIScreen mainScreen].bounds) * 2;self.secondLeft.constant = CGRectGetWidth([UIScreen mainScreen].bounds);
}

OK,运行程序,得到我们想要的结果,源码地址:UIScrollView碰上AutoLayout
如果有疑问,欢迎联系。

这篇关于UIScrollView遇上AutoLayout的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/987456

相关文章

数据库遇上知识图谱、区块链、深度学习

参考资料: https://zhuanlan.zhihu.com/p/33381916 https://www.zuozuovera.com/archives/1062/ 东南大学D&Intel Lab相关ppt 数据库的核心概念——表示、存取、查询 有了数据库是干什么,大概实现的逻辑,特点,才能引申出对当今这些新技术的对比、适应和发展。 目的:研究数据表示、存取数据模型:表示数据的模型,通

隐私计算实训营:SplitRec:当拆分学习遇上推荐系统

拆分学习的概念 拆分学习的核心思想是拆分网络结构。每一个参与方拥有模型结构的一部分,所有参与方的模型合在一起形成一个完整的模型。训练过程中,不同参与方只对本地模型进行正向或者反向传播计算,并将计算结果传递给下一个参与方。多个参与方通过联合模型进行训练直至最终收敛。 一个典型的拆分学习例子: Alice持有数据和基础模型。Bob只有数据、基础模型和fuse模型。 Alice使用自己的数据

(素材源码)猫猫学IOS(九)UI之UIScrollView代理触摸实现_图片缩放

猫猫分享,必须精品 素材代码地址:http://download.csdn.net/detail/u013357243/8531273 原文地址:http://blog.csdn.net/u013357243?viewmode=contents 先看效果 ps:新建iOS交流学习群:304570962 ps:猫猫的文章竟然被好多地方转载了,受宠若惊啊,不过转的时候请转的全一点,别

猫猫学IOS(九)UI之UIScrollView代理触摸实现_图片缩放

猫猫分享,必须精品 素材代码地址:http://blog.csdn.net/u013357243/article/details/44619193 原文地址:http://blog.csdn.net/u013357243?viewmode=contents 先看效果 代码 //// NYViewController.m// 05-放大缩小图片UIScrollView//

(素材源码)猫猫学IOS(八)UI之热门_喜马拉雅UI实现-UIScrollView的使用

猫猫分享,必须精品 素材代码地址:http://download.csdn.net/detail/u013357243/8527435 原文地址:http://blog.csdn.net/u013357243/article/details/44588159 先看效果 ## ## storyBoard用到的控件 ## 新建iOS交流学习群:304570962

猫猫学IOS(八)UI之热门_喜马拉雅UI实现-UIScrollView的使用

猫猫分享,必须精品 素材代码地址: http://blog.csdn.net/u013357243/article/details/44588251 原文地址:http://blog.csdn.net/u013357243/article/details/44588159 先看效果 storyBoard用到的控件 代码实现 /*新建iOS交流学习群:3045

Java 爬虫遇上数据异步加载,试试这两种办法!

爬虫工具根据Xpath路径解析网页时,如果页面是异步加载,则无法获取到js渲染后的界面。这样我们通过XPath路径则定位到具体对象。对此类问题的解决方案有两种。 第一:内置浏览器内核 内置浏览器就是在抓取的程序中,启动一个浏览器内核,使我们获取到 js 渲染后的页面,这样我们就跟采集静态页面一样了。这种工具常用的有以下三种: SeleniumHtmlUnitPhantomJs 这些工具都能

当敏捷开发遇上AI

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗?订阅我们的简报,深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同,从行业内部的深度分析和实用指南中受益。不要错过这个机会,成为AI领域的领跑者。点击订阅,与未来同行! 订阅:https://rengongzhineng.io/ 多年来,敏捷软件开发一直被视为一种高效的方式来交付业务所需的软件。这

当AI遇上渣渣夕:AIStarter 2.0.6启动器最新教程

在人工智能技术飞速发展的今天,AIStarter启动器凭借其强大的功能和便捷的操作,受到了广大用户的喜爱。最新版本的AIStarter 2.0.6更是带来了许多令人期待的新功能。本文将详细介绍如何安装和使用这款启动器,并带你体验AI与游戏的完美结合。 一、引言 简述AIStarter启动器的功能及其在当前AI领域的地位。引出文章主题——2.0.6版本的安装与使用教程。 二、安装教程 步骤1

【iOS】UIScrollview联动

直接上代码 class CustomScrollview: UIScrollView {override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {switch event?.type {case .touches:print("touch")default:return super.hitTest(poin