如何使用Swift放大圆形UIView？附示例代码

要实现圆形UIView的放大动画，核心是利用UIKit的动画API修改视图的缩放变换，同时确保视图始终保持圆形。下面是针对你代码的优化方案：

关键优化点 #

• 提前将UIView设置为圆形：在视图初始化或布局阶段就设置cornerRadius，避免动画过程中形状突变
• 确保动画流畅：使用UIKit的animate(withDuration:...)方法处理缩放变换，保持动画连贯性
• 动态适配屏幕：根据屏幕尺寸计算放大倍数，确保圆形能完全覆盖屏幕

优化后的完整代码 #

import UIKit

class FirstViewController: UIViewController {
    private let circleView: UIView = {
        let view = UIView()
        view.backgroundColor = UIColor(red: 0.63, green: 0.14, blue: 0.92, alpha: 1.00)
        view.translatesAutoresizingMaskIntoConstraints = false
        // 初始就设置为圆形（宽高100，圆角取一半）
        view.layer.cornerRadius = 50
        view.clipsToBounds = true
        return view
    }()
    
    private let imageView: UIImageView = {
        let imageView = UIImageView()
        imageView.image = UIImage(named: "logo-purple") // 示例图片
        imageView.contentMode = .scaleAspectFit
        imageView.translatesAutoresizingMaskIntoConstraints = false
        return imageView
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white
        
        setupViews()
        animateCircleView()
    }
    
    private func setupViews() {
        view.addSubview(circleView)
        view.addSubview(imageView)
        
        // 为circleView设置约束（初始在屏幕中心，尺寸100x100）
        NSLayoutConstraint.activate([
            circleView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            circleView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
            circleView.widthAnchor.constraint(equalToConstant: 100),
            circleView.heightAnchor.constraint(equalToConstant: 100)
        ])
        
        // 为imageView设置约束（居中显示，尺寸128x128）
        NSLayoutConstraint.activate([
            imageView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            imageView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
            imageView.widthAnchor.constraint(equalToConstant: 128),
            imageView.heightAnchor.constraint(equalToConstant: 128)
        ])
    }
    
    private func animateCircleView() {
        // 延迟0.5秒触发动画，让视图完全加载后开始
        DispatchQueue.main.asyncAfter(deadline: .now() + 0.5) {
            // 计算适配屏幕的放大倍数：取屏幕最大边除以初始宽度100
            let screenBounds = UIScreen.main.bounds
            let maxScreenDimension = max(screenBounds.width, screenBounds.height)
            let scaleFactor = maxScreenDimension / 100
            
            UIView.animate(withDuration: 2.0, delay: 0, options: .curveEaseOut, animations: {
                // 应用缩放变换，让圆形放大到覆盖整个屏幕
                self.circleView.transform = CGAffineTransform(scaleX: scaleFactor, y: scaleFactor)
            }, completion: { _ in
                // 动画结束后跳转页面
                self.performSegue(withIdentifier: "toWelcome", sender: self)
            })
        }
    }
}

代码说明 #

1. 圆形初始化：在circleView的初始化闭包中直接设置圆角为初始宽高的一半，配合clipsToBounds，确保视图从一开始就是圆形，避免动画过程中形状突然变化。
2. 动态缩放计算：根据当前设备的屏幕尺寸计算缩放比例，保证圆形能完全覆盖屏幕，解决固定缩放倍数在不同设备上效果不一致的问题。
3. 动画执行逻辑：使用UIView.animate修改视图的transform属性实现缩放动画，.curveEaseOut选项让动画结尾自然减速，提升视觉体验。

内容的提问来源于stack exchange，提问作者Chris Hansen