City Map - Android & iOS applications (C#)

В данном репозитории расположены различные материалы для пошагового создания с нуля простого мобильного приложения City Map для платформ Android и iOS, на языке программирования C#.

City Map - мобильное приложения для просмотра базовой информации о различных городах.

Основные функции:

• Постраничная навигация;
• Загрузка данных из сети;
• Оффлайн доступ к данным;
• Отображение городов на мировой карте.

Для чего?

Если вас когда-либо интересовала возможсность создания нативных приложений для iOS и Android на C# и .NET с помощью Xamarin и Вы хотели бы попробовать себя в этом, то вы можете попробовать начать изучение используя материалы из данного репозитория.

Что нужно, чтобы начать?

Для того, чтобы начать изучать нативную мобильную разработку на Xamarin, Вам понадобится:

• Базовые знания английского языка (для чтения материалов);
• Базовые знания языка программирования С#;
• Среда разработки Visual Studio IDE (Community 2017 или выше) с установленным Xamarin и набором SDK для Android и iOS;
• Базовые навыки работы с Git (для работы с материалами данного репозитория);
• Для создания iOS приложений:
  • Компьютер, работающий под управлением операционной системы Mac OS (High Sierra и выше);
  • Среда разработки XCode (версии 9.2 и выше).

Установка и настройка

• Системные требования
• Установка Xamarin для Visual Studio в Windows
• Настройка и установка Visual Studio для Mac

Задания

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

Часть 0

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

Результат, который должен получиться: GitHub | Zip

Полезные материалы:

• Создание приложения Xamarin.Android

• Создание приложения Xamarin.iOS

• Android

  • Полное руководство по Splash Screen на Android

• iOS

  • Build a Basic UI
  • Icons and Images - iOS Human Interface Guidelines
  • Understanding Auto Layout

Часть 1

Данное задание требует создать список элементов (не более 10) с открытием экрана с детальным описанием после нажатия на конкретным элемент списка. Каждый элемент списка это объект класса (структуры) с некоторым набором атрибутов и методов. Объекты класса как и сам список создаются программно в рамках приложения. Объект класса (структуры) должен содержать такие поля как Name и Description.

Результат, который должен получиться: GitHub | Zip

Полезные материалы:

• Пример результата 1

• Пример результата 2

• Android

  • Работа с ListView в Xamarin.Android
  • Xamarin.Android - ListView
  • Что такое Activity
  • ListView

• iOS

  • Работа с таблицами и ячейками
  • Create a Table View
  • Implement Navigation
  • Anatomy of Constraint
  • Working with Constraints in Interface Builder

Часть 2

В рамках данного задания требуется провести модификацию приложения полученного в Часть 1 (Part 1) - заменить заданные вручную данные на полученные из сети в формате JSON.

Реализовать загрузку и отображение картинок (можно использовать сторонние библиотеки, к примеру Xamarin.FFImageLoading) как для каждого элемента списка, так и в рамках экрана с детальным описанием.

Приложение должно проверять наличие интернет соединения и сообщать о его отсутствии при попытке сделать запрос в сеть для загрузки данных (для проверки соединения, можно использовать сторонние библиотеки, к примеру Xam.Plugin.Connectivity).

Ресурс для получения данных: https://api.myjson.com/bins/7ybe5

Результат, который должен получиться: GitHub | Zip

Полезные материалы:

• Пример результата 1

• Пример результата 2

• Пример результата 2

• Диспетчер пакетов NuGet

• Асинхронное программирование с использованием ключевых слов Async и Await

• Получение данных с сервера в json

• Android

  • Xamarin.Android - RecyclerView
  • RecyclerView
  • Оптимизация адаптера и View Holder

• iOS

  • Xamarin.iOS - Collection Views
  • Collection View - Tutorial

Часть 3

В рамках данного задания требуется организовать работу с базой данных. Полученные данные в рамках Часть 2 (Part 2) должны сохраняться в кэш (SQLite, файл, др.), а после, в ситуации с отсутствие интернет-соединения/ошибкой при загрузке данных из сети, доставаться из нее и отображаться пользователю (можно использовать сторонние библиотеки, к примеру MonkeyCache).

Полезные материалы:

• Xamarin.Android - использование SQLite.NET
• Xamarin.iOS - использование SQLite.NET

Результат, который должен получиться: GitHub | Zip

Часть 4

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

Полезные материалы:

• Пример результата 1

• Android

  • Xamarin Android: Create Xamarin Android Google Map With Add Markers
  • Google Maps API

• iOS

  • Xamarin.iOS - Карты
  • MapKit Tutorial

Результат, который должен получиться: GitHub | Zip

Результат

Финальный результат доступен в master ветке и в качестве Zip-архива.

Реализацию с использованием Xamarin.Forms вы сможете найти в ветке forms и в качестве Zip-архива.

Q & A

Если у Вас возникли какие-то вопросы или предложения, как улучшить материал - дайте нам знать. 🏆 👍

Другие варианты решения:

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

• City Map - iOS - Swift
• City Map - Android - Java
• City Map - Universal Windows Platform - C#

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