Кроссплатформенная мобильная разработка Xamarin.Forms
Программные решения для бизнеса
“
Мы разберем этапы кроссплатформенной разработки на Xamarin.Forms и детально изучим этапы создания собственного приложения, продолжая работать с имеющимися данными.
Глоссарий
Для успешного освоения материала рекомендуем вам изучить следующие понятия:
API
Application programming interface. Интерфейс, позволяющий двум независимым компонентам программного обеспечения обмениваться информацией
JSON
JavaScript Object Notation. Текстовый формат обмена данными, основанный на JavaScript
XML
eXtensible Markup Language. Расширяемый язык разметки
Мобильное приложение
Mobile application. Программное обеспечение, предназначенное для работы на смартфонах, планшетах и других мобильных устройствах, разработанное для конкретной платформы (iOS, Android, Windows Phone и т. д.)
Привязка данных
Binding. Процесс, который устанавливает соединение между UI (пользовательским интерфейсом) приложения и бизнес-логикой
Эмулятор
Emulator. Аппаратное или программное обеспечение, которое позволяет одной компьютерной системе (называемой хостом) вести себя как другая компьютерная система (называемая гостем)
Намерение
Intent. Программный механизм, который позволяет пользователям координировать функции различных действий для достижения цели
Сериализация
Serialization. Процесс перевода какой-либо структуры данных в последовательность битов
Десериализация
Deserialization. Восстановление начального состояния структуры данных из битовой последовательности
Видеолекция
Конспект
Продолжим тему мобильной разработки и поговорим о кроссплатформенной разработке на Xamarin.Forms. Эта платформа позволяет создавать одну единственную логику приложения с применением C# сразу для всех трех платформ: Android, iOS и UWP. Из преимуществ можно назвать: единый код для всех платформ, прямой доступ к нативным API каждой платформы, возможность использования платформы .net и языка программирования С#, который является достаточно производительным, и в то же время простым для освоения и понимания.
1. Для начала создаем проект в Xamarin.Forms
- Даем ему название
- В Xamarin представлен ряд шаблонов. Можно использовать списки, вкладки… Пока что мы будем просто выбирать Blank — пустую страницу, и убираем платформу iOS — нам сейчас нужен только Android
- В файле App.xaml прописываем главную страницу для навигации
- Ставим разрешение на использование интернет-подключения. Делается это в настройках Android Manifest
2. Начинаем с верстки MainPage. Она будет представлять собой простой
список — ListView. Здесь мы обрабатываем события нажатия, привязываем данные и делаем разметку
список — ListView. Здесь мы обрабатываем события нажатия, привязываем данные и делаем разметку
Важно
В свойство ListView установливаем параметр HasUnivenRows, который позволит иметь динамический размер объекта. Немного упрощаем верстку списка и не отображаем звездность отеля, как было с RatingBar в Android Studio, так как аналогичного стандартного компонента в Xamarin нет, а на его реализацию уйдет значительное количество времени
3. Давайте попробуем получить с помощью API список отелей и работать с ним
- Сначала тестируем запрос в браузере
- Полученный ответ мы можем скопировать
- Создаем новый класс Hotel в нашем проекте. И с помощью специальной вставки в группе Past Special, мы можем вставить скопированный текст в виде JSON-объектов
Т. е. мы проанализировали полученный ответ и создаем в соответствии с этим, свойство
- Также мы можем добавить свое свойство — оно нам пригодится для вывода изображения
- По аналогии создаем класс HotelComment
4. На странице MainPage мы получаем список отелей с помощью класса WebClient, где указываем строку подключения, также, как это было в Android 10.0.2.2.
5. Результат возвращается нам в формате json, который мы будем обрабатывать. Удобнее всего использовать библиотеку Newtonsoft. Json, позволяющую конвертировать объекты в формат типа json и обратно. Эти процессы называются сериализацией и десериализацией соответственно.
- Для начала подключаем библиотеку Newtonsoft. Json в проекте
- Десериализуем ответ в список отелей и установливаем в качестве источника данных ListView. Не забудьте пересобрать проект, прежде чем это делать
- Запускаем созданный проект на эмуляторе. Список отелей выводится
6. Теперь создаем вторую страницу CommentsPage для просмотра комментариев для отеля и добавления новых
7. Добавляем ListView для вывода комментариев
- указываем динамический размер элементов, привязку данных — как будет отображаться комментарий
- выполняем привязку к указанию автора, содержимого и даты создания
8. В качестве источника данных для привязки мы можем использовать объект любого публичного класса. В том числе и CommentsPage
- Поработаем с конструктором новой страницы CommentsPage, передавая в качестве параметра объект выбранного отеля. Cоздаем дополнительные свойства для биндинга
- Создаем метод для обновления списка комментариев, где получаем ответ с помощью запроса GetHotelsComments, и десериализуем ответ. После этого загружаем полученный результат в список
- Вызываем метод updateComments после отображения страницы
- Теперь создаем переход на эту страницу с главной. С помощью метода PushAsync мы будем передавать экземпляр выбранного отеля в списке
- Делаем остальные элементы управления для добавления комментария. Сразу делаем привязку и обрабатываем клик по кнопке «отправить»
- Используем метод POST для загрузки комментария. В нем мы будем использовать метод UploadString для загрузки данных и передавать туда тот объект, который мы создали. При этом его нужно будет сериализовать. Не забудьте указать ContentType у вашего запроса и после этого обновить комментарии
9. Запускаем и тестируем созданный функционал. Выбрав отель, запускаем комментарии, которые к нему относятся, и можем добавить свой
“
Мы рассмотрели создание приложения Xamarin.Forms, освоили навигацию между страницами, поработали со списками, получая информацию с помощью GET запросов нашего API, а также протестировали работу POST запроса на примере добавления отзыва об отеле.
А теперь проверьте полученные знания, выполнив небольшие задания.
А теперь проверьте полученные знания, выполнив небольшие задания.
Интерактивное задание
Тест
Для закрепления полученных знаний пройдите тест
| Стартуем! |
Xamarin Forms. Свойство в ListView, которое позволит отображать объекты с динамическими размерами?
| Дальше |
| Проверить |
| Узнать результат |
Xamarin Forms. Метод класса WebClient для отправки Post запросов?
| Дальше |
| Проверить |
| Узнать результат |
К сожалению, вы ответили неправильно
Прочитайте лекцию и посмотрите видео еще раз
| Пройти еще раз |
Неплохо!
Но можно лучше. Прочитайте лекцию и посмотрите видео еще раз
| Пройти еще раз |
Отлично!
Вы отлично справились. Теперь можете ознакомиться с другими компетенциями
| Пройти еще раз |