iOS开发：点击按钮启动计时器，如何替换按钮内图片为计时文本？

我来帮你搞定这个问题！你现在遇到的核心问题是：UIButton的图片和标题默认会同时显示，而且你直接修改titleLabel?.text的方式不对，再加上没把原来的图片隐藏，所以才会出现图片不消失、文本也没正常显示的情况。

问题根源 #

1. UIButton的image和title是独立的两个元素，默认会并排显示（图片在左，标题在右），如果你不清空图片，就算设置了标题，也会被图片挡住或者和图片共存，看起来像是文本没出来。
2. 直接修改titleLabel?.text不是UIButton推荐的设置标题方式，这种操作不会触发按钮的内部布局更新，可能导致标题不显示或者显示异常。

解决方案 #

我们只需要调整两个关键步骤：清空按钮图片、用正确的方法设置标题。

1. 修改启动计时的方法

在点击按钮启动计时时，先把按钮的图片清空，同时初始化标题的样式：

@objc func timeClock(){
    // 清空按钮的图片，让原来的图标消失
    timerImage.setImage(nil, for: .normal)
    // 设置初始计时标题（这里设为0，你可以根据需求调整）
    timerImage.setTitle("0", for: .normal)
    // 可选：设置标题颜色，适配你的按钮背景
    timerImage.setTitleColor(.black, for: .normal)
    // 启动计时器
    timer = Timer.scheduledTimer(timeInterval: 1, target: self, selector: #selector(Action), userInfo: nil, repeats: true)
}

2. 修改计时更新的方法

在每秒更新计时的时候，用UIButton的setTitle方法来更新数字，而不是直接改titleLabel?.text：

@objc func Action(){
    timerDisplayed += 1
    // 用setTitle实时更新按钮标题
    timerImage.setTitle(String(timerDisplayed), for: .normal)
}

额外提示 #

如果之后需要停止计时并恢复按钮的初始图片，只需要在停止计时器的方法里做如下操作：

// 停止计时器
timer?.invalidate()
timer = nil
// 恢复按钮图片
timerImage.setImage(image1, for: .normal)
// 清空标题
timerImage.setTitle(nil, for: .normal)

这样就能完美实现“点击按钮后图片消失，取而代之显示计时数字”的效果啦！

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