MDCChipField Swift — направление прокрутки

Я пытаюсь использовать MDCChipField, компонент дизайна материалов для Swift. Я реализую тип «чип ввода» и могу добавить введенный текст в виде чипа с помощью

let mdcSearchField = MDCSearchField()
mdcSearchField.addChip(chipView)

Когда чипы переполняются в MDCChipField, они добавляются в следующую строку. Как установить горизонтальное направление прокрутки вместо вертикального?

В ссылке https://material.io/design/components/chips.html#input-chips, в разделе размещения объясняется

Входные микросхемы могут быть интегрированы с другими компонентами. Они могут появиться:

 - Inline with the text input cursor in a field
 - In a stacked list
 - In a horizontally scrollable list

Как сделать горизонтально прокручиваемый список в коде?

Спасибо.


person anoo_radha    schedule 08.07.2019    source источник


Ответы (1)


Мой подход был таким:

  • Создайте прокручиваемый вид
  • создайте смещение, скажем, 10 для заполнения между чипами
  • Добавить фишки в прокручиваемый вид
  • Установите начало кадра чипа с заявленным смещением
  • Добавьте ширину чипа к смещению плюс начальное значение смещения (в данном случае 10).
  • Увеличьте ширину содержимого прокручиваемого представления, установите ширину на общее смещение
  • (добавить больше фишек/повторить)

Снятие стружки (при необходимости)

  • Установите начальное смещение обратно на 10
  • Удалить чип из родительского прокручиваемого представления
  • Прокрутите подвиды и снова установите смещение для каждого из них.
  • Установите новую ширину прокручиваемого представления, используя общее смещение

Вот пример в Swift Configure начальный макет

class ChipSample
{
    var tagXOffset = 10
    var tagPadding = 10
    func configureTagsView()
    {
        tagView = UIScrollView(frame: CGRect(x: 0, y: 120, width: view.bounds.width, height: 40))
        view.addSubview(tagView)
    }

Добавить чип

    func addChip(name:String)
    {
        let chip = MDCChipView()
        chip.titleLabel.text = name
        chip.setTitleColor(.gray, for: .normal)
        chip.sizeToFit()
        chip.addTarget(self, action: #selector(removeChip), for: .touchUpInside)
        tagView.addSubview(chip)
        chip.frame.origin.x = tagXOffset
        chip.frame.origin.y = 0
        tagXOffset += tagPadding + chip.frame.width
        tagView.contentSize = CGSize(width: tagXOffset, height: tagViewHeight)
    }

Удалить чип

    @objc func removeChip(sender: MDCChipView!)
    {
        tagXOffset = tagPadding
        sender.removeFromSuperview()
        for subview in tagView.subviews {
            subview.frame.origin.x = tagXOffset
            tagXOffset += tagPadding + subview.frame.width
        }
    }
person Tlacaelel Ramon Luis    schedule 18.02.2020