如何在swift4中动态添加滚动视图
Posted
技术标签:
【中文标题】如何在swift4中动态添加滚动视图【英文标题】:How to add scrollview dynamically in swift4 【发布时间】:2018-04-24 06:42:21 【问题描述】:我创建了一个视图,其中包含一个图像和一个文本视图(动态变化)和一个按钮。此视图嵌入在UIScrollView
中。但是当我运行它时,Scrollview
不起作用。我在 Swift4 中遇到了这个问题。
您可以参考以下链接: https://github.com/sravyagajavalli/Scrolling
【问题讨论】:
句号后面总是跟一个大写字母。 向我们展示您的代码 @lakshmisravyaGajavalli,这是在您创建任何新的ViewController
时预定义的基本方法,上传您尝试过的代码。
@lakshmisravyaGajavalli 请单击问题下方的编辑以将代码添加到问题中。所有其他信息都应编辑到问题中,而不是作为评论添加。请。另请阅读How to Ask
【参考方案1】:
将 UIScrollView 作为两个独立的视图是件好事。框架视图(它定义了超级视图和兄弟视图中滚动视图的大小)和内容视图(它定义了 contentSize)。在 Autolayout 的观点是这两个视图是绝对独立的。所以你需要定义frameView。然后您需要正确定义自动布局以正确调整内容视图的大小(您不需要解决 x 和 y 位置当然这是 contentOffset 和滚动原则的问题)。让我们从例子开始:
1) 创建 UIScrollView 将其添加到 superView 并定义框架视图
let scrollView = UIScrollView()
scrollView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(scrollView)
NSLayoutConstraint.activate([
scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
scrollView.topAnchor.constraint(equalTo: view.topAnchor),
scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])
2) 根据我的经验,创建清晰视图并将其作为 contentView 添加到 scrollView 以实现更好的自动布局始终是一种好习惯。
let contentView = UIView()
contentView.translatesAutoresizingMaskIntoConstraints = false
scrollView.addSubview(contentView)
NSLayoutConstraint.activate([
contentView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor),
contentView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor),
contentView.topAnchor.constraint(equalTo: scrollView.topAnchor),
contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
contentView.widthAnchor.constraint(equalTo: view.widthAnchor)
])
注意最后一个约束,我们需要将这个内容视图的宽度定义为与屏幕相等 - 这对于定义我们想要垂直滚动很重要。因此,我们可以让 autolayout 完成它的工作,并根据内容自动计算 scrollView 的内容高度。
3) 将任何你想要的内容添加到滚动视图中
let label = UILabel()
label.translatesAutoresizingMaskIntoConstraints = false
label.text = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis sapien nunc, commodo et, interdum suscipit, sollicitudin et, dolor. Maecenas libero. Etiam commodo dui eget wisi. Nullam at arcu a est sollicitudin euismod. Nullam rhoncus aliquam metus. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Duis risus. Fusce suscipit libero eget elit. Integer malesuada. Aliquam erat volutpat. Maecenas libero. Nam quis nulla. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Nunc tincidunt ante vitae massa. Sed convallis magna eu sem. Donec iaculis gravida nulla. Etiam commodo dui eget wisi. Integer in sapien. Nulla accumsan, elit sit amet varius semper, nulla mauris mollis quam, tempor suscipit diam nulla vel leo. Sed ac dolor sit amet purus malesuada congue. Vivamus luctus egestas leo. Etiam quis quam. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Nullam eget nisl. Mauris metus. Nulla turpis magna, cursus sit amet, suscipit a, interdum id, felis. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Etiam commodo dui eget wisi. Aliquam id dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Mauris metus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis sapien nunc, commodo et, interdum suscipit, sollicitudin et, dolor. Maecenas libero. Etiam commodo dui eget wisi. Nullam at arcu a est sollicitudin euismod. Nullam rhoncus aliquam metus. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Duis risus. Fusce suscipit libero eget elit. Integer malesuada. Aliquam erat volutpat. Maecenas libero. Nam quis nulla. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Nunc tincidunt ante vitae massa. Sed convallis magna eu sem. Donec iaculis gravida nulla. Etiam commodo dui eget wisi. Integer in sapien. Nulla accumsan, elit sit amet varius semper, nulla mauris mollis quam, tempor suscipit diam nulla vel leo. Sed ac dolor sit amet purus malesuada congue. Vivamus luctus egestas leo. Etiam quis quam. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Nullam eget nisl. Mauris metus. Nulla turpis magna, cursus sit amet, suscipit a, interdum id, felis. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Etiam commodo dui eget wisi. Aliquam id dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Mauris metus."
label.numberOfLines = 0
contentView.addSubview(label)
NSLayoutConstraint.activate([
label.leadingAnchor.constraint(equalTo: contentView.leadingAnchor),
label.trailingAnchor.constraint(equalTo: contentView.trailingAnchor),
label.topAnchor.constraint(equalTo: contentView.topAnchor),
label.bottomAnchor.constraint(equalTo: contentView.bottomAnchor)
])
IOS 11 新闻
最后在 IOS 11 中是新的布局指南,它解决了 UIScrollView 中的框架视图和内容视图的问题,正如我之前提到的。 这是
scrollView.frameLayoutGuide
scrollView.contentLayoutGuide
所以只有 ios 11 你可以避免 contentView 的良好做法并以这种方式进行(但通常我们需要对旧 ios 版本的向后支持)
1) 创建与之前相同的 UIScrollView,但在新布局指南的帮助下定义宽度
let scrollView = UIScrollView()
scrollView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(scrollView)
NSLayoutConstraint.activate([
scrollView.frameLayoutGuide.leadingAnchor.constraint(equalTo: view.leadingAnchor),
scrollView.frameLayoutGuide.trailingAnchor.constraint(equalTo: view.trailingAnchor),
scrollView.frameLayoutGuide.topAnchor.constraint(equalTo: view.topAnchor),
scrollView.frameLayoutGuide.bottomAnchor.constraint(equalTo: view.bottomAnchor),
scrollView.contentLayoutGuide.widthAnchor.constraint(equalTo: scrollView.frameLayoutGuide.widthAnchor)
])
2) 现在只需添加您想要的任何内容,但将自动布局附加到scrollView.contentLayoutGuide
let label = UILabel()
label.translatesAutoresizingMaskIntoConstraints = false
label.text = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis sapien nunc, commodo et, interdum suscipit, sollicitudin et, dolor. Maecenas libero. Etiam commodo dui eget wisi. Nullam at arcu a est sollicitudin euismod. Nullam rhoncus aliquam metus. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Duis risus. Fusce suscipit libero eget elit. Integer malesuada. Aliquam erat volutpat. Maecenas libero. Nam quis nulla. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Nunc tincidunt ante vitae massa. Sed convallis magna eu sem. Donec iaculis gravida nulla. Etiam commodo dui eget wisi. Integer in sapien. Nulla accumsan, elit sit amet varius semper, nulla mauris mollis quam, tempor suscipit diam nulla vel leo. Sed ac dolor sit amet purus malesuada congue. Vivamus luctus egestas leo. Etiam quis quam. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Nullam eget nisl. Mauris metus. Nulla turpis magna, cursus sit amet, suscipit a, interdum id, felis. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Etiam commodo dui eget wisi. Aliquam id dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Mauris metus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis sapien nunc, commodo et, interdum suscipit, sollicitudin et, dolor. Maecenas libero. Etiam commodo dui eget wisi. Nullam at arcu a est sollicitudin euismod. Nullam rhoncus aliquam metus. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Duis risus. Fusce suscipit libero eget elit. Integer malesuada. Aliquam erat volutpat. Maecenas libero. Nam quis nulla. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Nunc tincidunt ante vitae massa. Sed convallis magna eu sem. Donec iaculis gravida nulla. Etiam commodo dui eget wisi. Integer in sapien. Nulla accumsan, elit sit amet varius semper, nulla mauris mollis quam, tempor suscipit diam nulla vel leo. Sed ac dolor sit amet purus malesuada congue. Vivamus luctus egestas leo. Etiam quis quam. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Nullam eget nisl. Mauris metus. Nulla turpis magna, cursus sit amet, suscipit a, interdum id, felis. Integer rutrum, orci vestibulum ullamcorper ultricies, lacus quam ultricies odio, vitae placerat pede sem sit amet enim. Etiam commodo dui eget wisi. Aliquam id dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Mauris metus."
label.numberOfLines = 0
scrollView.addSubview(label)
NSLayoutConstraint.activate([
label.leadingAnchor.constraint(equalTo: scrollView.contentLayoutGuide.leadingAnchor),
label.trailingAnchor.constraint(equalTo: scrollView.contentLayoutGuide.trailingAnchor),
label.topAnchor.constraint(equalTo: scrollView.contentLayoutGuide.topAnchor),
label.bottomAnchor.constraint(equalTo: scrollView.contentLayoutGuide.bottomAnchor)
])
就是这样。您可以将两种方式复制粘贴到您的 viewController viewDidLoad 方法中,它会起作用。
【讨论】:
以上是关于如何在swift4中动态添加滚动视图的主要内容,如果未能解决你的问题,请参考以下文章