Эта статья была одновременно опубликована в моемПубличный аккаунт WeChat, отсканируйте QR-код внизу статьи или выполните поиск в WeChatHelloWorld Цзе Шаоследовать.
предисловие
Привет всем, недавно я научился программировать на Swift, так как многие из моих предыдущих проектов были реализованы с OC, я все еще нахожусь на этапе изучения Swift. Чтобы повысить эффективность моего обучения, каждый раз, когда я буду ставить перед собой краткосрочную цель, скажем, на этот раз, чтобы ускорить использование Swift, цель, которую я ставлю перед собой, - завершить Swift-версию NetEase. Облачное музыкальное приложение. Знаете ли вы, как повысить эффективность обучения при изучении нового языка? Не стесняйтесь поделиться со всеми в разделе комментариев.
Исследование и анализ
Сначала проанализируйте домашнюю страницу приложения NetEase Cloud Music на стороне iOS, как показано на рисунке:
После прочтения первая трудность перед глазами - как мне получить эти данные! Конечно, моей первой мыслью было пойти на GitHub, чтобы узнать, есть ли API с открытым исходным кодом, не знаю, не нашел ли я его, я был очень доволен, когда нашел его.API облачной музыки NetEase:
Среди них API-интерфейсы «Обнаружение домашней страницы» и «Домашняя страница-Обнаружение-Список записей круговых значков». Мы можем получить все данные домашней страницы без вызова нескольких интерфейсов и объединения источников данных! Анализируя возвращенный формат данных JSON, я также поднял вопрос к большому парню, и большой парень также быстро отреагировал, так что давайте снова воздадим должное большому парню.
{
"code": 200,
"data": {
"cursor": null,
"blocks": [
{
"blockCode": "HOMEPAGE_BANNER",
"showType": "BANNER",
"extInfo": {
"banners": [
{
"adLocation": null,
"monitorImpress": null,
"bannerId": "1622653251261138",
"extMonitor": null,
"pid": null,
"pic": "http://p1.music.126.net/gWmqDS3Os7FWFkJ3s8Wotw==/109951166052270907.jpg",
"program": null,
"video": null,
"adurlV2": null,
"adDispatchJson": null,
"dynamicVideoData": null,
"monitorType": null,
"adid": null,
"titleColor": "red",
"requestId": "",
"exclusive": false,
"scm": "1.music-homepage.homepage_banner_force.banner.2941964.-1777659412.null",
"event": null,
"alg": null,
"song": {
......
}
Проблема с источником данных решена, и следующим шагом является решение того, как визуализировать данные.Из анализа эффекта, отображаемого на домашней странице NetEase Cloud Music, общее представление поддерживает прокрутку вверх и вниз, а представление single Cell поддерживает горизонтальную прокрутку, поэтому здесь используется UITableView Способ вложения UICollectionView должен быть наиболее подходящим.
Остальные - это некоторые сторонние библиотеки, которые необходимо использовать. Сторонние библиотеки, которые мы используем здесь, следующие:
Функция, которую необходимо реализовать
Содержание его домашней страницы можно условно разделить на следующие части:
- верхний вид поиска
- Banner
- круглая кнопка меню
- Рекомендуемый плейлист
- Личная рекомендация
- Избранные музыкальные клипы
- Плейлист радара
- Популярные подкасты
- Эксклюзивный плейлист сцен
- Новая песня, новый диск, цифровой альбом
- музыкальный календарь
- 24-часовой подкаст
- Видео подборка
Поддерживает темы светлого режима и темного режима
Вот рендеринг, который я наконец понял:
Конкретные детали реализации будут объяснены в следующей статье.Функции будут реализованы одна за другой в том порядке, в котором я перечислил выше.При этом я также выложу код проекта в репозиторий GitHub.Добро пожаловать нажать ⭐️ Поддержите немного.
Наконец
Поскольку объем кода в этой инженерной функции относительно велик, я разделю статью на три части, максимально выделяя ключевые моменты каждой статьи.Если моя статья была вам полезна, пожалуйста, поддержите меня лайком.
Прошлые статьи:
- Код для написания комментариев? напиши и ты проиграешь
- Я так долго не изучал Codable после его выпуска
- iOS изящно обрабатывает сетевые данные, не так ли? Почему бы тебе не посмотреть на это
- Пользовательский макет UICollectionView! Достаточно
- Swift исследует SupplementaryView и представление оформления UICollectionView
Пожалуйста, выпейте ☕️ Нравится + Подпишитесь~
-
Не забудьте поставить лайк после прочтения, есть 👍 и мотивация
-
Обратите внимание на общественный номер ---HelloWorld Цзе Шао, первый раз подтолкнуть новую позу