How to combine repetitive code that just styles segmented control styling?

Question

Beginner here with a beginner question:

I have 3 segmented controls in my view controller and I have 3 nearly identical functions that sets their colors/styling/animation. I know I shouldn't repeat code, but I'm not entirely sure how to combine these. It's prob something obvious but I need to see it done so I can do it other parts of my app. Could someone show me for this example:

class Example: UIViewController {

  @IBOutlet weak var segmentedControl: UISegmentedControl!
    @IBOutlet weak var textSegmentedControl: UISegmentedControl!
    @IBOutlet weak var translationSegmentedControl: UISegmentedControl!

override func viewDidLoad() {
        super.viewDidLoad()

        setMainSegmentedControlStyle()
        setTextSegmentedControlStyle()
        setTranslationSegmentedControlStyle()
}


func setTextSegmentedControlStyle() {
        textSegmentedControl.backgroundColor = .clear
        textSegmentedControl.tintColor = .clear
        textSegmentedControl.setTitleTextAttributes([NSAttributedStringKey.font : UIFont.systemFont(ofSize: 16), NSAttributedStringKey.foregroundColor: UIColor.lightGray
            ], for: .normal)
        textSegmentedControl.setTitleTextAttributes([NSAttributedStringKey.font : UIFont.systemFont(ofSize: 16),
            NSAttributedStringKey.foregroundColor: UIColor.darkGray
            ], for: .selected)
    let textSegmentedUnderline = UIView()

        textSegmentedUnderline.translatesAutoresizingMaskIntoConstraints = false // false since we are using auto layout constraints
        textSegmentedUnderline.backgroundColor = #colorLiteral(red: 0.992502749, green: 0.532302916, blue: 0.08773707598, alpha: 1)
        view.addSubview(textSegmentedUnderline)
        textSegmentedUnderline.topAnchor.constraint(equalTo: textSegmentedControl.bottomAnchor).isActive = true
        textSegmentedUnderline.heightAnchor.constraint(equalToConstant: 3).isActive = true
        textSegmentedUnderline.leftAnchor.constraint(equalTo: textSegmentedControl.leftAnchor).isActive = true
        textSegmentedUnderline.widthAnchor.constraint(equalTo: textSegmentedControl.widthAnchor, multiplier: 1 / CGFloat(textSegmentedControl.numberOfSegments)).isActive = true
        UIView.animate(withDuration: 0.3) {
            self.textSegmentedUnderline.frame.origin.x = (self.textSegmentedControl.frame.width / CGFloat(self.textSegmentedControl.numberOfSegments)) * CGFloat(self.textSegmentedControl.selectedSegmentIndex)
        }
    }

    func setTranslationSegmentedControlStyle() {
        translationSegmentedControl.backgroundColor = .clear
        translationSegmentedControl.tintColor = .clear
        translationSegmentedControl.setTitleTextAttributes([NSAttributedStringKey.font : UIFont.systemFont(ofSize: 16), NSAttributedStringKey.foregroundColor: UIColor.lightGray
            ], for: .normal)
        translationSegmentedControl.setTitleTextAttributes([NSAttributedStringKey.font : UIFont.systemFont(ofSize: 16), NSAttributedStringKey.foregroundColor: UIColor.darkGray
            ], for: .selected)
    let translationSegmentedUnderline = UIView()
       translationSegmentedUnderline.translatesAutoresizingMaskIntoConstraints = false // false since we are using auto layout constraints
        translationSegmentedUnderline.backgroundColor = #colorLiteral(red: 0.992502749, green: 0.532302916, blue: 0.08773707598, alpha: 1)
        view.addSubview(translationSegmentedUnderline)
        translationSegmentedUnderline.topAnchor.constraint(equalTo: textSegmentedControl.bottomAnchor).isActive = true
        translationSegmentedUnderline.heightAnchor.constraint(equalToConstant: 3).isActive = true
        translationSegmentedUnderline.leftAnchor.constraint(equalTo: translationSegmentedControl.leftAnchor).isActive = true
        translationSegmentedUnderline.widthAnchor.constraint(equalTo: translationSegmentedControl.widthAnchor, multiplier: 1 / CGFloat(translationSegmentedControl.numberOfSegments)).isActive = true
        UIView.animate(withDuration: 0.3) {
            self.translationSegmentedUnderline.frame.origin.x = (self.textSegmentedControl.frame.width / CGFloat(self.translationSegmentedControl.numberOfSegments)) * CGFloat(self.translationSegmentedControl.selectedSegmentIndex)
        }
    }

    func setMainSegmentedControlStyle() {
        segmentedControl.backgroundColor = .clear
        segmentedControl.tintColor = .clear
        segmentedControl.setTitleTextAttributes([NSAttributedStringKey.font : UIFont.systemFont(ofSize: 16), NSAttributedStringKey.foregroundColor: UIColor.lightGray
            ], for: .normal)
        segmentedControl.setTitleTextAttributes([NSAttributedStringKey.font : UIFont.systemFont(ofSize: 16),
                                                 NSAttributedStringKey.foregroundColor: UIColor.darkGray
            ], for: .selected)
        let buttonBar = UIView()
        buttonBar.translatesAutoresizingMaskIntoConstraints = false // false since we are using auto layout constraints
        buttonBar.backgroundColor = #colorLiteral(red: 0.992502749, green: 0.532302916, blue: 0.08773707598, alpha: 1)
        view.addSubview(buttonBar)
        buttonBar.topAnchor.constraint(equalTo: segmentedControl.bottomAnchor).isActive = true
        buttonBar.heightAnchor.constraint(equalToConstant: 3).isActive = true
        buttonBar.leftAnchor.constraint(equalTo: segmentedControl.leftAnchor).isActive = true
        buttonBar.widthAnchor.constraint(equalTo: segmentedControl.widthAnchor, multiplier: 1 / CGFloat(segmentedControl.numberOfSegments)).isActive = true
        UIView.animate(withDuration: 0.3) {
            self.buttonBar.frame.origin.x = (self.segmentedControl.frame.width / CGFloat(self.segmentedControl.numberOfSegments)) * CGFloat(self.segmentedControl.selectedSegmentIndex)
        }
    }

}

Answer 1

If all the styling code is exactly the same, you can declare a function that accepts a control as an argument:

func style(control: UISegmentedControl) {
    control.backgroundColor = .clear
    // continue styling here
}

Then simply call that function however many times you need, passing in each control:

style(control: segmentedControl)
style(control: textSegmentedControl)
style(control: translationSegmentedControl)

Note, though, that you should set as much as you can (such as backgroundColor) in your Storyboard rather than code.