Разработка приложения для игры Game of Skate в многопользовательском режиме для устройств, работающих под операционной системой Android

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

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

Введение

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

С развитием Интернета и цифровых технологий общение между людьми вышло на международный уровень. На данный момент существует множество социальных сетей и мессенджеров, позволяющих людям общаться с помощью текстовых сообщений, а также аудио и видео конференций. Но Интернет позволяет людям не только общаться, делится опытом друг с другом, обучаться на различных образовательных площадках и даже удалённо работать. Данный феномен способствует быстрому развитию различных отраслей деятельности, в том числе и такого вида спорта, как скейтбординг. Российский скейтбординг испытал огромный скачок в начале 2000-х годов, который был связан с широким распространением Интернета на территории Российской Федерации. Так как данный вид спорта долго время не признавался официально, то школ, в которых бы обучали скейтбордингу, не существовало. Поэтому единственной возможностью получить знания стал Интернет, где можно было найти множество зарубежных фото, видео и статей на тему скейтбординга. Стоит отметить тот факт, что все спортсмены, которые будут представлять нашу страну на Олимпийских играх в Токио в 2020 году, были самоучками и начинали свой путь с информации, которую могли найти в Интернете. Не смотря на то, что с 2020 года скейтбординг станет олимпийским видом спорта, в России всё равно наблюдается дефицит школ и тренеров, поэтому очень важным является создание Интернет платформы, которая бы позволяла её участникам обмениваться знаниями и опытом и помогала бы развиваться молодым спортсменам. К сожалению, на настоящий момент таких Интернет-ресурсов крайне мало в российском сегменте.

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

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

Для достижения цели были поставлены следующие задачи:

· изучить правила и особенности игры Game of Skate;

· рассмотреть существующие решения;

· сформулировать требования к приложению и реализуемому функционалу;

· выбрать архитектуру приложения, методы и подходы к разработке;

· реализовать весь необходимый функционал приложения;

· разработать удобный и понятный пользовательский интерфейс;

· провести тестирование готового приложения;

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

1. Обзор предметной области

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

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

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

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

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

· приложения, помогающие играть в Game of Skate.

Теперь рассмотрим по одному приложению из каждой категории.

Spot Map.

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

Рисунок 1. Интерфейс приложения Spotmap

RIDERS

Приложение RIDERS является обширным хранилищем образовательных видео и статей по скейтбордингу, BMX и самокату, и другим экстремальным видам спорта. Главной фишкой является то, что весь контент данного приложения создаётся его же пользователями, среди которых множество именитых отечественных и зарубежных спортсменов. В отличие от предыдущего приложения, RIDERS также позволяет пользователям общаться между собой. Это реализовано по типу форума, где участники могут задавать вопросы и отвечать на них в комментариях.



Рисунок 2. Интерфейс и возможности приложения RIDERS

Skate Dice.

Мобильное приложение Skate Dice симулирует бросание кубиков, на гранях которых написаны различные трюки. Это позволяет играть в Game of Skate, когда очередной трюк выпадает случайным образом, а не заказывается одним из игроков. Следовательно, можно играть даже одному. Главная особенность данного приложения в том, что трюки на гранях, в отличие от настоящих кубиков, не определены и выпадают случайным образом, благодаря чему набор трюков сильно увеличивается.

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

Рисунок 3. Интерфейс мобильного приложения Skate Dice

1.2 Правила игры Game of Skate

Game of Skate - это состязание на скейтбордах между двумя и более скейтерами. Ниже представлены основные правила игры. Один из участников заказывает трюк (для этого он должен сам выполнить его), если трюк не выполнен - очередь переходит к следующему игроку, затем остальные участники должны повторить его с первой попытки (отказать). Если игрок успешно повторил трюк, то игра продолжается с тем же счётом. В случае если отказать трюк не удалось, участник получает букву (очко), начиная с «S». Участник, набравший 5 очков - «SKATE», выбывает из игры. Победителем считается игрок оставшийся последним. Среди особенностей следует отметить, что при выполнении трюка игрок не должен касаться ногами и руками земли, иначе трюк не засчитывается. Когда один участник имеет 4 очка, ему предоставляется 2 попытки для отказа трюка [6].

1.3 Архитектура системы Android

В данном разделе рассматривается архитектура операционной системы Android со описанием входящих в неё компонентов.

Операционная система Android базируется на Linux и состоит из 5 слоёв (рис. 5).



Рисунок 5. Программный стек Android

Ядро Linux.

Основой платформы Android является ядро Linux. Оно реализует такую функциональность, как управление потоками и низкоуровневое управление памятью.

Hardware Abstraction Layer (HAL).

Этот слой предоставляет интерфейс для работы с аппаратными средствами устройства. Он состоит из множества библиотек, реализующих интерфейс для различных компонентов, таких как камера, Bluetooth, Wi-Fi модулям, сенсорам и др.

Android runtime и Native C/C++ Libraries.

Android Runtime позволяет запускать несколько виртуальных машин на устройствах с ограниченной памятью. Благодаря этому, начиная с Android version 5.0, каждое приложение на телефоне выполняется в своём отдельном процессе.

Native C/C++ Libraries - это набор библиотек необходимых для работы некоторых компонентов системы, например ART и HAL.

Java API Framework.

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

System apps.

На верхнем уровне расположен слой стандартных приложений, встроенных в Android. Это приложения для для email'ов, SMS-сообщений, календаря, списка контактов и пр. По сути, данные приложения ничем не отличаются от пользовательских [11].

1.4 Компоненты Android-приложений

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

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

Service позволяет выполнять длительные операции в фоновом режиме, не имеет пользовательского интерфейса.

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

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

Приложение не обязательно должно содержать все перечисленные компоненты, а лишь те, которые требуются для реализации его функциональности [2].

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

1.5 Структура Android-приложений

Все приложения разрабатываемые под Android имеют одинаковую структуру. Ниже описываются составляющие приложения.

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

Каталог src содержит непосредственно файлы исходного кода приложения. Каталог res содержит ресурсы, используемые приложением в ходе выполнения. Android поддерживает следующие типы ресурсов:

· Animations

· Values

· Drawables

· Menu

· Arbitary XML Files

· Raw Resources

· Assets

· Layouts

Каталог gen хранит файлы, сгенерированные Java.

Каталог assets содержит все прочие каталоги и файлы. Он может быть опущен за ненадобностью [2].

1.6 Жизненные циклы

Такие объекты, как Activity, Fragment и Service имеют некоторый жизненный цикл внутри Android приложения. С момента своего создания и до уничтожения они проходят определенные этапы, которые разработчик должен учитывать и корректно обрабатывать. На рис. 6 можно увидеть жизненный цикл Activity [3].

Рисунок 6. Жизненный цикл Activity

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

2. Проектирование приложения

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

2.1 Функциональные требования

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

1) реализация авторизации пользователя;

2) возможность регистрации новых пользователей;

3) отображение списка активных пользователей;

4) возможность отправки приглашения пользователю для начала состязания;

5) возможность принятия и отклонения приглашения;

6) возможность съемки видео на камеру устройства;

7) отправка видео;

8) просмотр входящих видео;

9) возможность подтверждения или отклонения трюка;

10) возможность общения с соперником через чат;

11) визуальное отображение своего счёта и счёта соперника;

12) возможность досрочно завершить состязание.

Ниже на рис. 7 приведена use case диаграмма, которая показывает основной сценарий работы приложения.



Рисунок 7. Use-case диаграмма

2.2 Архитектура приложений

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

Рисунок 8. Архитектура клиент-серверного приложения

Архитектура Android-приложения

Android-приложение реализует паттерн MVP (Model-View-Presenter). Данный подход разбивает приложение на три слоя: model, view и presenter.

Model - слой работы с данными, он реализует управление как локальными данными, так и данными с сервера.

View - отвечает за отображение данных на экране. Это может быть Activity или Fragment.

Presenter - это слой, который позволяет общаться Model и View, так как напрямую они не могут взаимодействовать. Presenter реагирует на пользовательские действия и изменяет данные в соответствии с ними, а также оповещает View, когда данные меняются [4].

Для связи с сервером используется два подхода: отправка HTTP-запросов и постоянное соединение через WebSocket. Это связано с тем, что для реализации игрового процесса и чата между пользователями необходимо получать оповещения от сервера в реальном времени. Реализация через HTTP-запросы в этом случае неудобная и сложная, так как необходимо постоянно с некоторым интервалом опрашивать сервер о появлении каких-либо изменений. Через WebSocket'ы между клиентом и сервером устанавливается постоянное соединение, поэтому они могут обмениваться данными в режиме реального времени. Более того WebSocket является полностью асинхронным и симметричным решением [13]. HTTP-запросы используются лишь для реализации регистрации. На рис. 9 и рис. 10 представлены схемы реализации паттерна MVP, работающего с HTTP-протоколом, и MVP Realtime, работающего на WebSocket'ах.



Рисунок 9. Архитектура MVP

Рисунок 10. Архитектура MVP Realtime

Архитектура серверной части.

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

Серверное приложение написано на языке программирования Node.js. Оно реализует взаимодействие с базой данных, а также обмен данными между клиентами. При начале состязания сервер передаёт данные от одного пользователю другому в режиме реального времени при помощи WebSocket'ов. Также приложение работает и как HTTP-сервер и может принимать запросы, но обрабатывает только запрос на регистрацию.

База данных необходима для хранения информации о зарегистрированных пользователях (логин, хэш пароля и др.) [1].

2.3 Методы решения поставленных задач

Для игры в Game of Skate долен быть реализован удобный интерфейс, который бы соблюдал логику игры. Необходимо следить за ходом игры, в частности, соблюдать очередность ходов игроков и предоставлять игроку возможность снимать видео и смотреть видео оппонента. Кроме того, важно следить за счётом и верно реагировать на его изменения. Например, когда на счету одного из игроков 4 буквы, то он должен получить вторую попытку, в случае неудачи, а также при получении игроком пятой буквы игра должна заканчиваться. Вся эта логика реализуется на сервере. Когда начинается состязание, сервер создаёт специальную структуру, которая обрабатывает данные, приходящие от клиентов, и на их основе отправляет им сообщения. Клиент в свою очередь должен лишь корректно реагировать на эти сообщения и предоставлять пользователю необходимый интерфейс.

В данной главе были рассмотрен подход к проектированию как всего приложения в целом, так и его основных компонентов: Android-приложения и серверной части. Также были разобраны методы решения задач по реализации логики приложения.

3. Особенности реализации

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

3.1 Используемые средства и технологии

Разработка Android приложения производилась в среде Android Studio. Данное программное обеспечение основано на программном обеспечении IntelliJ IDEA от компании JetBrains и является официальным средством разработки Android приложений. Оно предоставляет все необходимые технологии и языки программирования для создания программного обеспечения под платформу Android. Разработка велась на языке Java.

Серверное приложение разрабатывалось в среде WebStorm, которое также основано на платформе IntelliJ IDEA, на языке Node.js. Среда WebStorm позволяет эффективно разрабатывать и отлаживать приложения на Node.js, а также устанавливать новые модули через npm. Для хранения данных используется система управления базами данных MongoDB, которая на данный момент является наиболее популярной при разработке web-приложений. Данная СУБД классифицируется как NoSQL и использует JSON-подобные документы и схему базы данных [8]. Среди особенностей, которые повлияли на выбор MongoDB, стоит отметить следующие:

· поддерживает работу с большими объёмами быстро меняющихся структурированных, полуструктурированных и неструктурированных данных;

· возможность динамически менять схему базы данных;

· поддерживает парадигму объектно-ориентированного программирования;

· простое и гибкое в использовании;

· хорошая масштабируемость;

· высокая производительность [7].

В качестве платформы, на которой будет запущен сервер, была выбрана облачная платформа Heroku, так как она предоставляет удобный интерфейс для развёртывания приложения и поддерживает множество языков программирования, в том числе и Node.js [9].

Реализация сетевого взаимодействия разделена на две части. Первая часть реализует работу с HTTP запросами. На стороне клиента использовались библиотеки OkHttp3 [10] и Retrofit, которые позволяют не только отправлять и получать запросы, но также выполнять их сериализацию и десериализацию в формат JSON при помощи библиотеки Gson от Google и обеспечивают асинхронность [12]. В серверном приложении за обработку HTTP запросов отвечают модули Http и Express. Express является лёгким и гибким веб-фреймворком, который предоставляет обширный набор функций для разработки веб-приложений. Среди его достоинств можно выделить легкость и удобство маршрутизации HTTP-запросов. Вторая часть представляет собой взаимодействие по протоколу WebSocket. Для его реализации на клиенте и сервере использовалась библиотека Socket.IO, которая предоставляет удобный интерфейс создания постоянного соединения между двумя точками и обмена данными в реальном времени.

Для создания пользовательского интерфейса приложения использовались стандартные средства Android Studio (Layout Editor). Данное средство позволяет размещать элементы на экране и изменять их внешний вид. Более того данная утилита поддерживает концепцию Material Design, которая рекомендуется компанией Google в качестве основного подхода к разработке дизайна приложений, как понятная и удобная для пользователя.

3.2 Разработка мобильного приложения

В разделе рассмотрены особенности реализации мобильного приложения под Android.

Авторизация и регистрация

При первом запуске приложения перед пользователем открывается окно авторизации (рис. 11), где пользователю предлагается ввести свои логин и пароль для авторизации и подключении к серверу.

серверный интерфейс пользовательский

Рисунок 11. Окно авторизации

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

@OnLifecycleEvent(Lifecycle.Event.ON_START)

public void onEnterForeground() {

mLoginData = mContext.getSharedPreferences(LOGIN_PREFERENCES, Context.MODE_PRIVATE);

if (mLoginData.contains(LOGIN_PREFERENCES_NAME)) {

String login = mLoginData.getString(LOGIN_PREFERENCES_NAME, "");

String password = mLoginData.getString(LOGIN_PREFERENCES_PASSWORD, "");

if (TextUtils.isValidString(login) && TextUtils.isValidString(password)) {

LoginData.setUsername(login);

LoginData.setPassword(password);

}

SharedPreferences.Editor editor = mLoginData.edit();

editor.remove(LOGIN_PREFERENCES_NAME);

editor.remove(LOGIN_PREFERENCES_PASSWORD);

editor.apply();

}

if (LoginData.getUsername() != null) {

try {

EventServiceImpl.getInstance().connect(LoginData.getUsername(), LoginData.getPassword());

} catch (URISyntaxException e) {

Toast.makeText(mContext, "Failed to connect to chat server.", Toast.LENGTH_LONG).show();

e.printStackTrace();

}

}

}

Если у пользователя ещё нет аккаунта, то он может создать новый аккаунт. По нажатию кнопки Sign Up открывается диалог для регистрации нового пользователя. После успешной регистрации окно будет закрыто, а пользователь может авторизоваться с теми данными, которые он указал при регистрации.

Список активных пользователей.

Следующее окно это список активных пользователей, представленный на рис. 12.

Рисунок 12. Список активных пользователей

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

<ListView

android:id="@+id/lvUsersList"

android:layout_width="match_parent"

android:layout_height="wrap_content" />

Членами данного списка являются объекты SimpleItemView. Класс UsersAdapter хранит список пользователей и предоставляет интерфейс для его изменения и корректного отображения. Так метод getView() создаёт объекты SimpleItemView и view для них, которые отображаются внутри ListView.

@Override

public View getView(int i, View view, ViewGroup viewGroup) {

SimpleItemView simpleItemView;

View rowView = view;

if (rowView == null) {

LayoutInflater inflater = activity.getLayoutInflater();

rowView = inflater.inflate(R.layout.simple_item, null, true);

simpleItemView = new SimpleItemView(rowView);

rowView.setTag(simpleItemView);

}

else

{

simpleItemView = (SimpleItemView) rowView.getTag();

}

simpleItemView.setUser(users.get(i));

return rowView;

}

Методы addUser(), removeUser(), findUser() и getItem() предоставляют доступ к списку пользователей.

public void addUser(User user) {

users.add(user);

}

public boolean removeUser(User user) {

return users.remove(user);

}

public User findUser(String username) {

for (User i : users) {

if (i.getUsername().equals(username)) {

return i;

}

}

return null;

}

@Override

public Object getItem(int i) {

return users.get(i);

}

Метод notifyDataSetChanged() уведомляет ListView о том, что список пользователей изменился, поэтому он должен вызываться каждый раз, как происходит добавление или удаление пользователя. При нажатии на view из списка пользователей появляется диалоговое окно (рис. 13), которое спрашивает хочет ли пользователь начать игру с другим пользователем.



Рисунок 13. Диалоговое окно начала игры

Игра в Skate и пользовательский чат

Следующее окно - это непосредственно окно для игры в Skate (рис. 14).

Рисунок 14. Окно игры Game of Skate

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

Как только игра начинается на экране появляется диалоговое окно с просьбой ввести число от 1 до 10, которое затем отправляется на сервер, где происходит жеребьёвка, кто первый начинает. В ходе игры пользователь получает 2 вида диалоговых окон:

· запрос на снятие и отправку видео с трюком - появляется в ход пользователя;

· запрос на просмотр видео - появляется в ход соперника.

Когда пользователь или соперник получает очко, то в его графе на экране добавляется новая буква (рис. 15).

Рисунок 15. Отображение счёта игроков

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

Работа с камерой происходит через стандартное приложение камеры Android. Для этого необходимо создать Intent для съёмки видео и вызвать метод startActivityForResult().

Intent intent = new Intent(MediaStore.ACTION_VIDEO_CAPTURE);

intent.putExtra("android.intent.extra.durationLimit", 30);

intent.putExtra(MediaStore.EXTRA_OUTPUT, generateFileUri(TYPE_VIDEO));

startActivityForResult(intent, REQUEST_CODE_VIDEO);

Воспроизведение видео происходит с помощью стандартного класса MediaPlayer.

Для отображения сообщений в чате используется RecyclerView.

<android.support.v7.widget.RecyclerView

android:id="@+id/rvChatMessages"

android:layout_width="match_parent"

android:layout_height="0dp"

android:padding="16dp"

app:layout_constraintBottom_toTopOf="@+id/llSendMessage"

tools:layout_editor_absoluteX="252dp" />

В него динамически добавляются объекты сообщений через адаптер ChallengeMessageAdapter при помощи метода addMessage(). Вызов scrollToPosition() возвращает RecyclerView к последнему добавленному сообщению.

Вид сообщений различается в зависимости от того, отправлено оно или получено. Для этого создано две xml-разметки item_message_received и item_message_sent, которые различаются цветом и расположением на экране (рис. 16).

Рисунок 16. Отправленное и полученное сообщения

Отправка сообщений происходит по нажатию кнопки, при этом вызывается метод sendMessage(), в котором формируется объект сообщения ChatMessage, сообщение добавляется на экран и отправляется на сервер.

private void sendMessage() {

String message = etSendMessage.getText().toString().trim();

if (TextUtils.isValidString(message)) {

ChatMessage chatMessage = new ChatMessage(

LoginData.getUsername(), message, ChatMessage.TYPE_MESSAGE_SENT);

mPresenter.sendMessage(chatMessage);

addMessage(chatMessage);

etSendMessage.setText("");

}

}

При получении нового сообщения срабатывает callback onNewMessage, который также формирует ChatMessage и добавляет его на экран.

@Override

public void onNewMessage(final Object... args) {

runOnUiThread(new Runnable() {

@Override

public void run() {

String message = mGson.create().fromJson((String) args[0], String.class);

ChatMessage chatMessage = new ChatMessage(

ChallengeInfo.getOpponent().getUsername(), message, ChatMessage.TYPE_MESSAGE_RECEIVED);

addMessage(chatMessage);

}

});

}

Также в чате показывается, что твой соперник набирает сообщение, что продемонстрированно на рис. 17.

Рисунок 17. Соперник набирает сообщение

Это реализовано с помощью объекта TextWatcher, который следит за изменением текста в поле ввода и оправляет сообщения об изменениях на сервер.

private void setupTextWatcher() {

etSendMessage.addTextChangedListener(new TextWatcher() {

@Override

public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {

}

@Override

public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {

if (!mTyping) {

mTyping = true;

mPresenter.onTyping();

}

mTypingHandler.removeCallbacks(onTypingTimeout);

mTypingHandler.postDelayed(onTypingTimeout, TYPING_TIMER_LENGTH);

}

@Override

public void afterTextChanged(Editable editable) {

}

});

}

Сетевое взаимодействие

В приложении используется два вида сетевого взаимодействия с сервером.

Первое осуществляется через HTTP запросы при помощи библиотеки Retrofit. Запросы в Retrofit описываются при помощи аннотаций. Приложение может отправлять лишь запрос на регистрацию нового пользователя, его описание содержится в методе интерфейса [5].

public interface RegisterService {

@POST("/register")

Call<String> getItemInfo(@Body String registerString);

}

Далее необходимо создать сервис для работы с сетью и подключить к нему данный интерфейс [12].

public class RegisterRestService {

private RegisterService apiService;

private final Retrofit retrofit;

public RegisterRestService() {

retrofit = new Retrofit.Builder() .baseUrl(SERVER_URL)

.client(new OkHttpClient()) .addConverterFactory(SimpleXmlConverterFactory.createNonStrict(new Persister(new AnnotationStrategy()))) .addCallAdapterFactory(RxJava2CallAdapterFactory.create())

.build();

apiService = retrofit.create(RegisterService.class);

}

public RegisterService getApi() {

return apiService;

}

}

Второе - это работа через web-socket'ы, используя библиотеку Socket.io. Соединение с сервером устанавливается при авторизации, и сохраняется до закрытия приложения. Клиент и сервер общаются друг с другом по средствам ивентов, который отправляются через сокет. Список этих ивентов приведён ниже:

· connect;

· disconnect;

· connect_error;

· connect_timeout;

· new message;

· get users;

· user joined;

· user left;

· typing;

· stop typing;

· challenge;

· challenge response;

· opp left;

· и др.

Работа с сокетами вынесена в отдельный класс EventServiceImpl, который наследуется от интерфейса EventService. При подключении к серверу вызывается метод connect, в котором создаётся новый сокет для этого соединения и с помощью метода mSocket.on(EVENT, onEvent) навешиваем обработчик на входящее событие [13].

@Override

public void connect(String login, String password) throws URISyntaxException {

mUsername = login;

IO.Options options = new IO.Options();

options.query = "login=" + login + "&passwd=" + password;

mSocket = IO.socket(SOCKET_URL, options);

// Register the incoming events and their listeners

// on the socket.

mSocket.on(EVENT_CONNECT, onConnect);

mSocket.on(EVENT_DISCONNECT, onDisconnect);

mSocket.on(EVENT_CONNECT_ERROR, onConnectError);

mSocket.on(EVENT_CONNECT_TIMEOUT, onConnectError);

mSocket.on(EVENT_NEW_MESSAGE, onNewMessage);

mSocket.on(EVENT_USER_JOINED, onUserJoined);

mSocket.on(EVENT_USER_LEFT, onUserLeft);

mSocket.on(EVENT_TYPING, onTyping);

mSocket.on(EVENT_STOP_TYPING, onStopTyping);

mSocket.on(EVENT_GET_USERS, onGetUsersList);

mSocket.on(EVENT_CHALLENGE, onChallengeReceived);

mSocket.on(EVENT_CHALLENGE_RESPONSE, onChallengeResponse);

mSocket.on(EVENT_OPPONENT_LEFT, onOpponentLeft);

mSocket.connect();

}

Обработчик же в свою очередь вызывает методы интерфейса EventListener, который наследуется всеми классами View и Presenter, соответственно при получении какого-либо ивента, его обработка будет происходить во View и Presenter'е запущенного Activity, следовательно изменения будут происходить на экране и в слое данных приложения.

3.3 Серверная часть

Серверное приложение написано на языке Node.js. Оно работает как Http сервер, при чём основной его задачей является обработка событий подключенных web-socket'ов. Сервер выполняет следующие функции:

· авторизация и регистрация пользователей;

· хранение списка активных пользователей;

· предоставление клиенту списка активных пользователей;

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

· управление игровым процессом;

Основная логика приложения сосредоточена в функции-обработчике нового подключения.

io.on('connection', function(socket){

…

});

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

socket.on('new message', function (msg) {

let user = usersOnline.get(socket);

let id = socketInChallenge.get(socket);

if (id !== -1) {

challengesMap.get(id).sendMessage(user, msg);

}

});

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

· User - класс, который содержит информацию о пользователе.

· usersOnline - это коллекция типа Map, которая хранит пару socket, user. Он позволяет быстро находить пользователя, от которого пришёл ивент, так как socket тут выступает в роли ключа.

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

· challengesMap - это Map для хранения всех существующих объектов класса Challenge и их id, который является ключом.

· socketInChallenge - Map, который позволяет по socket'у определить id-номер Challenge, в котором он состоит.

Данные на стороне сервера хранятся в базе данных MongoDB. В ней содержится информация о зарегистрированных пользователях. Обращение к БД происходит через предоставляемый API.

3.4 Тестирование

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

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

Заключение

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

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

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

Разрабатываемое решение состоит из двух частей - отдельных приложений. Клиентское приложение реализовано на языке Java под Android. Разработка велась в Android Studio с использованием таких библиотек как OkHttp3, Retrofit, Gson и Socket.IO. Интерфейс приложения отвечает требованиям Material Design, рекомендованных Google. Серверная часть разрабатывалась в среде WebStorm на языке Node.js с использованием фреймворков для работы с сетью, а именно: Express, Http и Socket.IO.

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

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

...