Реалізація відображення NFT-колекцій у мобільному гаманці

TRUETECH займається розробкою, підтримкою та обслуговуванням мобільних додатків iOS, Android, PWA. Маємо великий досвід та експертизу для публікації мобільних додатків до популярних маркетів Google Play, App Store, Amazon, AppGallery та інші.
8+Років на ринку900+Реалізованих проектів100+Розробників у штаті19+Партнерів

Розробка та підтримка будь-яких видів мобільних додатків:

Інформаційні та розважальні мобільні програми
Новинки, ігри, довідники, онлайн-каталоги, погодні, фітнес та здоров'я, туристичні, освітні, соціальні мережі та месенджери, квіз, блоги та подкасти, форуми, агрегатори
Мобільні програми електронної комерції
Інтернет-магазини, B2B-додатки, маркетплейси, онлайн-обмінники, кешбек-сервіси, біржі, дропшиппінг-платформи, програми лояльності, доставка їжі та товарів, платіжні системи
Мобільні програми для управління бізнес-процесами
CRM-системи, ERP-системи, управління проектами, інструменти для команди продажів, облік фінансів, управління виробництвом, логістика та доставка, управління персоналом, системи моніторингу даних
Мобільні програми електронних послуг
Дошки оголошень, онлайн-школи, онлайн-кінотеатри, платформи надання електронних послуг, платформи кешбеку, відеохостинги, тематичні портали, платформи онлайн-бронювання та запису, платформи онлайн-торгівлі

Це лише деякі з типів мобільних додатків, з якими ми працюємо, і кожен із них може мати свої специфічні особливості та функціональність, а також бути адаптованим під конкретні потреби та цілі клієнта.

Послуги, які ми пропонуємо
Показано 1 з 1Усі 1735 послуг
Реалізація відображення NFT-колекцій у мобільному гаманці
Середній
~3-5 днів
Часті запитання

Наші компетенції:

Етапи розробки

Останні роботи

  • image_mobile-applications_feedme_467_0.webp
    Розробка мобільного додатка для компанії FEEDME
    792
  • image_mobile-applications_xoomer_471_0.webp
    Розробка мобільного додатку для компанії XOOMER
    671
  • image_mobile-applications_rhl_428_0.webp
    Розробка мобільного додатку для компанії RHL
    1097
  • image_mobile-applications_zippy_411_0.webp
    Розробка мобільного додатку для компанії ZIPPY
    969
  • image_mobile-applications_affhome_429_0.webp
    Розробка мобільного додатку для компанії Affhome
    914
  • image_mobile-applications_flavors_409_0.webp
    Розробка мобільного додатку для компанії FLAVORS
    495
Показати більше робіт

Реалізація відображення NFT-колекцій у мобільному гаманці

Користувач підключив гаманець — і очікує побачити свої NFT з превью, імям та колекцією. На практиці: частина метаданих лежить в IPFS з недоступним gateway, частина токенів — у кількох мережах одночасно, а зображення важать від 10 КБ до 50 МБ. Все це потрібно відобразити швидко і без краху.

Звідки брати дані NFT

Прямі RPC-виклики до ERC-721 (tokenURI, ownerOf) на кожен токен — це десятки паралельних запитів. Для гаманця з 50+ NFT такий підхід непридатний. Використовуємо агрегуючи API:

  • Alchemy NFT API (getNFTsForOwner) — повертає всі NFT за адресою з метаданими та URL медіа, підтримує Ethereum, Polygon, Base, Arbitrum
  • Moralis Web3 API — аналог, плюс підтримка Solana та BNB Chain
  • OpenSea API v2 — актуально якщо застосунок орієнтований на торгівлю, дає ціни та floor price
  • QuickNode NFT API — підходить для мультичейн-гаманців з користувацькими RPC

Для Solana: getTokenAccountsByOwner через JSON-RPC + Metaplex getAssetsByOwner (DAS API) для метаданих.

Відповідь агрегатора вже містить media[0].gateway — нормалізований URL зображення, не сировий IPFS-хеш. Це важливо: ipfs://Qm... неможливо завантажити напряму в AsyncImage або Glide — потрібен публічний gateway.

IPFS та ненадійні медіа-URL

Частина NFT зберігає метадані та зображення на IPFS через ipfs:// схему. Публічні gateway (ipfs.io, cloudflare-ipfs.com, gateway.pinata.cloud) часто лагають або недоступні. Рішення: пробуємо кілька gateway послідовно з таймаутом 3 секунди, показуємо placeholder та завантажуємо у фоні.

Для SVG, animated GIF, 3D GLB — потрібна окрема обробка. SVG на iOS рендерится через SVGKit або WebView. GLB — через SceneKit/RealityKit або model-viewer у WebView. GIF — FLAnimatedImage (iOS) або Coil з GIF-декодером (Android).

Структура галереї та фільтрація

Групуємо токени за колекцією (contractAddress + name). Відображаємо секціями: назва колекції, кількість токенів, floor price (якщо є). Всередині секції — grid 2–3 колонки.

iOS: UICollectionViewCompositionalLayout з NSCollectionLayoutSection для секцій + UICollectionViewDiffableDataSource для плавних оновлень. При першому завантаженні показуємо skeleton cells через UIView.animate.

Android: LazyVerticalGrid у Compose або RecyclerView з GridLayoutManager + ConcatAdapter для секцій. Завантаження зображень — Coil з кешуванням на диск (DiskCachePolicy.ENABLED).

Flutter: SliverGrid всередині CustomScrollView, зображення через cached_network_image з cacheManager.

Мультисетева фільтрація

У гаманці, що підтримує Ethereum + Polygon + Base, користувач має швидко переключатися між мережами. Зберігаємо NFT локально в Room/CoreData/Hive з полем chainId. Фільтр змінює запит до БД — ніяких повторних мережевих запитів.

Детальний екран токена

Показуємо: зображення / відео / 3D, імя, колекцію, опис, attributes (traits) у вигляді тегів з rarity процентами якщо API їх видає. Посилання на OpenSea/Blur/Magic Eden. Історія трансакцій через getTransfersForToken API.

Терміни: реалізація галереї NFT з підтримкою 2–3 мереж, метаданими та деталями токена — 3–5 робочих днів. Мультичейн з торговими функціями — 1–2 тижні.