UIPickerView (размер ячеек)

Question

Я пытаюсь сделать горизонтальный UIPivkerView. Я сделал все, но я не понимаю, как установить размер ячейки, потому что некоторые слова слишком длинные. Я попытался узнать длину каждого слова и на его основе установить размер ячейки. Но это не работает для меня. Я заметил, что могу увеличить размер ячейки, если пропорционально увеличу ее размер и ширину.

Мне нужно сделать PickerView с такими же 50 width и 50 height, но я не понимаю, как обращаться с клетками.

Если я установлю значение 85, я получу это:

Если установлено 50:

import UIKit

class ViewController: UIViewController, UIPickerViewDelegate, UIPickerViewDataSource {
    var data = ["Hello", "WorldWorld", "Of", "PickerPickerPicker", "View"]

    let viewPicker = UIPickerView()
    var rotationAngele: CGFloat!

    var width: CGFloat = 85
    var height: CGFloat = 85
    //var width: CGFloat!

    override func viewDidLoad() {
        super.viewDidLoad()

        viewPicker.delegate = self
        viewPicker.dataSource = self

        viewPicker.layer.borderColor = UIColor.black.cgColor
        viewPicker.layer.borderWidth = 1.5

        // Rotation
        rotationAngele = -90 * (.pi / 180)
        viewPicker.transform = CGAffineTransform(rotationAngle: rotationAngele)

        //width = data[4].widthOfString(usingFont: UIFont(name:"verdana", size: 24.0)!)

        // Create
        viewPicker.frame = CGRect(x: 0 - 150, y: 0, width: view.frame.width + 300, height: 85)
        viewPicker.center = self.view.center

        self.view.addSubview(viewPicker)
    }

    func numberOfComponents(in pickerView: UIPickerView) -> Int {
        return 1
    }

    func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
        return data.count
    }

    func pickerView(_ pickerView: UIPickerView, rowHeightForComponent component: Int) -> CGFloat {
        return 85
    }

    func pickerView(_ pickerView: UIPickerView, widthForComponent component: Int) -> CGFloat {
        return 85
    }

    func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {

        //width = data[row].widthOfString(usingFont: UIFont(name:"verdana", size: 24.0)!)

        let view = UIView()
        view.frame = CGRect(x: 0, y: 0, width: 150, height: 150)

        let label = UILabel()
        label.frame = CGRect(x: 0, y: 0, width: 150, height: 150)

        label.textAlignment = .center
        label.font = UIFont(name:"verdana", size: 24.0)!
        label.text = data[row]
        view.addSubview(label)

        view.transform = CGAffineTransform(rotationAngle: 90 * (.pi / 180))

        return view
    }
}

////////////////////////////////////////////////////
extension String {
    func widthOfString(usingFont font: UIFont) -> CGFloat {

        let fontAttributes = [NSAttributedStringKey.font: font]
        let size = self.size(withAttributes: fontAttributes)
        return size.width
    }

    func heightOfString(usingFont font: UIFont) -> CGFloat {
        let fontAttributes = [NSAttributedStringKey.font: font]
        let size = self.size(withAttributes: fontAttributes)
        return size.height
    }
}

Answer 1

Хорошо, когда вы поворачиваете UIPickerView, применяя преобразование, когда вы указываете ширину компонента, вы на самом деле указываете rowHeight.

Не очень ясно, просматриваете ли вы представление, но если вы регистрируете размер кадра, то выпоймет.

Таким образом, вы должны установить pickerView:rowHeightForComponent, чтобы сделать его достаточно широким

func pickerView(_ pickerView: UIPickerView, rowHeightForComponent component: Int) -> CGFloat {
    return 300 // you can calculate this based on your container view or window size
}

Кроме того, вы также можете использовать intrinsicContentSize из UILabel, чтобы определить правильный размерметку и обновите ее фрейм соответственно, чтобы убедиться, что метка также отображается правильно.

 func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {

    let view = UIView()
    view.frame = CGRect(x: 0, y: 0, width: 150, height: 30)

    let label = UILabel()
    label.frame = CGRect(x: 0, y: 0, width: 150, height: 30)

    label.textAlignment = .center
    label.font = UIFont(name:"verdana", size: 24.0)!
    label.text = data[row]
    let updatedLabelSize = label.intrinsicContentSize
    dump(updatedLabelSize)
    label.frame = CGRect(x: 0, y: 0, width: updatedLabelSize.width, height: 30)
    view.frame = CGRect(x: 0, y: 0, width: updatedLabelSize.width, height: 30)
    view.addSubview(label)

    view.transform = CGAffineTransform(rotationAngle: 90 * (.pi / 180))

    return view
}

Вот как на самом деле выглядит UIPickerView при его преобразовании. Красная рамка после трансформации, вещи, которые вы видите Синяя подсветка - это реальная рамка