Многофункциональные списки для Ангуляр
Привет всем уважаемые читатели.
Более года назад я решил сделать универсальное решение с открытым исходным кодом для визуализации списков. И по "счастливой случайности" я почти за полтора года не смог найти работу в РФ, что дало старт заняться разработкой интересного инструмента для создания высокопроизводительных, многофункциональных списков. В первых версиях я отрабатывал технологию виртуализации с различными параметрами, было много исследований и вопросов. Сегодня же состоялся релиз X.12.X версии, которая работает под управлением Ангуляр 14-22. Хочу рассказать на что способен инструмент многофункциональных списков, какие задачи решает и проведу краткий обзор с демонстрацией примеров.
Все приведенные ниже примеры содержатся в документации с примерами кода.
Инструмент многофункциональныого списка для Ангуляр это виртуализированные, высокопроизводительные списки с множеством различного функционала, которого нет у стандартных списков.
Библиотека многофункциональных списков для Ангуляр сосредоточена на визуализации списков с фиксированными по размеру элементами (наиболее быстрый алгоритм визуализации) и списков с динамическими по размеру элементами.
Под капотом реализован кастомный механизм обработки прокрутки, поэтому на десктопе можно подобно как на мобильных устройствах прокручивать списки движением мыши или тачпада.
В функционале имеется привязка прокрутки к элементам списка с различными параметрами выравнивания. И события типа onSnap, которые отлично подходят в качестве сигналов "фокусировки" элемента при прокрутке.
Любой список с всевозможными настройками можно сделать как бесконечный список, который будет зацикливать коллекции элементов.
Для каждого элемента коллекции можно указать набор метаданных, которые будут определять поведение и размеры элементов на экране.
Первые версии многофункциональных списков для Ангуляр были сосредоточены на создании именно мессенджера, было много упущений и дефектов. Сейчас же это полностью оттестированный и отлаженный функционал с возможностью прикрепления прокрутки к нижнему или верхнему краю при вертикальной ориентации списка, lazy подгрузка элементов при достижении начала или конца списка, навигации элементов с помощью клавиатуры и многое другое.
В качестве примера с обработкой больших коллекций можно отнести ленту новостей или вьювер для онлайн магазина. Благодаря виртуализации элементов, производительность списков с большими коллекциями стабильно высокая.
Списки можно дробить на колонки в вертикальной ориентации или строки в горизонтальной. А с помощью метаданных для элементов списка можно назначить принудительно размер на всю ширину или высоту списка, применять к ряду элементов stickyLayout, тем самым можно реализовать подобный макет расположения элементов, как представлено выше.
Многофункциональный список для Ангуляр может применять трансформации элементов, добавлять глубину резкости и эффекты размытия в движении. Выше представлена демонстрация навигации элементов с помощью "смахивания".
П.С.: Если понравился проект, ставьте звездочку ⭐ Многофункциональный список для Ангуляр