swift 设置UIbutton图片文字位置布局

1.图片在右文字在左
image.png
 lazy var editBtn: UIButton = {
        var btn = UIButton()
        btn.clipsToBounds = true
        btn.layer.cornerRadius = 12
        btn.backgroundColor = UIColor("#FE4C5A")
        btn.setTitle("编辑资料", for: .normal)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.boldSystemFont(ofSize: 10)
        btn.setImage(UIImage(named: "me_right_white"), for: .normal)
        //图片在右
        //self.titleEdgeInsets = UIEdgeInsetsMake(0, -(img_w+spacing), 0, (img_w+spacing))
//        self.imageEdgeInsets = UIEdgeInsetsMake(0, (title_w+spacing), 0, -(title_w+spacing))
        btn.titleEdgeInsets = UIEdgeInsets(top: 0, left: -(7 + 4), bottom: 0, right: (7 + 4))
        btn.imageEdgeInsets = UIEdgeInsets(top: 0, left: (40 + 4), bottom: 0, right: -(40 + 4))
        return btn
    }()

2.图片在左文字在右
image.png
  lazy var loveBtn: UIButton = {
        var btn = UIButton()
        btn.clipsToBounds = true
        btn.layer.cornerRadius = 12
        btn.backgroundColor = .white
        btn.setTitle("心动", for: .normal)
        btn.setTitleColor(UIColor("#636366"), for: .normal)
        btn.titleLabel?.font = UIFont.boldSystemFont(ofSize: 10)
        btn.setImage(UIImage(named: "home_heart_white@2x"), for: .normal)
        btn.setImage(UIImage(named: "home_heart_red@2x"), for: .selected)
//        btn.titleEdgeInsets = UIEdgeInsets(top: 0, left: 4/2, bottom: 0, right: -4/2)
//        btn.imageEdgeInsets = UIEdgeInsets(top: 0, left: -4/2, bottom: 0, right: 4/2)
        btn.titleEdgeInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: -4)
        btn.imageEdgeInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
        return btn
    }()

方法二: 加在extension UIbutton里


extension UIButton {
    //MARK: - 按枚举将 btn 的 image 和 title 之间位置处理
    func setupButtonImageAndTitlePossitionWith(padding: CGFloat, style: ButtonImageAndTitlePossitionStyle){
        let imageRect: CGRect = self.imageView?.frame ?? CGRect.init()
        let titleRect: CGRect = self.titleLabel?.frame ?? CGRect.init()
        let selfWidth: CGFloat = self.frame.size.width
        let selfHeight: CGFloat = self.frame.size.height
        let totalHeight = titleRect.size.height + padding + imageRect.size.height
        switch style {
        case .imageIsLeft:
            self.titleEdgeInsets = UIEdgeInsets(top: 0, left: padding / 2, bottom: 0, right: -padding / 2)
            self.imageEdgeInsets = UIEdgeInsets(top: 0, left: -padding / 2, bottom: 0, right: padding / 2)
        case .imageIsRight:
            self.titleEdgeInsets = UIEdgeInsets(top: 0, left: -(imageRect.size.width + padding/2), bottom: 0, right: (imageRect.size.width + padding/2))
            self.imageEdgeInsets = UIEdgeInsets(top: 0, left: (titleRect.size.width + padding / 2), bottom: 0, right: -(titleRect.size.width +  padding/2))
        case .imageIsTop :
            self.titleEdgeInsets = UIEdgeInsets(top: ((selfHeight - totalHeight) / 2 + imageRect.size.height + padding - titleRect.origin.y), left: (selfWidth / 2 - titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2, bottom: -((selfHeight - totalHeight) / 2 + imageRect.size.height + padding - titleRect.origin.y), right: -(selfWidth / 2 - titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2)
            self.imageEdgeInsets = UIEdgeInsets(top: ((selfHeight - totalHeight) / 2 - imageRect.origin.y), left: (selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2), bottom: -((selfHeight - totalHeight) / 2 - imageRect.origin.y), right: -(selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2))
        case .imgageIsBottom:
            self.titleEdgeInsets = UIEdgeInsets(top: ((selfHeight - totalHeight) / 2 - titleRect.origin.y), left: (selfWidth / 2 - titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2, bottom: -((selfHeight - totalHeight) / 2 - titleRect.origin.y), right: -(selfWidth/2 - titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2)
            self.imageEdgeInsets = UIEdgeInsets(top: ((selfHeight - totalHeight) / 2 + titleRect.size.height + padding - imageRect.origin.y), left: (selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2), bottom: -((selfHeight - totalHeight) / 2 + titleRect.size.height + padding - imageRect.origin.y), right: -(selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2))
        default:
            self.titleEdgeInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
            self.imageEdgeInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
        }
    }
}

调用:注意如果按钮是动态宽度的话,要先设置宽度

editBtn.setTitle(editTitle, for: .normal)
        editBtn.snp.updateConstraints { make in
            make.width.equalTo(editWidth)
        }
        
        editBtn.setupButtonImageAndTitlePossitionWith(padding: 4, style: .imageIsRight)

你可能感兴趣的:(swift 设置UIbutton图片文字位置布局)