Реализация просмотра NFT-коллекций в мобильном приложении
Разница между этой задачей и отображением коллекций в кошельке принципиальная: здесь пользователь просматривает чужие коллекции, исследует маркетплейс, фильтрует по атрибутам и цене. Это уже ближе к e-commerce с криптовалютной спецификой — бесконечная лента с тысячами токенов, сложные фильтры и актуальные цены.
Источники данных для браузера NFT-коллекций
OpenSea API v2 — самый богатый источник: коллекции, токены, floor price, объёмы торгов, события (listings, sales). Для публичного браузинга без аутентификации — GET /api/v2/collection/{slug}/nfts с пагинацией по next cursor. Ограничение: 4 req/sec на бесплатном плане.
Reservoir API — агрегирует данные с OpenSea, Blur, LooksRare, X2Y2. Для приложений с торговыми функциями предпочтительнее: единый endpoint для floor price и best offer независимо от маркетплейса.
Alchemy NFT API — getNFTsForCollection возвращает все токены коллекции с метаданными; getFloorPrice отдаёт floor по маркетплейсам.
Для Solana-коллекций: Magic Eden API (/collections/{symbol}/listings) или Tensor API.
Пагинация и бесконечный скролл
Коллекции типа Bored Ape Yacht Club — 10 000 токенов. Загружать всё сразу нельзя. OpenSea возвращает cursor-based pagination (next в теле ответа). Реализуем через Paging 3 (Android) или самодельный PaginatedViewModel на iOS с AsyncSequence.
На Flutter: infinite_scroll_pagination package. Подгрузка следующей страницы при достижении 80% списка, не при самом конце — иначе пользователь видит пустое место.
Кеш первой страницы в Room/CoreData — при следующем открытии экран появляется мгновенно, данные обновляются в фоне (stale-while-revalidate).
Фильтры и сортировка по атрибутам
Это самая нетривиальная часть. Атрибуты NFT — dynamic schema: у одной коллекции Background, Fur, Eyes, у другой — Rarity, Element, Power. Структура неизвестна заранее.
Подход: при первой загрузке коллекции запрашиваем getContractMetadata или /collection/{slug}/attributes — получаем список trait-типов с вариантами и rarity. Строим UI фильтров динамически: ExpandableSection на trait-тип, Checkbox list на значения.
Фильтрация по атрибутам на стороне API: OpenSea принимает trait_type/value как query params. Reservoir — JSON body с массивом фильтров. Локальная фильтрация работает только если всю коллекцию уже загрузили в кеш — для 10К токенов это нереально.
Сортировка: по цене (asc/desc), по rarity (нужен rarity score — либо считаем сами из атрибутов, либо берём из rarity.tools API). По номеру токена.
Детальная карточка токена
Быстрая загрузка критична. Изображение — сразу в максимальном разрешении, не после тапа. Структура карточки:
- Медиа: изображение, анимированный GIF, видео (AVPlayer / ExoPlayer), 3D (SceneKit / SceneView Flutter)
- Traits в виде чипов с процентом редкости
- Текущий листинг и best offer
- История цен (sparkline-график через Charts framework / MPAndroidChart)
- Кнопка «Купить» — если интегрирован маркетплейс SDK
Переход к карточке — shared element transition: изображение из грида плавно увеличивается. iOS: UIViewControllerTransitioningDelegate + UIPresentationController. Android: sharedElementEnterTransition с Compose sharedBounds.
Сроки
Браузер коллекций с поиском, фильтрами по атрибутам и детальной карточкой — 3-5 дней. С интеграцией торговых функций (listing, buy) — 1-2 недели в зависимости от маркетплейсов.