Размещено на http://www.allbest.ru/

Размещено на http://www.allbest.ru/

Cодержание

• Введение
• Глава 1. Исследование рынка и особенности архитектуры iOS приложений
• 1.1 Сервисы для футбольных фанатов
• 1.2 Обзор существующих решений
• 1.2.1 Новостные ресурсы
• 1.2.2 Информационные ресурсы
• 1.2.3 Букмекерские компании
• 1.2.4 Другие продукты
• 1.3 Основные компоненты iOS
• 1.4 Жизненные циклы приложения
• Выводы по главе
• Глава 2. Архитектура и основные технологии разрабатываемого приложения
• 2.1 Архитектура разрабатываемого приложения
• 2.2 Работа с сетью в разрабатываемом приложении.
• 2.3 Работа с UI в разрабатываемом приложении
• Выводы по главе
• Глава 3. Разработка приложения
• 3.1 Инструменты разработки
• 3.2 Инструменты разработки - Архитектура
• 3.3 Дизайн приложения
• 3.4 Реализация сетевого слоя
• 3.5 Инъекция зависимостей.
• Выводы по главе
• Заключение
• СПИСОК ИСПОЛЬЗУЕМЫХ ИСТОЧНИКОВ
• 

Введение

Футбол является одним из наиболее популярных видов спорта. По всему миру миллионы фанатов следят за каждым матчем любимой команды, собираются вместе, чтобы отпраздновать победу и пристально наблюдают за всеми новостями из мира футбола.

Существует большое количество сервисов, где люди могут находить новости или результаты матчей. В социальных сетях они могут создавать тематические группы для того, чтобы общаться с другими фанатами.

Однако на сегодняшний день не существует сервиса, посвященного именно футболу и объединяющим в себе всё, необходимое фанатам, получать информацию о матчах, новости, уведомления об игре любимой команды.

Несмотря на то, что сервисов, которые решают некоторые из этих проблем, большое множество, нет ни одного, где собраны все эти возможности. Так же ни в одном из существующих решений нет функционала социальной сети.

Различные сервисы, основываясь на специфике своего бизнеса, реализуют только необходимые им функции. Таким образом, никто не дает фанатам единого портала, посвященного футболу, где есть все необходимое.

Данная работа описывает авторский вариант реализации подобного портала на примере iOS - приложения. Основной особенностью приложения является реализация широкого спектра функционала. Таким образом, несмотря на то, что целевая аудитория очень большая, фанаты любого возраста найдут что-то интересное для себя.

Кроме того, важной особенностью работы является интеграция собственного YouTube - канала, посвященного футболу, на котором выходят ролики, раскрывающие футбол изнутри. В каждом выпуске показывается закулисье важных футбольных событий, жизни спортсменов, судей, тренеров. Данная интеграция может стать одним из самых важных конкурентных преимуществ.

Целью работы является разработка продукта, который будет объединять в себе функционал самых популярных приложений посвященных футболу, и будет удовлетворять интересы болельщиков.

Для реализации поставленной цели необходимо решить следующие задачи:

1. Провести анализ готовых решений;

2. Разработать функциональные требования к программе.

3. Изучить платформу iOS: основные возможности, архитектуру, подходы к разработке, стандартные библиотеки и наиболее часто используемые решения.

4. Изучить средства для работы с сетевыми запросами.

5. Выбрать основные библиотеки для разработки iOS приложений;

6. Изучить особенности и разработать дизайн приложения;

7. Разработать iOS приложение для портала любителей футбола;

8. Протестировать готовое приложение

9. Разработать техническую документацию.

В данной работе представлено три главы: в первой описание исследования рынка готовых решений, а также описание основных особенностей приложений, написанных для платформы iOS, во второй - описание технологий и инструментов, используемых в данной работе, в третьей описаны особенности реализации приложения.



Глава 1. Исследование рынка и особенности архитектуры iOS приложений

В этой главе приводятся результаты исследования рынка приложений на iOS, посвященных футбольным новостям и коммуникациям между фанатами.

1.1 Сервисы для футбольных фанатов

Сервисов, связанных с футболом, достаточно много в наше время. В основном они предоставляют информацию о футбольных матчах, расписании и результатах, а также новости. Основные различия в существующих решениях заключаются в наличии того или иного функционала. Несмотря на то, что в каких-то сервисах используются разные решения, основные возможность подобных продуктов:

1. Получать информацию о футбольных матчах

2. Посмотреть статистику выбранной команды или игрока

3. В режиме онлайн следить за результатами матчей.

4. Получать новости из мира футбола.

Данный список является основным набором функций, которые есть в большинстве продуктов, посвященных футболу. Однако, в зависимости от реализации, этот список может изменяться или расширяться.

1.2 Обзор существующих решений

Все существующие на сегодняшний день решения для футбольных фанатов можно разделить на несколько категорий:

1. Новостные - портал, где публикуются новости. В режиме реального времени освещаются только некоторые матчи.

2. Информационные - сайты, где публикуется информация о завершенных, текущих и будущих матчах, публикуются результаты матча, игровые события и статистика для команд и игроков.

3. Сайты букмекерских компаний. Многие футбольные фанаты любят делать ставки. Продукты букмекерский компаний часто предоставляют информацию и матчах и статистику, поэтому многие болельщики выбирают их в качестве наиболее часто посещаемого ресурса.

Несмотря на большое разнообразие ресурсов, где есть информация и разделы, посвященные футболу, количество тех, на которых есть только футбол, очень маленькое.

С одной стороны, выбор нескольких видов спорта - дополнительный функционал, однако это зачастую сопровождается нагрузкой интерфейса, что может снижать уровень удобства пользования данным продуктом.

Рассмотрим примеры продуктов из каждой вышеперечисленной категорий.

1.2.1 Новостные ресурсы

Одним из наиболее известных ресурсов является Sports.ru. Основной функцией данного портала является предоставление новостей о спорте. Однако это один из немногих продуктов, которые также предоставляют информацию о матчах и статистику, что, конечно же, является большим плюсом.

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



Рисунок 1. Экран выбора любимой команды в Sports.ru

Также сервис предлагает зарегистрироваться для того, чтобы можно было оставлять комментарии под новостными постами. Однако приложением можно пользоваться и анонимно, что также является плюсом, так как некоторые сервисы в наши дни не предоставляют доступ к полному функционалу приложения для не зарегистрированных пользователей. Для авторизации можно использовать существующие аккаунты в социальных сетях, таких как Вконтакте и Facebook.



Рисунок 2. Экран настройки уведомлений и авторизации в Sports.ru

Еще одним из примеров новостных Sport - Express. Это менее известный, но также достаточно популярный продукт. Мобильное приложение данного ресурса дает список некоторых новостей, разделенный по категориям

Однако отображение новостей происходит с помощью инструментов, позволяющих открыть web-страницу на устройстве. Из-за этого часть текста часто находится за пределами экрана, что делает его нечитаемым. Это является достаточно весомым минусом для приложения, ориентированного на отображение новостей.



Рисунок 3. Экран просмотра новости в Sport - Express.

В данном приложении есть возможность просмотреть информацию о матчах и добавить команды в избранное.

Также есть возможность оставлять комментарии анонимно. Однако полного функционала социальной сети нет.

К рассматриваемой категории можно также отнести любые новостные порталы, где можно выбрать отдельно новости, связанные с футболом. Однако на них уже не будет информации о матчах, результатах и статистики игроков.

Для того чтобы получить данную информацию люди часто используют ресурсы, которые относятся к категории информационных.

1.2.2 Информационные ресурсы

Самым известным ресурсом, который предоставляет информацию о сыгранных, текущих и будущих матчах является портал MyScore. Аудитория данного ресурса насчитывает более пяти миллионов человек.

На нем существует множество настроек отображения статистики, результатов, информации о команде и о сыгранных матчах. Можно посмотреть интересующие пользователя лиги, команды и даже игрока, а также по каждому из перечисленных пунктов можно настроить уведомления о каких-либо событиях.

Рисунок 4. Экран выбора лиги в MyScore



При входе в приложение на главной странице отображается выбор лиги, для которой можно просмотреть информацию. Далее можно посмотреть таблицу или выбрать какую-нибудь команду.

В данном приложении также есть раздел для просмотра матчей, которые проходят в реальном времени - Live

Рисунок 5. Экран выбора лиги в MyScore

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

Стоит отметить, что большое выбор команд предоставляется не только любителям футбола, а также и любителям других видов спорта.

Рисунок 6. Экран выбора лиги в MyScore

Отрицательной стороной MyScore является тот факт, что на данном портале доступен только просмотр информации. Нет функционала, позволяющего оставить комментарий или как-либо поделиться заинтересовавшим пользователя контентом.

1.2.3 Букмекерские компании

Большинство продуктов букмекерских компаний предоставляют тот же функционал, что и MyScore. Помимо просмотра интересующей информации также есть возможность сделать ставки онлайн. Однако данный функционал запрещен на территории Российской Федерации. Из-за этого невозможно скачать приложение для платформы iOS в России.

Для зарубежных пользователей в приложении компании Winline доступен просмотр информации по текущему матчу более полный, чем в продуктах других компаний. В данном приложении помимо всего можно просмотреть, где в данный момент находится мяч на поле. Информация обновляется раз в три секунды. Для фанатов, которым необходима статистика по матчам данная функция является большим плюсом.

1.2.4 Другие продукты

Еще один молодой продукт, который предоставляет информацию об играх, командах и лигах это Onefootball. Основной функцией данного приложения является просмотр статистики. Однако здесь также присутствуют новости, которые берутся из других ресурсов посредствам RSS - подписок.

Рисунок 7. Экран новостей в Onefootball.



В приложении также есть уведомления о каких-либо событиях, однако нет функционала социальной сети.

Краткий обзор существующих решений.

	Overtime	MyScore	Onefootball	Sports.ru	Winline	Sport-Express
1. Live матчи	+	+	+	+	+	+
2. Информация о сыгранных матчах	+	+	+	-	+	-
3. Новости о футболе	+	-	+/-	+	-	+
4. Чаты	+	-	-	+/-	-	-
5. Функционал социальной сети	+	-	-	-	-	-
6. Интеграция шоу о футболе	+	-	-	-	-	-
7. Выбор других видов спорта	-	+	-	+	+	+

В результате проведенного анализа можно сформулировать следующие основные функции разрабатываемого приложения:

1. Получение сведений о завершенных, текущих и будущих футбольных матчах.

2. Получение новостей из мира футбола, опубликованных редакторами портала.

3. Добавление команды, лиги, игроков в избранное и получение информации и уведомлений, связанных с ними.

4. Информирование о статистике выбранной команды или игрока.

5. Микро-блог с возможностью делиться собственным мнением или новостью.

6. Подписки на других пользователей сервиса.

7. Общение между пользователями в публичных или приватных чатах

8. Возможность комментировать новости и делиться контентом в других социальных сетях.

9. Просмотр роликов с Youtube - канала о футболе внутри приложения.

Сервис на старте будет доступен на территории России и стран СНГ. В будущих версиях будет добавлена поддержка зарубежных стран.

1.3 Основные компоненты iOS

Приложение под iOS включает в себя большое количество различных компонентов.

Компания Apple разработала большое количество стандартных библиотек, покрывающих различные задачи разработчика.

Одним из основных компонентов iOS SDK является фреймворк Cocoa Touch. Данная библиотека представляет собой набор абстракций для платформы iOS. Если рассматривать iOS - технологии, как несколько слоев Cocoa Touch находится на самом высоком уровне, что позволяет значительно сократить время работы разработчиков. Cocoa Touch состоит из нескольких библиотек. Наиболее часто используемые из них - это Foundation и UIKit

Библиотека Foundation содержит в себе большое количество методов для работы со строками, вычислениями, датой и временем, сетевые методы, а также методы для сортировки и фильтрации.

UIKit - библиотека, которая предоставляет возможность работать со всеми стандартными UI элементами. Также UIKit помимо компонентов содержит методы для работы с интерфейсом, такие как анимация, изменение цвета, создание собственных элементов вручную, не используя стандартные элементы.

Каждое iOS приложение может быть разделено на несколько слоев:

1. UI - слой отвечает за визуальное представление.

2. Бизнес слой нужен для работы с информацией и для отображения этой информации на UI.

3. Слой данных нужен для хранения информации на устройстве.

4. Сетевой слой обеспечивает загрузку и выгрузку необходимой информации по сети, если приложение клиент-серверное.

UI - слой делится на следующие на следующие основные элементы:

1. Window - основной контейнер для UI компонентов. Как правило, в большинстве приложений существует только одно окно, внутри которого меняются элементы.

2. UIViewController - «Экран» - контейнер для визуальных компонентов. Также обеспечивает переход между экранами в приложении и связывает действия пользователя с бизнес логикой.

3. UIView. Визуальные элементы. Данный компонент служит для отображения необходимой информации и для обработки действий пользователя. Например, это кнопки, текстовые поля, изображения.

Любой из вышеперечисленных компонентов можно расширить, добавив необходимые разработчику методы. Также есть множество стандартных классов - наследников, с уже добавленным функционалом для тех или иных целей.

1.4 Жизненные циклы приложения

Одной из самых важных особенностей приложений, которые нужно учитывать разработчикам, это жизненные циклы iOS приложений и UIViewController, так как часто необходимо определенным образом обрабатывать переходы между разными состояниями.



Рисунок 8. Жизненный цикл iOS приложений.

iOS приложение может может находиться в следующих состояниях:

1. Не запущено.

2. Запущено, но не активно.

3. Запущено, активно.

4. В фоне.

5. Приостановлено.

При переходах между этими состояниями в AppDelegate внутри приложения приходит соответствующее сообщение, которое можно обработать так, как необходимо разработчику.

Жизненный цикл UIViewConroller очень похож на жизненный цикл iOS приложения. UIViewConreoller после создания и до деинициализации может иметь следующие состояния:

1. Не показан. - На данный момент контроллер не представлен пользователю.

2. Появляется. - Контроллер в процессе появления. Здесь можно вызвать метода, которые необходимо вызвать до того, как контроллер появится на экране.

3. Активный. - Контроллер активен и реагирует на действия пользователя.

4. Исчезает - Контроллер в процессе скрытия с экрана. Здесь можно выполнить определенные действия, которые нужно выполнить перед самым скрытием контроллера.

Все эти состояния и переходы между ними необходимо знать каждому разработчику iOS - приложений для успешной разработки.

Выводы по главе

В данной главе был проведен анализ существующих аналогов, на основании которого были сформулированы основные функциогальные требования к разрабатываемому продукту.

Также были описаны основные компоненты, используемые при разработке iOS приложений и жизненные циклы программ и компонентов.



Глава 2. Архитектура и основные технологии разрабатываемого приложения

В этой главе описана архитектура разрабатываемого приложения, а также основные используемые технологии.

2.1 Архитектура разрабатываемого приложения

Существует множество архитектур, которые часто используются при разработке iOS приложений. Самые популярные из них:

1. MVC - Model View Controller

2. MVP - Model View Presenter

3. MVVM - Model View ViewModel

4. VIPER- View Interactor Presenter Entity Routing

Первые три паттерна подразумевают три слоя, а именно слой данных (Model), слой представления (View), а также слой, связывающий данные и представление, то есть отвечающий за бизнес- логику.

Архитектурные паттерны служат для разделения обязанностей, каждый слой отвечает за свой набор функций. Создатели VIPER, разработчики компании Rambler, сделали еще один шаг в эту сторону и вместо привычных для первых вариантов трех слоев и VIPER их пять. Рассмотрим их.

View - визуальное представление, связано с Presenter.

Presenter - отвечает за бизнес - логику со стороны UI. И связан с Interactor и View.

Interactor - отвечает за бизнес- логику со стороны данных (Entity)

Entity - простые данные объекты.

Router - обеспечивает переходы между модулями.

Каждое приложение, написанное с использованием VIPER, содержит в себе модули, зачастую это отдельные экраны со своей логикой или небольшие usecase'ы. Таких модулей в приложении может быть сколько угодно.

Схема 1. Схема архитектуры VIPER.

Для разработки приложения была выбрана архитектура VIPER. Именно она позволяет разделить обязанности лучше всего, что позволяет лучше тестировать каждый модуль приложения.

За качество написанного приложения приходится жертвовать простотой использования. VIPER требует большое количество дополнительных, по сравнению с другими архитектурными паттернами, классов и интерфейсов для успешной реализации.

Также VIPER лучше остальных позволяет следовать принципам объектно-ориентированного программирования SOLID.

2.2 Работа с сетью в разрабатываемом приложении.

Так как приложение клиент- серверное, большая доля внимания должна быть уделена сетевому взаимодействию.

В приложении большинство методов требуют HTTP - запросы. Для чатов и онлайн обновления информации о текущих матчах используются WEB- сокеты.

Большинство разработчиков при выборе инструментов для работы с HTTP - запросами останавливаются на библиотеке Alamofire [Opensource проект] -библиотека, предоставляющая удобный интерфейс над стандартным фреймворком Foundation.

Однако в разрабатываемом приложение используется фреймворк Moya [Opensource проект] для сетевых методов. И собственный модуль для обработки серверных ошибок и десериализации данных, приходящих от сервера.

Moya - библиотека основанная на Alamofire, которая позволяет разделить логику сетевого взаимодействия и еще больше минимизировать риск ошибок.

Схема 2. Схема сетевого взаимодействия: (А) без использования фреймворка Moya, (Б) с использованием фреймворка Moya

Благодаря выбранной архитектуре серверный слой уcтроен таким образом, что не имеет значения, через что выполняется сетевой запрос. Логика создания, выполнения сетевых запросов разделена, так же, как и логика обработки ошибок и ответов сервера, что позволяет в любой момент заменить любую из используемых библиотек на другую, без серьезных изменений во всем приложении.

Для сообщений и обновления информации о текущих матчах используются WebSocket.

WebSocket - протокол, позволяющий в режиме реально времени обмениваться сообщениями между клиентом и сервером.

В случае с данным приложением это необходимо для чатов и обновления информации о матчах, так как сервер о каком-либо событии должен сразу оповещать подключенного клиента.

Для данного типа сетевого взаимодействия используются стандартные средства платформы iOS.

2.3 Работа с UI в разрабатываемом приложении

Существует три основных способа построения UI в iOS приложении. Делятся они в зависимости от степени использования билдеров интерфейса.

Первый способ подразумевает использование инструмента, входящего в среду разработки Xcode, в которой разрабатываются iOS приложения.

В Interface builder можно создать карту экранов со всеми необходимыми элементами в файлах с расширением .storyboard. А также, при желании, здесь же настроить переходы между экранами. Чтобы каждый из таких файлов не был нагружен, часто отдельные usecase'ы выносят в разные storyboard'ы.



Рисунок 10. Storyboard.

Однако здесь есть минусы, при таком способе интерфейс получается недостаточно гибким, несмотря на то, что скорость разработки и данном случае довольно высокая.

Второй способ похож на первый, однако создаются не целые экраны, а отдельные элементы. Они собираются они в единое целое с помощью кода.

Это решение намного более гибкое, чем первое, однако скорость разработки становится ниже.

Третий способ - создание абсолютно всех элементов с помощью кода. В том числе все необходимые размеры и ограничения (constraints) для автоматического изменения разметки экрана при разных размерах экрана. (AutoLayout). Такие ограничения можно настраивать и при первом способе, однако создание элементов из кода помогает добиться максимальной гибкости при разработке.

При разработке данного приложении, как и в большинстве крупных проектов, используется третий подход.

Для UI тоже существует большое количество библиотек, которые призваны помочь разработчику. Одна из самых популярных - SnapKit. Данная библиотека создана для помощи в построении AutoLayout, при постановке ограничений. (contraints) Ниже приведен пример использования данной библиотеки на языке программирования Swift.

Схема 3. Пример использования SnapKit.

Выводы по главе

В данной главе было приведено описание архитектуры, используемой при разработке iOS приложения.

Также были рассмотрены технологии, используемые при разработке сетевого взаимодействия и был приведен обзор подходов к построению UI мобильного приложения на платформе iOS.



Глава 3. Разработка приложения

В этой главе приводится описание использованных при разработке методов, инструментов, технологий и особенности реализации приложения и средств разработки.

приложение футбольный авторизация

3.1 Инструменты разработки

Данное приложение разрабатывается в среде программирования Xcode. Это программное обеспечение было разработано компанией Apple и рекомендовано для использования всем разработчикам. Xcode содержит все стандартные библиотеки, а так же средства и языки необходимые для разработки iOS приложений.

В качестве основного языка разработки использовался Swift, разработанный компанией Apple. Для некоторых методов, связанных с работой сетевых методов использовался язык Objective-C. Также для написания скриптов, нужных для подключения необходимых библиотек и для автоматизации процесса сборки приложения использовался язык Ruby.

Интерфейс приложения разрабатывался в приложении Sketch для iOS. Данный инструмент удобен при создании дизайна iOS приложений, так как позволяет использовать стандартные элементы платформы. Также возможно экспортировать готовые макеты в Zeplin - приложение, в котором можно просмотреть все элементы по слоям, а также посмотреть размеры и расстояния между компонентами.



Рисунок 11. Zeplin Расстояния между элементами.

Для контроля версий и изменений в проекте использовалась система контроля версий Git и сервис GitHub для хранения удаленных версий.

При разработке приложение использовалось больше количество библиотек, предоставляющих весь необходимый для разработки функционал. Для сетевого взаимодействия использовались библиотеки Moya и Alamofire. Для работы с JSON - объектами использовалась библиотека SwiftyJSON, которая позволяет сильно сократить код, служащий для обработки конвертации, а также создания JSON'ов. Для работы с UI-элементами использовалась библиотека SnapKit, которая так же помогает существенно сократить время, затраченное на разработку. Для работы с чатом используется библиотека SendBird, которая помогает при определении статуса адресата через открытый WebSocket.

При разработке приложения использовался API cервера, который был создан для данного проекта.

Схема 4. API сервера проекта.

Все методы описаны в приложении в сетевом слое.

3.2 Инструменты разработки - Архитектура

Для разработки используется архитектурный паттерн VIPER, который позволяет увеличить тестируемость, а также качество кода, однако значительное время уходит на создание и настройку каждого нового модуля.

Для увеличения скорости и эффективности разработки был написан скрипт на языке Ruby. Он позволяет создавать и настраивать шаблоны для целого VIPER-модуля, который обычно содержит в себе пять классов и интерфейсов для связи между этими классами.

Так же данные шаблоны помогают при определении слабых/сильных ссылок на объекты, что помогает избежать частых для iOS-разработчиков ошибок, связанных с ссылками объектов друг на друга.

В языке Swift ссылки могут быть слабые, с модификатором weak и сильные. Удаление объектов из памяти происходит в тот момент, когда количество сильных ссылок становится равным нулю, и, если два объекта будут ссылаться друг на друга, то они никогда не будут удалены. Для решения данной проблемы используются слабые ссылки. В VIPER-модуле есть объекты, которые ссылаются друг на друга и при написании всего модуля вручную могут возникнуть ошибки, связанные неправильным указанием модификаторов. Используя одинаковый шаблон для каждого нового модуля, разработчик может быть уверен, что в каждом новом блоке код будет правильный.

При использовании скрипта генерируется шесть файлов: шаблон для Interactor'a (схема 5), View (схема 6), протоколов, необходимых для связи компонентов модуля (схема 7), Presenter'a (схема 8), Router (схема 9) и XML - файл, представляющий конфигурацию шаблона для Xcode (схема 10). Далее данные файлы необходимо поместить в папку с шаблонами в Xcode и при создании модуля достаточно только выбрать шаблон и указать название.

Схема 5. Шабон для VIPER - Interactor.

Схема 6. Шабон для VIPER - View.



Схема 7. Шабон для VIPER - протоколы.

Схема 8. Шабон для VIPER - Presenter.



Схема 9. Шабон для VIPER - WhireFrame (Router).

Схема 10. Конфигурация шабона для VIPER для среды разработки Xcode.

Ниже представлен процесс добавления нового модуля. Вначале выбирается шаблон (рисунок 12), далее имя модуля (рисунок 13), затем необходимо выбрать место, где его необходимо сохранить и все.



Рисунок 12. Выбор шаблона для VIPER-модуля.

Рисунок 13. Выбор имени для VIPER-модуля.

Рисунок 14. Созданный VIPER-модуль.

Рисунок 15. Пример созданного из шаблона Presenter'a.

В результате генерируется папка, внутри которой находится 5 нужных файлов (рисунок 14), содержащих все необходимые компоненты. В среднем разработчику требуется от десяти до пятнадцати минут на то, чтобы вручную создать VIPER - модуль и удостовериться в его работоспособности. Данный же способ позволяет потратить на это всего лишь несколько десятков секунд.

3.3 Дизайн приложения

При разработке дизайна приложения были использованы гайдлайны компании Apple. Дизайн разрабатывался в приложении Sketch, далее для удобства экспортировался в приложение Zeplin.

Для удобной работы с созданием ограничений размеров и расположения элементов использовалась библиотека SnapKit, которая является OpenSource проектом.

Важной особенностью дизайна приложения является его гибкость, так как визуально новости или компоненты, содержащие рекламные ссылки или интерактив, могут различаться. В связи с этим большая часть элементов интерфейса создаются при инициализации экранов в зависимости от контекста. То есть по сути изначально дизайн представляет собой набор готовых элементов, которые конфигурируются и собираются уже во время работы приложения.

Для реализации этого функционала была создана фабрика элементов, которая в зависимости от параметров создает нужный элемент с нужными обработчиками функций. Каждый ViewController, элемент, представляющий собой экран, наследует протокол, содержащий методы createUI() и updateUI() для создания и обновления интерфейса соответственно.

Еще одной особенностью является возможность будущего портирования приложения для планшетов на платформе iOS. В большинстве случаев iOS разработчики используют отдельные модули для мобильных устройств и планшетов из-за разницы в размере экранов и дизайне или вовсе не изменяют свои приложения. В данном проекте подход к дизайну более гибкий, поэтому были переписаны базовые классы, отвечающие за навигацию в приложении, что дает возможность конфигурировать сборку, так как это нужно, без дополнительных модулей или настроек. Например, был изменен стандартный компонент NavigationBar, который в большинстве случаев горизонтальный, как и в данном приложении для мобильного устройства. Таким образом, для версии под планшеты достаточно поменять только одну настройку, а именно ориентацию NavigationBar.

Рисунок 12. Горизонтальный NavigationBar.



Рисунок 13. Вертикальный NavigationBar.

В зависимости от устройства, то есть конфигурации, можно изменять не только ориентацию элементов, а также их содержимое.

Первые экраны, которые видит пользователь при входе, - это экран ввода номера телефона (рис. 14) для авторизации в приложении и экран подтверждения смс кода (рис. 15).



Рисунок 14. Экран входа

Рисунок 15. Экран подтверждения смс кода



Для настроек в приложении есть два экрана: редактирования профиля (рис. 16) и экран настроек (рис. 17), где пользователь может настроить цветовую схему, уведомления, приватность.

Рисунок 16. Редактирование профиля

Рисунок 17. Экран настроек.

Главный экран в приложении - экран новостей (рис. 18). На нем отображается список новостей. При выборе новости происходит переход на экран с подробной информацией о новости (рис. 19).

Рисунок 18.Список новостей

Рисунок 19. Новости - Подробнее



Если прокрутить экран новости вниз, то можно увидеть комментарии к этой новости. (рис. 21)

Рисунок 20. Новости подробнее

Рисунок 21 Комментарии к новости

Следующий раздел - это чаты. На рис. 22 и рис. 23 показаны экран списка чатов и экран самого чата.

Чаты бывают двух типов

· приватные, когда пользователь общается персонально с другим пользователем

· публичные групповые, когда в чате несколько пользователей.

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

Рисунок 22. Список чатов.



Рисунок 23. Экран чата.

Еще один раздел - это профиль. Здесь пользователи могут публиковать свои новости или читать новости тех, на кого они подписаны. Для этого есть переключатель «Мои записи» - «Записи друзей» (рис. 24). Для того чтобы добавить свою запись, есть экран добавления записи (рис. 25). К одному посту можно добавлять описание и до пяти фотографий.

Рисунок 24. Личный кабинет

Рисунок 25. Добавление записи.

Следующий раздел это видео. Здесь можно просматривать видео с авторского Youtube-канала, где раз в неделю выходят новые ролики. Также в приложении есть собственные комментарии к каждому видео, а также лайки и дизлайки. Есть экран просмотра видео (рис. 26), где можно управлять воспроизведением, а также оставлять комментарии и переключаться на другое видео.



Рисунок 26. Просмотр видео.

3.4 Реализация сетевого слоя

В данном приложении был разработан сетевой слой с достаточным уровнем абстракции для того, чтобы встроить данный модуль в любое другое приложение, что значительно ускоряет разработку.

Важной особенностью является возможность обрабатывать ошибку авторизации в одном месте для любого запроса, который этого требует. Определить, требует запрос авторизации или нет, можно определив интерфейсы, которые он наследует.



Схема 11. Абстракции для разных типов запросов.

Если класс запроса имплементирует AuthorizedRequest, то сетевой слой будет в случае ошибки авторизации пытаться заново авторизовать пользователя, если это необходимо. Такая ошибка может произойти в случае, если реализация сервера подразумевает не бесконечное действие токена, с помощью которого персонализируется клиент.

Сетевой слой, как и большинство других модулей приложения можно конфигурировать под конкретные задачи, отключая или подключая необходимый функционал. Это было достигнуто с помощью достаточного уровня абстракции.

3.5 Инъекция зависимостей

Как уже было сказано выше, почти любой компонент в приложении может быть сконфигурирован под конкретные задачи. Для того чтобы можно было удобно собирать модули приложения, используется класс DIResolver. Чаще всего в iOS разработке не применяют подобные методы. Однако из-за подхода к построению интерфейса и остальных слоев было принято решение внедрить данный подход в проект.

DIResolver содержит методы для создания модулей -экранов и дополнительных компонентов - менеджеров для решения разных задач. Например управление данными пользователя, сетевой слой, кеширование данных, загрузка медиа-файлов.

Схема 12. Создание модуля авторизации.

На схеме 12. видно, что в модуль авторизации помимо компонентов, необходимых для VIPER-модуля прокидываются менеджер, отвечающий за сетевые запросы, а также менеджер, который отвечает за хранение и обновление токена.

Такой подход значительно ускоряет процесс разработки а также минимизирует риск ошибок.

Выводы по главе

В данной главе был приведен обзор решений и технологий, которые были использованы при разработке.

Приведены способы ускорения процесса разработки и минимизации ошибок использованные при написании проекта.



Заключение

В результате проделанной работы было разработано iOS-приложение для портала любителей футбола.

В ходе работы был проведен анализ существующих на рынке решений и определены основные функциональные требования к приложению. Были изучены основные компоненты, используемые при разработке iOS - приложений, особенности архитектуры и дизайна приложений.

В ходе исследования существующий решений для работы с UI - компонентами был выбран подход с построением интерфейса с помощью кода, без использования билдеров интерфейса. Для настройки ограничений размера и местоположения элементов была выбрана библиотека SnapKit.

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

Дизайн приложения был разработан в соответствии с требованиями к приложения. Есть возможность динамически создавать необходимые для отображения экраны, что позволяет без дополнительного обновления приложения регулировать интерфейс с помощью контекста.

Интерфейс приложения разделён на большие разделы - экраны новостей, чата, просмотра видео, личного кабинета и экраны просмотра информации о статистике футбольных матчей.

В приложение был интегрирован Youtube - канал, появилась возможность просматривать видео, а также оставлять свои комментарии о нем.

В приложении реализован функционал социальных сетей, а именно пользователи: могут обмениваться сообщениями, а также постами, комментариями, подписываться на обновление профиля друг друга.

В будущем планируется продолжить работу над данным проектом с целью реализации большого количества дополнительных функций. В частности, планируется разработать дополнительные экраны для версии приложения для планшетов, добавить раздел «прогнозы», где будут публиковаться авторские статьи о будущих матчах и прогнозируемых результатов.



Список используемых источников

1) Sprots.ru [электронный ресур] Режим доступа https://www.sports.ru/], свободный

2) Sport-Express [электронный ресурс] - Режим доступа https://www.sport-express.ru/], свободный

3) Winline [электронный ресурс] - Режим доступа https://www.winline.ru/, свободный

4) Moya [электронный ресурс] - Режим доступа https://github.com/Moya/Moya, свободный

5) Alamofire [электронный ресурс] - Режим доступа https://github.com/Alamofire/Alamofire, свободный

6) VIPER [электронный ресурс] - Режим доступа https://www.objc.io/issues/13-architecture/viper/, свободный

7) VIPER [электронный ресурс] - Режим доступа https://habr.com/company/badoo/blog/281162, свободный

Размещено на Allbest.ru