iOS Autolayout用于滚动视图和粘性页脚

时间:2016-11-15 13:44:35

标签: ios autolayout ios-autolayout

假设我的布局如下图所示: enter image description here 根视图 - 是viewController的视图。我希望我的页脚文字

  • 如果内容适合一个屏幕(主要文字很小),则粘贴在屏幕底部
  • 从主要文本&在其他情况下,从屏幕底部15点

据我所知,我可以计算主要文本heigt&将它与当前屏幕尺寸进行比较,但我想找到另一种方式(理想情况下只有约束)。

有可能吗?

1 个答案:

答案 0 :(得分:5)

要实现您要执行的操作,您需要设置以下约束:

<强>滚动型
- topleadingtrailingbottom等于 RootView &#39; topleadingtrailingbottom

<强> WrapperView
- topleadingtrailingbottom等于 ScrollView &#39; topleadingtrailingbottom
- width等于ScrollView&#39; s width
- height greaterThanOr等于ScrollView&#39; s height

<强>的TextView
- topleadingtrailing等于 WrapperView &#39; topleadingtrailing

<强> FooterView
- leadingtrailing等于 WrapperView &#39; leadingtrailing
- bottom等于 WrapperView &#39; s bottom(常数15)
- top greaterThanOr等于 TextView &#39; s bottom(常数为15)

关键是使用greaterThanOrEqual关系的两个约束: WrapperView 至少与 ScrollView FooterView <一样高/ strong>`s top与 TextView 底部的距离至少为15。

以下是使用故事板时的约束:

enter image description here

这就是你以编程方式(使用SnapKit)的方式:

import UIKit
import SnapKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        let scrollView = UIScrollView()
        view.addSubview(scrollView)

        let wrapperView = UIView()
        wrapperView.backgroundColor = .cyan
        scrollView.addSubview(wrapperView)

        let textView = UILabel()
        textView.numberOfLines = 0
        textView.font = UIFont.systemFont(ofSize: 30)
        textView.text = "You think water moves fast? You should see ice. It moves like it has a mind. Like it knows it killed the world once and got a taste for murder. After the avalanche, it took us a week to climb out. Now, I don't know exactly when we turned on each other, but I know that seven of us survived the slide... and only five made it out. Now we took an oath, that I'm breaking now. We said we'd say it was the snow that killed the other two, but it wasn't. Nature is lethal but it doesn't hold a candle to man."
        //textView.text = "You think water moves fast? You should see ice. It moves like it has a mind."
        textView.backgroundColor = .yellow
        wrapperView.addSubview(textView)

        let footer = UILabel()
        footer.textAlignment = .center
        footer.text = "Footer text"
        footer.backgroundColor = .orange
        wrapperView.addSubview(footer)

        scrollView.snp.makeConstraints { (make) in
             make.edges.equalTo(view)
        }

        wrapperView.snp.makeConstraints { (make) in
            make.edges.equalTo(scrollView)
            make.width.equalTo(scrollView)
            make.height.greaterThanOrEqualTo(scrollView)
        }
        textView.snp.makeConstraints { (make) in
            make.top.left.right.equalTo(0)
        }
        footer.snp.makeConstraints { (make) in
            make.top.greaterThanOrEqualTo(textView.snp.bottom).offset(15)
            make.left.right.equalTo(0)
            make.bottom.equalTo(-15)
        }
    }
}

长文字截图:

enter image description here

短文摘要:

enter image description here