介紹
在 iOS 26 中,UIScrollView 迎來了兩個重要增強(qiáng),主要聚焦于滾動邊緣的視覺效果和與浮動容器的交互體驗(yàn)。這些改進(jìn)不僅讓滾動過渡更自然,還提升了在復(fù)雜界面中內(nèi)容的可讀性。
UIScrollEdgeEffect
過去,當(dāng)內(nèi)容滾動到邊緣時,系統(tǒng)會使用回彈(bounce)或發(fā)光(glow)效果來提示用戶。但在 iOS 26 中,Apple 增加了類型為UIScrollEdgeEffect的屬性topEdgeEffect、leftEdgeEffect、bottomEdgeEffect與rightEdgeEffect,用于設(shè)置滾動邊緣的效果。
UIScrollEdgeElementContainerInteraction
除了邊緣效果,Apple 還引入新的交互UIScrollEdgeElementContainerInteraction,可以將導(dǎo)航欄、標(biāo)簽欄、工具欄或者自定義浮動視圖標(biāo)記為邊緣元素容器,當(dāng)內(nèi)容滾動到該容器下方時,系統(tǒng)會自動添加一個漸變模糊效果,從而保證疊加內(nèi)容的可讀性。
案例
代碼
import UIKit
class ViewController: UIViewController {
lazy var scrollView: UIScrollView = {
let scrollView = UIScrollView()
scrollView.translatesAutoresizingMaskIntoConstraints = false
scrollView.addSubview(contentView)
scrollView.contentSize = contentView.frame.size
// iOS26新增
// scrollView.bottomEdgeEffect.style = .hard
return scrollView
}()
lazy var contentView: UIView = {
let view = UIView()
view.backgroundColor = .black
view.translatesAutoresizingMaskIntoConstraints = false
return view
}()
lazy var stackView: UIStackView = {
var config = UIButton.Configuration.clearGlass()
config.title = "Action"
let button1 = UIButton(type: .system)
button1.configuration = config
let button2 = UIButton(type: .system)
config.title = "More"
button2.configuration = config
let stackView = UIStackView(arrangedSubviews: [button1, button2])
stackView.axis = .horizontal
stackView.spacing = 16
stackView.translatesAutoresizingMaskIntoConstraints = false
// iOS26新增
let interaction = UIScrollEdgeElementContainerInteraction()
interaction.scrollView = scrollView
interaction.edge = .bottom
// 關(guān)聯(lián)視圖
stackView.addInteraction(interaction)
return stackView
}()
override func viewDidLoad() {
super.viewDidLoad()
view.addSubview(scrollView)
view.addSubview(stackView)
NSLayoutConstraint.activate([
scrollView.topAnchor.constraint(equalTo: view.topAnchor),
scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
contentView.topAnchor.constraint(equalTo: scrollView.contentLayoutGuide.topAnchor),
contentView.leadingAnchor.constraint(equalTo: scrollView.contentLayoutGuide.leadingAnchor),
contentView.bottomAnchor.constraint(equalTo: scrollView.contentLayoutGuide.bottomAnchor),
contentView.trailingAnchor.constraint(equalTo: scrollView.contentLayoutGuide.trailingAnchor),
contentView.widthAnchor.constraint(equalTo: scrollView.frameLayoutGuide.widthAnchor),
contentView.heightAnchor.constraint(equalToConstant: 1000),
stackView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
stackView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -20)
])
}
}
效果

效果.gif