ScrollView 中同时居中和滚动的约束
Constraints in ScrollView for centering and scrolling at the same time
我在 xcode.
中遇到一个关于使用界面生成器自动布局的案例
我想将滚动视图中的约束调整为:
- 当内容视图小于滚动视图时,UIScrollView 中的中心视图容器。
- 当内容视图大于滚动视图时,坚持滚动视图内内容视图的边缘。它应该是可滚动的。
我想在不对代码进行额外调整的情况下使用一个约束设置来实现这一点。
可能吗? :-)
状态 1:居中
状态 2:可滚动
演示项目:https://github.com/Aquilosion/TestScrollViewConstraints
这是可能的,尽管我无法停止 Xcode 警告我约束不正确(尽管我很确定它们没问题)。您需要的是:
- 滚动视图
- 内容视图
- 实际内容
我制作了一个测试视图控制器来演示这一点。视图层次结构应如下所示:
我的测试视图控制器如下所示:
蓝色区域是带有内容视图的滚动视图,白色区域是"actual content"(里面有标签)。如果在标签上启用多行,则会得到以下内容:
要达到这个效果,你需要将所有四个边的content view都锁定到view controller,并且让它们等宽和等高。您需要修改 'equal height constraint',使其成为 'equal to or more than 0',而不是默认的 'equals 0'。
同时,在 'actual content' 视图中,您需要 'align Y' 及其父视图(内容视图),并将顶部和底部锁定到其父视图,但再次修改它们以便它们是 'greater than or equal to' 约束。之后,如果太小就应该居中,或者当它变大时适当扩展。
没有任何错误地执行此操作的最佳方法是,通过根据屏幕高度计算滚动视图来将滚动视图设置为滚动视图,如下面的代码 ->
// ViewController.swift
import UIKit
class ViewController: UIViewController {
@IBOutlet var scrollView : UIScrollView
@IBOutlet var contentView : UIView
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
}
override func viewDidLayoutSubviews()
{
let scrollViewBounds = scrollView.bounds
let containerViewBounds = contentView.bounds
var scrollViewInsets = UIEdgeInsetsZero
scrollViewInsets.top = scrollViewBounds.size.height/2.0;
scrollViewInsets.top -= contentView.bounds.size.height/2.0;
scrollViewInsets.bottom = scrollViewBounds.size.height/2.0
scrollViewInsets.bottom -= contentView.bounds.size.height/2.0;
scrollViewInsets.bottom += 1
scrollView.contentInset = scrollViewInsets
}
}
For better understanding please refer below link
Source -> https://www.natashatherobot.com/ios-autolayout-scrollview/
我在 xcode.
中遇到一个关于使用界面生成器自动布局的案例我想将滚动视图中的约束调整为:
- 当内容视图小于滚动视图时,UIScrollView 中的中心视图容器。
- 当内容视图大于滚动视图时,坚持滚动视图内内容视图的边缘。它应该是可滚动的。
我想在不对代码进行额外调整的情况下使用一个约束设置来实现这一点。
可能吗? :-)
状态 1:居中
状态 2:可滚动
演示项目:https://github.com/Aquilosion/TestScrollViewConstraints
这是可能的,尽管我无法停止 Xcode 警告我约束不正确(尽管我很确定它们没问题)。您需要的是:
- 滚动视图
- 内容视图
- 实际内容
我制作了一个测试视图控制器来演示这一点。视图层次结构应如下所示:
我的测试视图控制器如下所示:
蓝色区域是带有内容视图的滚动视图,白色区域是"actual content"(里面有标签)。如果在标签上启用多行,则会得到以下内容:
要达到这个效果,你需要将所有四个边的content view都锁定到view controller,并且让它们等宽和等高。您需要修改 'equal height constraint',使其成为 'equal to or more than 0',而不是默认的 'equals 0'。
同时,在 'actual content' 视图中,您需要 'align Y' 及其父视图(内容视图),并将顶部和底部锁定到其父视图,但再次修改它们以便它们是 'greater than or equal to' 约束。之后,如果太小就应该居中,或者当它变大时适当扩展。
没有任何错误地执行此操作的最佳方法是,通过根据屏幕高度计算滚动视图来将滚动视图设置为滚动视图,如下面的代码 ->
// ViewController.swift
import UIKit
class ViewController: UIViewController {
@IBOutlet var scrollView : UIScrollView
@IBOutlet var contentView : UIView
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
}
override func viewDidLayoutSubviews()
{
let scrollViewBounds = scrollView.bounds
let containerViewBounds = contentView.bounds
var scrollViewInsets = UIEdgeInsetsZero
scrollViewInsets.top = scrollViewBounds.size.height/2.0;
scrollViewInsets.top -= contentView.bounds.size.height/2.0;
scrollViewInsets.bottom = scrollViewBounds.size.height/2.0
scrollViewInsets.bottom -= contentView.bounds.size.height/2.0;
scrollViewInsets.bottom += 1
scrollView.contentInset = scrollViewInsets
}
}
For better understanding please refer below link
Source -> https://www.natashatherobot.com/ios-autolayout-scrollview/