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

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.