Сделать СУПЕР БЫСТРЫЙ список с UITableView

Я написал пост, чтобы показать вам, как гибко настроить пользовательский интерфейс с помощью UITableView. Прочтите это здесь и пример создания GrabRewards.

Сегодня я напишу о своем любимом способе создания динамического списка. я называю это knListController. Тебе понравится.

Я учусь этому у Брайана Вунга, в Давайте создадим это приложение. Супер крутой разработчик, за которым стоит следить.
Вы должны просмотреть это видео, прежде чем продолжать это. Поговорим с вами через 27 минут.

knListController это UIViewController с UITableView. Вы можете понять, почему я выбираю этот путь вместо UITableViewController здесь.

knListController требует 2 фактора, когда вы наследуете от него:

  • Класс ячеек, который наследуется от knListCell
  • Модель данных

knListController зарегистрирует вашу камеру и сделает все остальное за вас.

Download the стартовый проект в филиале master.

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

Модель

struct Book {
    var title: String?
    var author: String?

    init(title: String, author: String) {
        self.title = title
        self.author = author
    }
}

Простая модель. Вы можете добавить другие вещи внутрь, я не хочу усложнять это с URL-адресом обложки, годом публикации, …

KISS принцип

Клетка

// (1)
class BookCell: knListCell<Book> { 
  // (2)
    override var data: Book? { didSet {
        titleLabel.text = data?.title
        authorLabel.text = data?.author
    }}

  // (3)
    let titleLabel = UIMaker.makeLabel(font: UIFont.boldSystemFont(ofSize: 17),
                                       color: UIColor.black)
    let authorLabel = UIMaker.makeLabel(font: UIFont.systemFont(ofSize: 14),
                                       color: UIColor.gray)
  // (4)
    override func setupView() {
        addSubviews(views: titleLabel, authorLabel)

        titleLabel.horizontal(toView: self, space: 24)
        titleLabel.bottom(toAnchor: centerYAnchor, space: -4)

        authorLabel.horizontal(toView: titleLabel)
        authorLabel.verticalSpacing(toView: titleLabel, space: 8)
    }
}

(1):

Ячейка должна быть унаследована от knListCell, и вы должны передать свою модель в наследование. Модель, которую вы передаете в класс, является основной моделью ячейки.

(2):

Тип data и добавить didSet для установки данных в пользовательский интерфейс. Он уже настроен в knListCell

(3) и (4)

Это ваши элементы управления пользовательским интерфейсом и способы настройки макета. Вы можете делать все, что хотите.

Контроллер

// (1)
class ViewController: knListController<BookCell, Book> {

  // (2)
    override func setupView() {
        rowHeight = 72
        view.addFill(tableView)
        fetchData()
    }
  
    override func fetchData() {
        datasource = [
            Book(title: "Becoming", author: "Michelle Obama"),
            Book(title: "Girl, Wash Your Face: Stop Believing the Lies About Who You Are so You Can Become Who You Were Meant to Be", author: "Rachel Hollis"),
            Book(title: "The Wonky Donkey ", author: "Craig Smith"),
            Book(title: "Fire and Fury: Inside the Trump White House", author: "Michael Wolff"),
        ]
    }
}

(1):

Контроллер наследуется от knListController который требовал вашего типа данных в определении.

Для этого требуется ваш тип ячейки (который наследуется от knListCell) и ваша модель.

(2):

  • Вы можете указать высоту ячейки, установив значение rowHeight.
  • Настройка макета для UITableView. Некоторым пользовательским интерфейсам требуется, чтобы UITableView заполнил 3/4 экрана или определенный макет. Это твоя работа.
  • Получить данные с сервера. Вы можете положить его в viewWillAppear или где-то, на ваше усмотрение.
  • Вы можете установить UITableView contentInsets с помощью
contentInset = your_inset
super.setupView()

Время бежать

  • Вы не можете переопределить UITableViewDelegate в своем собственном классе.
    • Ситуация: Вы хотите добавить tableView:willDisplay:forRowAt. Это вообще не работает.
    • Решение: Вы должны добавить эту функцию в knListController и переопределить в своем классе.
    • Если вы найдете какие-либо решения, пожалуйста, ПОЖАЛУЙСТА, дайте мне знать. Я с нетерпением жду решений.
  • Не работает с раскадровкой.
    • Если вы поклонник раскадровки, найдите решение. Любви от тебя.
    • Я фанат верстки по коду, неважно со мной. 😃

Достаточно быстро? Это быстро для меня и очень помогает мне в моей работе. Надеюсь, это поможет вам.
Готовый код находится в ветке completed на Гитхаб.

Наслаждайтесь кодированием.

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *