Реализация выпадающего выбора поведения в приложениях iOS

Как и радиокнопки и флажки , iOS не предоставляет встроенный элемент управления «выпадающим», как это обычно бывает на других платформах. Исторически, было возможно эмулировать этот тип управления, используя контроллер popover; однако до недавнего времени эта опция была доступна только на устройствах iPad и iPhone 6+ в горизонтальной ориентации. Начиная с iOS 9, теперь всплывающие окна можно использовать на любом устройстве с поддержкой iOS, что позволяет разработчикам использовать эту популярную абстракцию независимо от форм-фактора или ориентации устройства.

Эта статья иллюстрирует реализацию простого раскрывающегося списка, который позволяет пользователю указать цвет фона для представления. Доступ к списку можно получить, нажав кнопку «Цвет» на панели навигации приложения:

Реализация

Основное представление в приложении управляется классом с именем SelectionViewController, который представлен в контроллере навигации. Элемент кнопки правой панели контроллера, помеченный «Цвет», обеспечивает доступ к раскрывающемуся списку. В viewDidLoadметоде SelectionViewControllerсоздает элемент кнопки панели и назначает метод обработчика действия, который будет вызываться при касании элемента. Он также инициализирует экземпляр ColorPickerViewControllerкласса контроллера, который будет использоваться для представления пользователю списка вариантов цвета:

class SelectionViewController: UIViewController, UIPopoverPresentationControllerDelegate, UITableViewDelegate {
    let colorPickerViewController = ColorPickerViewController()

    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = UIColor.whiteColor()

        title = "Color Picker"

        navigationItem.rightBarButtonItem = UIBarButtonItem(title: "Color", style: UIBarButtonItemStyle.Plain, target: self, action: "showColorPicker")

        colorPickerViewController.modalPresentationStyle = .Popover
        colorPickerViewController.tableView.delegate = self
    }

    func showColorPicker() {
        ...
    }

    func adaptivePresentationStyleForPresentationController(controller: UIPresentationController) -> UIModalPresentationStyle {
        ...
    }

    func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
        ...
    }
}

func showColorPicker() {
    let colorPickerPresentationController = colorPickerViewController.presentationController as! UIPopoverPresentationController

    colorPickerPresentationController.barButtonItem = navigationItem.rightBarButtonItem
    colorPickerPresentationController.backgroundColor = UIColor.whiteColor()
    colorPickerPresentationController.delegate = self

    presentViewController(colorPickerViewController, animated: true, completion: nil)
}

func adaptivePresentationStyleForPresentationController(controller: UIPresentationController) -> UIModalPresentationStyle {
    return .None
}

class ColorPickerViewController: UITableViewController {
    override func loadView() {
        view = LMViewBuilder.viewWithName("ColorPickerView", owner: self, root: nil)
    }

    override func viewWillAppear(animated: Bool) {
        tableView.layoutIfNeeded()

        preferredContentSize = tableView.contentSize
    }
}

<LMTableView style="plainTableView" estimatedSectionHeaderHeight="0" estimatedSectionFooterHeight="0">
    <?sectionSelectionMode singleCheckmark?>

    <UITableViewCell textLabel.text="Red" value="#ff0000"/>
    <UITableViewCell textLabel.text="Yellow" value="#ffff00"/>
    <UITableViewCell textLabel.text="Green" value="#00ff00"/>
    <UITableViewCell textLabel.text="Blue" value="#0000ff"/>
    <UITableViewCell textLabel.text="Purple" value="#ff00ff"/>
</LMTableView>

func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
    let cell = tableView.cellForRowAtIndexPath(indexPath)

    self.view.backgroundColor = LMViewBuilder.colorValue(cell!.value as! String)

    dismissViewControllerAnimated(true, completion: nil)
}