Не факт, что вам потребуется написать серьёзное приложение на Python. А вот быстро собрать работающий сервис, чтобы «продать» его заказчику, — почему нет? Python универсален, и опыт создания мобильного софта на этом языке может оказаться полезным. Владислав Шашков из Сбербанка рассказал о том, как строится разработка с помощью фреймворка kivy.
— Добрый день. Меня зовут Владислав Шашков, я работаю в Сбербанке и вообще-то я продуктовик, не разработчик. Именно этим может быть интересен мой доклад, потому что он наглядно покажет, что сделать мобильное приложение на Python достаточно несложно.
Kivy — все-таки он «Киви», потому что образно его изображают на обложках книжек в виде фрукта, и на русском ближе будет произношение «Киви». Фреймворк развивается с 2011 года. По сути, это графическая UI-библиотека для создания кроссплатформенных приложений, не только на мобильных платформах. Ее особенностью является язык KV, это язык разметки. Если образно попробовать описать что такое язык KV, получится, что так бы выглядел HTML, будь он написан на Python.
Также мы поговорим о библиотеке KivyMD, которая представляет из себя набор виджетов в стиле Material Design. KivyMD позволяет создавать дружелюбный гугловый интерфейс, с которым можно работать над пользовательским опытом.
Здесь на видео показано, как пролистываются все виджеты, которые есть в библиотеке. Как вы можете видеть, это достаточно богатый набор элементов. Это и закладки, и кнопки, и прогресс-бары, и всплывашки. В принципе, есть все необходимое, чтобы реализовать нужный вам клиентский опыт. Если надо будет собрать сборку на iOS, то выглядеть она будет точно так же. Тот же Material Design. В принципе, такое приложение можно опубликовать в App Store, хоть оно и будет похожее на Google.
Kivy без KivyMD имеет очень аскетичный дизайн. Его даже клиентам показывать не стоит. Похожие на убунтовские простые кнопки, простые диалоги, не адаптированные к мобильному опыту, к мобильным пользователям. А KivyMD молодцы, все красиво сделано.
Есть плохая новость. Исполняемые пакеты приложения собирает специальная утилита — buildozer. И плохая новость заключается в том, что начать пользоваться, сделать первую сборку с ее помощью совсем не просто. Как и, наверное, с любым опенсорсным ПО, чтобы все получилось, чтобы в итоге дойти до цели и получить APK, нужно пройти определенной «тропой», не сворачивая по сторонам.
На этом слайде подробно описано, что нужно делать, как пройти по «тропе» и не сделать лишнего. Не надо пытаться обновить сам kivy или какие-то другие библиотеки в образе. Все что нужно, указано на слайде, остальное само подтянется и будет работать.
Дальше немного расскажу о структуре проекта Kivy. На слайдах размещены QR-коды, где закодированы ссылки на GitHub, чтобы вы могли их сейчас считать и непосредственно проследить примеры, о которых я буду рассказывать. (Первая ссылка — прим. ред.)
На экране представлен файл buildozer spec, это спецификация на проект. Самое важное здесь: есть строка, в которой перечисляются requirements, то есть библиотеки, которые необходимы для сборки, и в ней указывать надо Kivy, KivyMD, запись там есть, и на GitHub она тоже доступна.
Важный раздел, он закомментирован, касается андроидовских NDK, SDK, его трогать не надо. Значения по умолчанию будут работать.
Немного про UI и UX. В языке разметки KV есть два понятия: виджеты и лэйауты. Виджеты — видимые элементы, кнопочки, поля ввода и тому подобное. Виджеты получают события и могут их обрабатывать. А лэйауты — это объекты, которые позволяют позиционировать виджеты, их есть несколько видов, чтобы выстроить виджеты в рядок или наоборот, как-то произвольно позиционировать. В общем-то, этот подход стандартный для визуальных UI, UX, и в других библиотеках он тоже используется.
Здесь пример языка KV (ссылка — прим. ред.). Как мы видим, вначале за решеткой идет импорт библиотек, затем в угловых скобках… Неправильно говорить «корневой», просто начальный лэйаут, которому в коде будет сопоставлен класс. Один в один названия должны совпадать. Таким образом происходит сопоставление разметки и класса в коде. Дальше через отступы идут вложенные виджеты, внутри виджетов, опять отступом идут property и события, они в одном списке идут. Вот пример кода.
Вверху класс — класс лэйаута. Дальше идет класс приложения, и внизу две строчки для загрузки константы разметки, и запуска приложения. Знаю, что аудитория, наверное, не очень знакома с мобильной разработкой, поэтому расскажу о дальнейших шагах, что конкретно надо сделать на телефоне, чтобы запустить и отладить свой APK.
Первым делом надо на телефоне включить решим разработчика. Он достаточно хитро включается. Обычно это секретная последовательность нажатий пунктов меню в режиме настроек телефона. В презентации приведена одна из распространенных последовательностей, но на вашем телефоне она может не работать. После выполнения этой последовательности действий появится режим для разработчика, и можно уже устанавливать APK, отлаживать и дальше действовать.
Buildozer запускается в виртуальной машине, виртуальную машину надо обновить, чтобы она была посвежее. После этого появиться интеграция с USB, тогда можно будет подключить телефон к виртуальной машине.
Признак того, что у вас произошло подключение — телефон спросит разрешения на отладку. Каталог проекта создается в папке /BUILD. Чтобы собрать проект, необходимо в каталоге проекта выполнить команду buildozer android debug. Установка APK на телефон выполняется утилитой из Android Studio, которая уже есть в образе, командой adb install.
И фраза success говорит, что пока все хорошо, выполнена загрузка на телефон.
Отладка кода выполняется следующим образом. Надо запустить сбор отладочной информации командой adb logcat, чтобы параллельно с приложением работал сборщик. Ваше приложение после первого запуска «с высокой долей вероятности» упадет, после чего можно останавливать отладку и идти читать файлик логов.
Как искать сообщение об ошибке? По ключевому слову python. Самая последняя запись c ключевым словом python, как правило, расскажет вам, что пошло не так.
Про то, что можно сделать на телефоне. Мобильная платформа позволяет сделать не просто кнопочки, которые к API ходят, а поработать с большим разнообразием датчиков гаджета. Для работы с мобильной периферией есть стандартная библиотека plyer. Она платформенно-независимая, то есть все, что на ней будет написано, пересоберется с Android на iOS. На слайде перечислены все доступные опции. Там и GPS, и батарея, и камера… Но с камерой plyer позволяет сделать только статический снимок.
А следующий пример как раз расширяет эту возможность. Ссылка на GitHub, пример, который позволяет получать видеопоток в приложении. У меня была бизнес-задача QR-код распознать с картинки. Также этот пример может работать с распознаванием видео, дополненной реальностью и т. п.
Еще у kivy есть пространство для пользовательских аддонов — Garden. Любой может делать виджеты и тому подобное. Полезный виджет, который я использовал, это работа с картами. Он активный, можно масштабировать, покрутить карту. Здесь показан пример, как его подключать. В Garden есть много других виджетов.
Когда я работал над своим проектом, то проводил коридорное тестирование с коллегами, чтобы собрать обратную связь об использовании приложения. И получил такие замечательные возражения, как «я левые APK не буду ставить», «мама не разрешает», «я только телефон купил». Чтобы продолжить тестирование клиентского опыта по существу, мне пришлось пройти путь создания мобильного приложения до конца, а именно сделать релиз в Google Play. На слайде он описан. Основные моменты заключаются в том, что надо с ключами повозиться, и публикация в Google Play не бесплатная. Чтобы зарегистрироваться разработчиком, надо приготовить 25 долларов. И это еще очень демократично, потому что Apple просит 99 долларов.
На данном слайде приведены ссылка на пример приложения, можно посмотреть мой проект. Это все еще альфа-прототип, поэтому прошу не судить строго, если приложение будет падать. Ссылка на актуальную документацию свежая, мне представляется, что она хорошая. Есть комьюнити, группа ВКонтакте, ее админ на Хабре периодически статьи выпускает.
— Добрый день. Меня зовут Владислав Шашков, я работаю в Сбербанке и вообще-то я продуктовик, не разработчик. Именно этим может быть интересен мой доклад, потому что он наглядно покажет, что сделать мобильное приложение на Python достаточно несложно.
Kivy — все-таки он «Киви», потому что образно его изображают на обложках книжек в виде фрукта, и на русском ближе будет произношение «Киви». Фреймворк развивается с 2011 года. По сути, это графическая UI-библиотека для создания кроссплатформенных приложений, не только на мобильных платформах. Ее особенностью является язык KV, это язык разметки. Если образно попробовать описать что такое язык KV, получится, что так бы выглядел HTML, будь он написан на Python.
Также мы поговорим о библиотеке KivyMD, которая представляет из себя набор виджетов в стиле Material Design. KivyMD позволяет создавать дружелюбный гугловый интерфейс, с которым можно работать над пользовательским опытом.
Здесь на видео показано, как пролистываются все виджеты, которые есть в библиотеке. Как вы можете видеть, это достаточно богатый набор элементов. Это и закладки, и кнопки, и прогресс-бары, и всплывашки. В принципе, есть все необходимое, чтобы реализовать нужный вам клиентский опыт. Если надо будет собрать сборку на iOS, то выглядеть она будет точно так же. Тот же Material Design. В принципе, такое приложение можно опубликовать в App Store, хоть оно и будет похожее на Google.
Kivy без KivyMD имеет очень аскетичный дизайн. Его даже клиентам показывать не стоит. Похожие на убунтовские простые кнопки, простые диалоги, не адаптированные к мобильному опыту, к мобильным пользователям. А KivyMD молодцы, все красиво сделано.
Есть плохая новость. Исполняемые пакеты приложения собирает специальная утилита — buildozer. И плохая новость заключается в том, что начать пользоваться, сделать первую сборку с ее помощью совсем не просто. Как и, наверное, с любым опенсорсным ПО, чтобы все получилось, чтобы в итоге дойти до цели и получить APK, нужно пройти определенной «тропой», не сворачивая по сторонам.
На этом слайде подробно описано, что нужно делать, как пройти по «тропе» и не сделать лишнего. Не надо пытаться обновить сам kivy или какие-то другие библиотеки в образе. Все что нужно, указано на слайде, остальное само подтянется и будет работать.
Дальше немного расскажу о структуре проекта Kivy. На слайдах размещены QR-коды, где закодированы ссылки на GitHub, чтобы вы могли их сейчас считать и непосредственно проследить примеры, о которых я буду рассказывать. (Первая ссылка — прим. ред.)
На экране представлен файл buildozer spec, это спецификация на проект. Самое важное здесь: есть строка, в которой перечисляются requirements, то есть библиотеки, которые необходимы для сборки, и в ней указывать надо Kivy, KivyMD, запись там есть, и на GitHub она тоже доступна.
Важный раздел, он закомментирован, касается андроидовских NDK, SDK, его трогать не надо. Значения по умолчанию будут работать.
Немного про UI и UX. В языке разметки KV есть два понятия: виджеты и лэйауты. Виджеты — видимые элементы, кнопочки, поля ввода и тому подобное. Виджеты получают события и могут их обрабатывать. А лэйауты — это объекты, которые позволяют позиционировать виджеты, их есть несколько видов, чтобы выстроить виджеты в рядок или наоборот, как-то произвольно позиционировать. В общем-то, этот подход стандартный для визуальных UI, UX, и в других библиотеках он тоже используется.
Здесь пример языка KV (ссылка — прим. ред.). Как мы видим, вначале за решеткой идет импорт библиотек, затем в угловых скобках… Неправильно говорить «корневой», просто начальный лэйаут, которому в коде будет сопоставлен класс. Один в один названия должны совпадать. Таким образом происходит сопоставление разметки и класса в коде. Дальше через отступы идут вложенные виджеты, внутри виджетов, опять отступом идут property и события, они в одном списке идут. Вот пример кода.
Вверху класс — класс лэйаута. Дальше идет класс приложения, и внизу две строчки для загрузки константы разметки, и запуска приложения. Знаю, что аудитория, наверное, не очень знакома с мобильной разработкой, поэтому расскажу о дальнейших шагах, что конкретно надо сделать на телефоне, чтобы запустить и отладить свой APK.
Первым делом надо на телефоне включить решим разработчика. Он достаточно хитро включается. Обычно это секретная последовательность нажатий пунктов меню в режиме настроек телефона. В презентации приведена одна из распространенных последовательностей, но на вашем телефоне она может не работать. После выполнения этой последовательности действий появится режим для разработчика, и можно уже устанавливать APK, отлаживать и дальше действовать.
Buildozer запускается в виртуальной машине, виртуальную машину надо обновить, чтобы она была посвежее. После этого появиться интеграция с USB, тогда можно будет подключить телефон к виртуальной машине.
Признак того, что у вас произошло подключение — телефон спросит разрешения на отладку. Каталог проекта создается в папке /BUILD. Чтобы собрать проект, необходимо в каталоге проекта выполнить команду buildozer android debug. Установка APK на телефон выполняется утилитой из Android Studio, которая уже есть в образе, командой adb install.
И фраза success говорит, что пока все хорошо, выполнена загрузка на телефон.
Отладка кода выполняется следующим образом. Надо запустить сбор отладочной информации командой adb logcat, чтобы параллельно с приложением работал сборщик. Ваше приложение после первого запуска «с высокой долей вероятности» упадет, после чего можно останавливать отладку и идти читать файлик логов.
Как искать сообщение об ошибке? По ключевому слову python. Самая последняя запись c ключевым словом python, как правило, расскажет вам, что пошло не так.
Про то, что можно сделать на телефоне. Мобильная платформа позволяет сделать не просто кнопочки, которые к API ходят, а поработать с большим разнообразием датчиков гаджета. Для работы с мобильной периферией есть стандартная библиотека plyer. Она платформенно-независимая, то есть все, что на ней будет написано, пересоберется с Android на iOS. На слайде перечислены все доступные опции. Там и GPS, и батарея, и камера… Но с камерой plyer позволяет сделать только статический снимок.
А следующий пример как раз расширяет эту возможность. Ссылка на GitHub, пример, который позволяет получать видеопоток в приложении. У меня была бизнес-задача QR-код распознать с картинки. Также этот пример может работать с распознаванием видео, дополненной реальностью и т. п.
Еще у kivy есть пространство для пользовательских аддонов — Garden. Любой может делать виджеты и тому подобное. Полезный виджет, который я использовал, это работа с картами. Он активный, можно масштабировать, покрутить карту. Здесь показан пример, как его подключать. В Garden есть много других виджетов.
Когда я работал над своим проектом, то проводил коридорное тестирование с коллегами, чтобы собрать обратную связь об использовании приложения. И получил такие замечательные возражения, как «я левые APK не буду ставить», «мама не разрешает», «я только телефон купил». Чтобы продолжить тестирование клиентского опыта по существу, мне пришлось пройти путь создания мобильного приложения до конца, а именно сделать релиз в Google Play. На слайде он описан. Основные моменты заключаются в том, что надо с ключами повозиться, и публикация в Google Play не бесплатная. Чтобы зарегистрироваться разработчиком, надо приготовить 25 долларов. И это еще очень демократично, потому что Apple просит 99 долларов.
На данном слайде приведены ссылка на пример приложения, можно посмотреть мой проект. Это все еще альфа-прототип, поэтому прошу не судить строго, если приложение будет падать. Ссылка на актуальную документацию свежая, мне представляется, что она хорошая. Есть комьюнити, группа ВКонтакте, ее админ на Хабре периодически статьи выпускает.
