首页 > 解决方案 > UIView 轮播 Xcode

问题描述

我对 Xcode 很陌生。我看过一个水平旋转木马的例子(见下面的截图),它允许在不同的视图中滑动。红色框表示与视图一起移动的另一张幻灯片。我很困惑实现这样的功能需要哪些元素。请建议我该怎么做

在此处输入图像描述

标签: iosiphoneswiftxcode

解决方案


这是我的方法:

这个想法是使用 UIPickerView 并将其旋转 90 度。

var pickerView: UIPickerView!
@IBOutlet weak var pickerViewContainer: UIView!
var dataHolder = ["...", "July", "August", "This Month", "..."]

override func viewDidLoad() {
    super.viewDidLoad()
    // Initialization code
    pickerView = UIPickerView(frame: CGRect(x: 0, y: 0, width: 339, height: 60))

    pickerView.delegate = self
    pickerView.dataSource = self

    pickerView.transform = CGAffineTransform(rotationAngle: 90 * (.pi / 180))
    pickerView.frame = CGRect(x: -60, y: 0, width: pickerViewContainer.frame.width+120, height: pickerViewContainer.frame.height)

    pickerViewContainer.addSubview(pickerView)
}

有了它,您可以水平滚动。

现在您只需将行的视图向后旋转 90 度。

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

    let view = UIView(frame: CGRect(x: 0, y: 5, width: 50, height: 60))
    view.transform = CGAffineTransform(rotationAngle: (-90 * (.pi / 180)))

    let label = UILabel(frame: view.frame)
    label.text = dataHolder[row]
    label.textAlignment = .center
    view.addSubview(label)

    return view
}

当然,您需要实现所有其他数据源和委托方法,例如

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

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

func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
    print(dataHolder[row])
}

不要忘记

UIPickerViewDelegate, UIPickerViewDataSource

然后,您需要做的就是将 UIView 添加到故事板中您的选择器应该位于的 viewController 中,并将其与@IBOutlet weak var pickerViewContainer: UIView!

也许您需要在代码中使用帧编号以很好地显示它并根据您的需要调整帧。


推荐阅读