[Swift] How to fix Label in UIPickerView

Introduction

It is a method to fix Label such as "min" "sec" below in PickerView. It doesn't move even if you slide it up and down! I couldn't do this because I wanted to do it, but I'll introduce it because the mystery has been solved.

[reference] https://medium.com/@luisfmachado/uipickerview-fixed-labels-66f947ded0a8

Method

① Add a method to UIPickerViewClass with extension

Write the following code.

extension UIPickerView {
    func setPickerLabels(labels: [Int:UILabel]) { // [component number:label]
        
        let fontSize:CGFloat = 20
        let labelWidth:CGFloat = self.frame.size.width / CGFloat(self.numberOfComponents)
        let x:CGFloat = self.frame.origin.x
        let y:CGFloat = (self.frame.size.height / 2) - (fontSize / 2)

        for i in 0...self.numberOfComponents {
            
            if let label = labels[i] {
                label.frame = CGRect(x: labelWidth * CGFloat(i), y: y, width: labelWidth, height: fontSize)
                label.font = UIFont.systemFont(ofSize: fontSize, weight: .light)
                label.backgroundColor = .clear
                label.textAlignment = NSTextAlignment.center
                self.addSubview(label)
            }
        }
    }
}

② Used in titleForRow

Next, actually use the method written in extension earlier. Below is all the code needed to implement PickerView, but the actual method usage is at "titleForRow". The place to actually use is marked.

class SettingTimerViewController: UIViewController {
    
    var secIntArray = [Int](0...59)
    var minIntArray = [Int](1...10)
    
    let settingTimerPickerView = UIPickerView()
    let setTimeButton = UIButton()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
       setUpView()
        
    }
    
    func setUpView() {
        //PickerView
        settingTimerPickerView.frame.size.width = 240
        settingTimerPickerView.frame.size.height = self.view.frame.size.height/3
        settingTimerPickerView.layer.position = CGPoint(x: self.view.frame.width/2, y:self.view.frame.size.height/3)
        self.view.addSubview(settingTimerPickerView)
        settingTimerPickerView.delegate = self
        settingTimerPickerView.dataSource = self
    }
}

extension SettingTimerViewController: UIPickerViewDelegate, UIPickerViewDataSource {
    
    func numberOfComponents(in pickerView: UIPickerView) -> Int {
        return 4
    }
    
    func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
        switch component {
        case 0:
            return minIntArray.count
        case 1:
            return 1
        case 2:
            return secIntArray.count
        case 3:
            return 1
        default:
            return 0
        }
    
    }
    
　　//Use the method in this.
    func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
        switch component {
        case 0:
            return String(minIntArray[row])
        case 1:
            let min = UILabel() 
            min.text = "min"  //Enter the Label name you want to display instead of min.
            settingTimerPickerView.setPickerLabels(labels: [1: min]) //It is okay if you enter the same number as the case for 1.
Enter the number of.
            return ""
        case 2:
            return String(secIntArray[row])
        case 3:
            let sec = UILabel()
            sec.text = "sec"　//Enter the Label name you want to display instead of sec.
            settingTimerPickerView.setPickerLabels(labels: [3: sec])　//It is okay if you enter the same number as the case for 3.
Enter the number of.
            return ""
        default:
            return "error"
        }
    }
}