skip to Main Content

The orange colours show up fine on iphoneXR (device) that has iOS14 and stay orange between dark and light mode. But on an iphone 11 with iOS13 (device), the title colour shows up only as black or white depending on dark/light mode. Why orange being overridden? What can I do to keep the title orange for all devices?

iphone 11 with iOS13 screenshot:

enter image description here

iphone XR with iOS14.2 screenshot:

enter image description here

Using XCode Version 12

I’ve tried:

button.setTitleColor(.systemOrange, for: .normal)
button.setTitleColor(.placeholderText, for: .normal) //this led to a grey color on ios14 as expected but black on iOS13
button.setTitleColor(UIColor.orange, for: .normal)
button.setTitleColor(UIColor.customAccent, for: .normal)

extension UIColor {
  static var customAccent: UIColor {
      if #available(iOS 13, *) {
          return UIColor { (traitCollection: UITraitCollection) -> UIColor in
              if traitCollection.userInterfaceStyle == .dark {
                return UIColor(red: 0.8196078431, green: 0.3568627451, blue: 0.2235294118, alpha: 1.0)
              } else {
                  return UIColor(red: 0.8196078431, green: 0.3568627451, blue: 0.2235294118, alpha: 1.0)
              }
          }
      } else {
          return UIColor(red: 0.8196078431, green: 0.3568627451, blue: 0.2235294118, alpha: 1.0)
      }
  }

The buttons were set up programatically:

    let attributedText = [NSAttributedString.Key.font: UIFont(name: "Poppins-Regular", size: 15.0)!]
    button1.layer.borderColor = #colorLiteral(red: 0.8196078431, green: 0.3568627451, blue: 0.2235294118, alpha: 1)
    button1.layer.borderWidth = 1.0
    button1.setTitleColor(.placeholderText, for: .normal)
    button1.backgroundColor = UIColor.white
    button1.layer.cornerRadius = 32
    button1.clipsToBounds = true
    button1.setAttributedTitle(NSAttributedString(string: "PLACEHOLDER TEXT", attributes: attributedText), for: .normal)
    button1.translatesAutoresizingMaskIntoConstraints = false
    self.addSubview(button1)
    self.addConstraint(NSLayoutConstraint(item: button1, attribute: NSLayoutConstraint.Attribute.height, relatedBy: NSLayoutConstraint.Relation.equal, toItem: nil, attribute: NSLayoutConstraint.Attribute.notAnAttribute, multiplier: 0, constant: 64))
    self.addConstraint(NSLayoutConstraint(item: button1, attribute: NSLayoutConstraint.Attribute.leading, relatedBy: NSLayoutConstraint.Relation.equal, toItem: self, attribute: NSLayoutConstraint.Attribute.leading, multiplier: 1, constant: 45))
    self.addConstraint(NSLayoutConstraint(item: self, attribute: NSLayoutConstraint.Attribute.trailing, relatedBy: NSLayoutConstraint.Relation.equal, toItem: button1, attribute: NSLayoutConstraint.Attribute.trailing, multiplier: 1, constant: 45))
    self.addConstraint(NSLayoutConstraint(item: button1, attribute: NSLayoutConstraint.Attribute.centerX, relatedBy: NSLayoutConstraint.Relation.equal, toItem: self, attribute: NSLayoutConstraint.Attribute.centerX, multiplier: 1, constant: 0))
    self.addConstraint(NSLayoutConstraint(item: button1, attribute: NSLayoutConstraint.Attribute.top, relatedBy: NSLayoutConstraint.Relation.equal, toItem: reScanButton!, attribute: NSLayoutConstraint.Attribute.bottom, multiplier: 1, constant: 15))

2

Answers


  1. I think it is because you are setting two different colors for the same state.

    try changing states of button.

    button.setTitleColor(UIColor.orange, for: .normal)
    button.setTitleColor(UIColor.customAccent, for: .touchUpInside)
    

    Here you can read the documentation: https://developer.apple.com/documentation/uikit/uicontrol/state

    Login or Signup to reply.
  2. If you have a UILabel, you usually don’t want to mix the properties, as you can have strange/mixed results, as you are seeing:

    attributedText
    vs
    text, font, textColor, texAlignment or lineBreakMode

    Same goes for UITextView and UIButton (which has a UILabel under the hood).

    So keeps using NSAttributedString for instance:

    let state: UIControl.State = .normal
    guard let currentAttributedTitle = button.attributedTitle(for: state) else { return }
    let attributedTitle = NSMutableAttributedString(attributedString: currentAttributedTitle)
    attributedTitle.setAttributes([.foregroundColor: color], range: NSRange(location: 0, length: attributedTitle.length))
    button.setAttributedTitle(attributedTitle, for: state)
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search