iOS26适配指南之UIVisualEffectView

介绍

增加了符合 Liquid Glass 风格的效果UIGlassEffect与UIGlassContainerEffect。

UIGlassEffect

代码

swift 复制代码
import UIKit

class ViewController: UIViewController {
    lazy var wwdcLabel: UILabel = {
        let label = UILabel(frame: CGRect(x: 0, y: 0, width: 100, height: 50))
        label.text = "WWDC25"
        label.textAlignment = .center
        label.textColor = .white
        return label
    }()
    let visualEffectView = UIVisualEffectView()

    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = .systemTeal

        glassEffect()
    }

    // MARK: UIGlassEffect
    func glassEffect() {
        // iOS26新增
        let glassEffect = UIGlassEffect()
        glassEffect.isInteractive = true
        visualEffectView.effect = glassEffect
        visualEffectView.frame = CGRect(x: view.frame.midX - 50, y: view.frame.midY - 25, width: 100, height: 50)
        visualEffectView.layer.cornerRadius = 20
        visualEffectView.clipsToBounds = true
        visualEffectView.contentView.addSubview(wwdcLabel)
        view.addSubview(visualEffectView)
    }
}

效果

UIGlassContainerEffect

代码

swift 复制代码
import UIKit

class ViewController: UIViewController {
    lazy var wwdcLabel: UILabel = {
        let label = UILabel(frame: CGRect(x: 0, y: 0, width: 100, height: 50))
        label.text = "WWDC25"
        label.textAlignment = .center
        label.textColor = .white
        return label
    }()
    lazy var iOSLabel: UILabel = {
        let label = UILabel(frame: CGRect(x: 0, y: 0, width: 100, height: 50))
        label.text = "iOS26"
        label.textAlignment = .center
        label.textColor = .white
        return label
    }()
    let visualEffectView = UIVisualEffectView()

    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = .systemTeal

        glassContainerEffect()
    }

    // MARK: UIGlassContainerEffect
    func glassContainerEffect() {
        // iOS26新增
        let glassContainerEffect = UIGlassContainerEffect()
        visualEffectView.effect = glassContainerEffect
        visualEffectView.frame = CGRect(x: 0, y: 0, width: 210, height: 50)
        visualEffectView.center = view.center
        let glassEffect = UIGlassEffect()
        let view1 = UIVisualEffectView(effect: glassEffect)
        view1.frame = CGRect(x: 10, y: 10, width: 100, height: 50)
        view1.contentView.addSubview(wwdcLabel)
        let view2 = UIVisualEffectView(effect: glassEffect)
        view2.frame = CGRect(x: 110, y: 10, width: 100, height: 50)
        view2.contentView.addSubview(iOSLabel)
        visualEffectView.contentView.addSubview(view1)
        visualEffectView.contentView.addSubview(view2)
        view.addSubview(visualEffectView)
    }
}

效果

相关推荐
茶底世界之下13 小时前
窗边白雏菊与旧书:用 Awaking 留住一束暖光
ios·app·产品
东坡肘子15 小时前
参与学生移动应用大赛有感 -- 肘子的 Swift 周报 #161
人工智能·swiftui·swift
茶底世界之下2 天前
阴天海边的蓝船:用 Awaking 把灰蓝调成清亮主角
ios·app·产品
Digitally2 天前
如何将 iPhone 备份到 iCloud?
ios
传奇开心果编程2 天前
【Flutter踩坑排雷】第19课:路由硬编码坑|字符串路由书写错误,页面跳转失败排查
android·flutter·ios·移动开发·跨平台·ui框架·声明式ui
茶底世界之下3 天前
雨后街口的斑马线:用 Awaking 把颜色让给光与步伐
ios·app·产品
茶底世界之下3 天前
晨雾河岸的旧书摊:用 Awaking 给木色一点暖光
ios·app·产品
90后的晨仔4 天前
在 macOS 27 上运行 Xcode 26
ios
茶底世界之下5 天前
山间站台不必转暖:用 Awaking 留住冷光与红箱
ios·app·产品