Swift 4：如何将相册图片设置为圆形用户头像UIButton背景？

嘿，看起来你已经搞定了唤起图片选择器的核心代码，接下来只需要补全代理方法，同时确保图片能完美适配你的圆形按钮就行！我来帮你把代码补全并说明关键细节：

第一步：确保ViewController遵循必要的代理协议 #

首先要在你的ViewController类声明里加上UIImagePickerControllerDelegate和UINavigationControllerDelegate，不然代理方法不会生效：

class YourViewController: UIViewController, UIImagePickerControllerDelegate, UINavigationControllerDelegate {
    // 这里连接你的圆形头像按钮
    @IBOutlet weak var avatarButton: UIButton!
    
    // ... 其他代码
}

第二步：补全图片选择完成的代理方法 #

你之前写到一半的imagePickerController方法，我们把它补全，同时加上取消选择的处理逻辑：

func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any]) {
    // 先关闭图片选择器
    picker.dismiss(animated: true, completion: nil)
    
    // 从info字典里取出选中的原图
    guard let selectedImage = info[.originalImage] as? UIImage else {
        print("获取图片失败，请重试")
        return
    }
    
    // 把图片设置到按钮上——这里推荐用setImage而不是setBackgroundImage
    avatarButton.setImage(selectedImage, for: .normal)
}

// 处理用户取消选择的情况
func imagePickerControllerDidCancel(_ picker: UIImagePickerController) {
    picker.dismiss(animated: true, completion: nil)
}

第三步：确保按钮和图片保持圆形 #

如果你的按钮还没设置圆形样式，记得在viewDidLoad里加上这段配置，保证图片显示时也是圆形的：

override func viewDidLoad() {
    super.viewDidLoad()
    setupAvatarButtonStyle()
}

private func setupAvatarButtonStyle() {
    // 设置圆角为按钮宽度的一半，形成圆形
    avatarButton.layer.cornerRadius = avatarButton.frame.size.width / 2
    // 必须开启裁剪，否则图片超出圆角的部分会显示出来
    avatarButton.clipsToBounds = true
    // 设置图片填充模式，保证图片比例不变且填满按钮
    avatarButton.contentMode = .scaleAspectFill
    // 如果一定要用背景图，记得给按钮设置同样的contentMode
    // avatarButton.setBackgroundImage(selectedImage, for: .normal)
    // avatarButton.contentMode = .scaleAspectFill
}

额外小技巧：允许用户裁剪头像 #

如果想让用户可以裁剪选中的图片（更符合头像场景的需求），只需要把image.allowsEditing = false改成true，然后在代理方法里取编辑后的图片：

// 唤起选择器时开启编辑功能
@IBAction func choseAvatar(_ sender: Any) {
    let imagePicker = UIImagePickerController()
    imagePicker.delegate = self
    imagePicker.sourceType = .photoLibrary
    imagePicker.allowsEditing = true // 改成true
    self.present(imagePicker, animated: true, completion: nil)
}

// 代理方法里取裁剪后的图片
func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any]) {
    picker.dismiss(animated: true, completion: nil)
    guard let editedImage = info[.editedImage] as? UIImage else {
        print("获取裁剪后的图片失败")
        return
    }
    avatarButton.setImage(editedImage, for: .normal)
}

这样设置后，你的圆形头像按钮就能完美显示用户选中的图片啦！

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