带有圆形图像视图的自定义圆形 UIButton

Posted 2023-02-27

【中文标题】带有圆形图像视图的自定义圆形 UIButton

【英文标题】：Custom Round UIButton with Round Image View

【发布时间】：2019-11-10 10:49:07

【问题描述】：

我为 UIButton 创建了一个自定义类，我曾经使用 @IBInspectable 为我的按钮添加圆角和阴影。

现在，我想使用相同的按钮为个人资料图片选择器创建一个圆形按钮。用户点击圆形按钮，显示照片库，用户选择一张照片并将所选图像添加到圆形按钮。

我的问题是用户选择图片后，按钮的imageView是方形的而不是圆形的。

我尝试使用按钮的 imageView 层并尝试将其设置为 clipsToBounds 或 maskToBounds 但我认为我遗漏了一些东西。

这是没有 ImageView 的自定义按钮的代码：

import UIKit

class RoundShadowButton: UIButton 

    override init(frame: CGRect)
        super.init(frame: frame)
        imageView?.clipsToBounds = true
    

    required init?(coder aDecoder: NSCoder) 
        super.init(coder: aDecoder)
        imageView?.clipsToBounds = true
    


 @IBInspectable
     var cornerRadius: CGFloat 
         get 
            return layer.cornerRadius
         
         set 
             layer.cornerRadius = newValue
         
     

     @IBInspectable
     var borderWidth: CGFloat 
         get 
             return layer.borderWidth
         
         set 
             layer.borderWidth = newValue
         
     

     @IBInspectable
     var borderColor: UIColor? 
         get 
             let color = UIColor.init(cgColor: layer.borderColor!)
             return color
         
         set 
             layer.borderColor = newValue?.cgColor
         
     

     @IBInspectable
     var shadowRadius: CGFloat 
         get 
             return layer.shadowRadius
         
         set 
            layer.shadowRadius = newValue
         
     
     @IBInspectable
     var shadowOffset : CGSize

         get
             return layer.shadowOffset
         set
             layer.shadowOffset = newValue
         
     

     @IBInspectable
     var shadowColor : UIColor
         get
             return UIColor.init(cgColor: layer.shadowColor!)
         
         set 
             layer.shadowColor = newValue.cgColor
         
     
     @IBInspectable
     var shadowOpacity : Float 

         get
             return layer.shadowOpacity
         
         set 
             layer.shadowOpacity = newValue
         
     
 

【参考方案1】：

我认为除非您为按钮设置图像，否则按钮的imageView 是nil。您应该将 maskToBounds 设置为您的按钮，或者在设置图像后将其设置为 imageView。另外，请检查您的圆角半径，如果您有基于框架的方法，在自动布局期间您可以根据.zero 框架设置圆角半径

【讨论】：

不幸的是，如果我操作 maskToBounds 我不能再有阴影了。但是感谢您的其他建议！