UIButton.Configuration 初心者の @zrn-ns です。

UIButton.Configuration.plain() ベースのボタンを作った際、以下のようなコードを書いたのですが、 勝手に白いハイライトが当たる状態になりました。

import UIKit
import PlaygroundSupport

let button: UIButton = .init()
button.configuration = {
    var config: UIButton.Configuration = .plain()
    config.title = "hoge"
    config.baseForegroundColor = .darkGray
    return config
}()

PlaygroundPage.current.setLiveView(button)

かなり見づらいですが、ハイライト色を設定していないにも関わらず、タップ時に白いハイライトが当たっています。

試行錯誤

configurationUpdateHandler を実装して、ボタンの状態が変わったときに色を変えたら良いよ！という記事もあったのですが、こちらも同様に、勝手にハイライトが当たってしまいます。

答え

AttributedStringでタイトルを設定することでハイライトが無効化されます。

import UIKit
import PlaygroundSupport

let button: UIButton = .init()
button.configuration = {
    var config: UIButton.Configuration = .plain()
    config.attributedTitle = .init("hoge", attributes: .init([
        .foregroundColor: UIColor.darkGray
    ]))
    return config
}()

PlaygroundPage.current.setLiveView(button)

もしハイライト色を任意の色に変更したい場合は、以下のように configurationUpdateHandler で attributedTitle の色を変えてあげれば良さそうです。

let button: UIButton = .init()
button.configuration = .plain()
button.configurationUpdateHandler = { button in
    let attributes: AttributeContainer = .init([
        .foregroundColor: button.isHighlighted ? UIColor.green : UIColor.blue
    ])
    button.configuration?.attributedTitle = .init("hoge", attributes: attributes)
}