Flutter. Много
2.77K subscribers
333 photos
23 videos
258 links
Заказать мобильную разработку: https://amiga.agency/?utm_source=tg
Заказать рекламу в канале @amiga_agency_bot

Новости Flutter-разработки, дайджесты мероприятий, личный опыт.
Download Telegram
Полезные мысли из книги Роберта Мартина «Идеальный программист»

Hola, Amigos! На связи Антон Мартышков, Flutter-dev Amiga. Для меня важной составляющей профессии является самообучение, нужно постоянно расти и отрабатывать полученную теорию на практике, развиваться не только технически, но и софтово. Программирование — это марафон, где нужно регулярно развиваться, что бы не сойти с дистанции.

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

⁃ Каждая написанная вами строка кода должна быть протестирована. Точка.

⁃ Преданность делу и профессионализм проявляются в дисциплине, а не в продолжительности работы.

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

⁃ Запланируйте 60 рабочих часов в неделю. Первые 40 вы работаете на своего работодателя, а остальные 20 на себя. В эти 20 часов вы читаете книги, практикуетесь, учитесь и иным образом развиваете свою карьеру.

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

⁃ Если вы хорошо знаете, что сделать страницу к завтрашнему дню невозможно, то отвечая: «Хорошо, я попытаюсь», вы не выполняете свою работу. Выполнить ее в этот момент можно только одним способом: сказать: «Нет, это невозможно».

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

Больше интересных мыслей можно найти в самой книге. Следуя принципам из нее, получится стать надежным и полезным участником команды, а ваши продукты станут успешнее.
👍25🔥4🤔2🤩2
Hola, Amigos!

Коллеги из AGIMA написали об обновлениях Flutter 3.7.0. В посте много ссылок для собственного изучения, все как мы любим.
👍6🔥3
Всем привет! Я Саша Ворожищев, Flutter Teamlead в AGIMA. Поэтому не могу пропустить эту новость: вышел Flutter 3.7.0. Постараюсь коротко рассказать, что в нем нового.

1. Поддержка Material 3.

Потыкать можно тут: https://flutter-experimental-m3-demo.web.app/#/.

2. Поддержка верхнего и каскадного меню для десктопных версий приложения.

https://api.flutter.dev/flutter/widgets/PlatformMenuBar-class.html.

3. Кастомизированное контекстное меню.

https://master-api.flutter.dev/flutter/cupertino/CupertinoTextField/contextMenuBuilder.html.

4. Новые виджеты CupertinoListSection и CupertinoListTile: отображения списка виджетов в стиле iOS.

https://api.flutter.dev/flutter/cupertino/CupertinoListSection-class.html

https://api.flutter.dev/flutter/cupertino/CupertinoListTile-class.html

5. Улучшение физики прокрутки и работы со списками. Также добавили новые виджеты: Scrollbars, DraggableScrollableSheet, AnimatedGrid и SliverAnimatedGrid.

https://api.flutter.dev/flutter/material/Scrollbar-class.html

https://api.flutter.dev/flutter/widgets/DraggableScrollableSheet-class.html

https://api.flutter.dev/flutter/widgets/AnimatedGrid-class.html

https://api.flutter.dev/flutter/widgets/SliverAnimatedGrid-class.html

6. Улучшение инструментов локализации. Был полностью переписан gen-l10n. Добавили работу с формами множественного числа.

https://docs.flutter.dev/development/accessibility-and-localization/internationalization

7. Замена движка Skia на Impeller. Почти. Новый движок обещает быть более быстрым и производительным при компиляции под iOS. Почему «почти»? Доступен он пока только на ветке Stage.

Подробнее:
https://github.com/flutter/flutter/wiki/Impeller

8. Проверка выпуска iOS. При выпуске приложения под iOS, при выполнении команды flutter build ipa будет проверка контрольного списка параметров. Это гарантирует, что приложение готово к отправке в AppStore.

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

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

Подробнее:
https://docs.flutter.dev/development/tools/devtools/memory

10. Работа с изолятами. Теперь Platform Channels можно вызывать из любого изолята. Ранее это можно было сделать только из основного потока.

11. Отключена поддержка Bitcode в iOS.

На самом деле изменений достаточно много, ознакомиться со всеми можно по ссылке ниже:

https://docs.flutter.dev/development/tools/sdk/release-notes/release-notes-3.7.0
👍16🔥6
Hola, Amigos! На связи Саша Чаплыгин, Flutter-dev Amiga.

Перевели и опубликовали новый материал на Habr — 12 методик, которые помогут создавать приложения на Flutter легко и просто. Я сам теперь применяю советы из нее в разработке. Будет полезно почитать разработчикам всех мастей, эта информация будет полезной для решения повседневных рабочих задач.
👍14🔥5👌3
Hola, Amigos!

По недавно вышедшей статье 12 методик, которые помогут создавать приложения на Flutter легко и просто сделали карточки, в которых раскрыли несколько методик. Остальное узнаете в самой статье, прочитать можно по ссылке.
👍11🔥42👎1
Что нового в Android Studio Electric Eel, ч.1

Hola, Amigos! На связи Саша Чаплыгин. Flutter-dev Amiga. Сегодня расскажу об обновлениях в Android Studio Electric Eel. Flutter-разработчики используют Android Studio как IDE для разработки приложений Flutter.

Крашлитика приложений от Firebase Crashlytics

Вы можете просматривать и обрабатывать данные о сбоях приложений из Firebase Crashlytics непосредственно в IDE. Эта интеграция извлекает данные из стека и статистику сбоев из Firebase Crashlytics в новое окно инструмента App Quality Insights в IDE, поэтому вам не нужно переключаться между браузером и IDE.
Благодаря интеграции Android Studio и Crashlytics вы можете писать код и решать основные проблемы сбоев в одном месте. Этот расширенный опыт разработки поможет вам быть в курсе стабильности вашего приложения и свести к минимуму сбоев для ваших пользователей.

Навигация по данным Crashlytics в Android Studio

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

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

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

3. На панели «Проблемы» отображаются основные события, для которых у Crashlytics есть данные, и они отсортированы по наиболее важным сбоям.

4. На панели «Sample Stack Trace» отображаются сведения о последнем возникновении события, которое вы щелкнули на панели « Проблемы ». Вы можете просмотреть стек вызовов события, чтобы перейти к соответствующим строкам в коде. Также есть информация о затронутом типе устройства, его версии Android и времени возникновения события, а также ссылка на событие на панели инструментов Firebase Crashlytics. Панель инструментов полезна, если вы хотите углубиться и проверить дополнительные трассировки стека, тренды и пользовательские журналы.

5. Панель «Подробности» разбивает количество сбоев по типу устройства и версии Android, поэтому вы можете определить, какие группы пользователей наиболее затронуты. Он также показывает, в каких версиях приложения произошел сбой, и количество затронутых пользователей.

6. Используйте фильтры, чтобы выбрать или отменить выбор критических или некритических событий.

7. Используйте фильтры диапазона времени и версии приложения, чтобы отточить определенные подмножества событий.
Помимо возможности переходить от стека вызовов к коду, вы также можете переходить от кода к стеку вызовов: Android Studio теперь выделяет строки кода, связанные со сбоями, чтобы вы могли легко обнаруживать и устранять их.
👍13🔥32
Что нового в Android Studio Electric Eel, ч.2 😵‍💫

Hola, Amigos! На связи Саша Чаплыгин, Flutter-dev Amiga. Сегодня продолжу рассказывать об обновлениях в Android Studio Electric Eel.

Эмулятор с изменяемым размером

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

Чтобы использовать эмулятор с изменяемым размером, вам потребуется Android Emulator версии 31.1.3 или выше. Чтобы обновить версии, выберите Tools > SDK Manager. Чтобы создать виртуальное устройство Android (AVD) с изменяемым размером, выполните следующие действия:

1. В процессе создания устройства выберите аппаратный профиль телефона Resizable (Experimental).
2. Загрузите образ системы Android Tiramisu.
3. Следуйте инструкциям, чтобы создать AVD.

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

Зеркалирование устройств

Теперь вы можете отразить свое устройство в окне «Работающие устройства» в Android Studio Electric Eel. Передавая изображение с вашего физического устройства непосредственно в Android Studio, вы можете выполнять стандартные действия, такие как поворот экрана, изменение громкости или блокировка/разблокировка устройства прямо из самой IDE.

Зеркалирование устройств доступно на канале Electric Eel Canary в качестве экспериментальной функции. Чтобы включить его вручную, перейдите File > Settings > Experimental или Android Studio > Preferences > Experimental на Mac и установите флажок рядом с Device Mirroring.

Desktop AVD

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

1. Изменение размера приложения: измените размер приложения, перетаскивая края окна.
2. Управление окнами произвольной формы: размещайте приложение в различных местах на экране рабочего стола, а также сворачивайте, разворачивайте и восстанавливайте окно приложения.
3. Уведомления: убедитесь, что уведомления отображаются правильно при извлечении из панели задач на рабочем столе.

В следующем посте расскажу о статистике SDK и о проверке влияния загрузки с помощью Build Analyzer🤓
Please open Telegram to view this post
VIEW IN TELEGRAM
👍8🔥4👏2👎1
Что нового в Android Studio Electric Eel, ч.3

Hola, Amigos! На связи Саша Чаплыгин. Flutter-dev Amiga. Это финальная часть об изменениях в Android Studio Electric Eel. Что же еще поменялось?

Статистика SDK
Сведения о зависимостях можно просматривать из нового Google Play SDK Index — общедоступного портала с информацией о популярных зависимостях или SDK. Если определенная версия библиотеки была помечена ее автором как устаревшая, при просмотре этого определения зависимости появляется соответствующее предупреждение Lint. Это позволяет обнаруживать и обновлять проблемы с зависимостями во время разработки, а не позже, когда вы публикуете свое приложение в Play Console.

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

В частности, вы можете использовать эту информацию для выявления проблем с конфигурацией, таких как использование динамических версий зависимостей, вызывающих непредвиденные загрузки. Кроме того, если вы видите большое количество неудачных запросов к определенному репозиторию, это может указывать на то, что этот репозиторий следует удалить или переместить ниже в конфигурации вашего репозитория.
🔥7👍5👌2👎1
Flutter Deeplinks, ч.1

Hola, Amigos! С вами Антон Мартышков, Flutter-dev Amiga. Я думаю, что каждый хоть раз да сталкивался с необходимостью реализовать диплинки в приложении. В этом посте мы рассмотрим Deep Links для Android и Custom Scheme Links для iOS.

Deeplinks — это обычная ссылка, и мы можем настроить платформы Android и iOS запускать наше приложение и передавать туда данные. Android и iOS похожи в реализации и работе этих механизмов. В Android есть 2 типа ссылок, открывающих приложение: Deep Links и App Links. У iOS также есть 2 типа ссылок: Custom Scheme Links и Uni Links.

Deep Links для Android
В файле android/app/src/main/AndroidManifest.xml внутри <activity>...</activity> необходимо добавить следующий intent-filter:

<meta-data android:name="flutter_deeplinking_enabled" android:value="true" />
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data
android:scheme="customscheme"
android:host="customdomain.com"
android:pathPrefix="/path" />
</intent-filter>

android:scheme — указывается кастомная схема либо http
android:host — указывается имя хоста
android:pathPrefix — опциональный параметр
Такой интент-фильтр будет открывать наше приложение для ссылок вида my-scheme://my-host/my-prefix и my-scheme://my-host/my-prefix*

Протестировать это можно нажатием на саму ссылку (customscheme://customdomain.com/path) или командой ниже:

adb shell am start -a android.intent.action.VIEW -d "customscheme://customdomain.com/path" your-app-package-name

Custom Scheme Links для iOS

Они очень схожи с Deep Links и App Links в Android, но Custom Scheme Links могут иметь только кастомные схемы, но не http и https, для них придумали Uni Links. Для добавления ссылки с кастомной схемой необходимо добавить следующее в info.plist файл:

<key>FlutterDeepLinkingEnabled</key>
<true/>
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLName</key>
<string>customdomain.com</string>
<key>CFBundleURLSchemes</key>
<array>
<string>customscheme</string>
</array>
</dict>
</array>

Причем CFBundleURLName необязателен, так как в iOS система смотрит только на CFBundleURLSchemes.

Чтобы проверить работу ссылки, можно открыть симулятор и вызвать команду
xcrun simctl openurl booted customscheme://customdomain.com/1 или customscheme://anything.

Важно: приложение должно быть установлено на устройстве.

В следующем посте я расскажу про продвинутые диплинки, которые при отсутствии приложения на устройстве ведут на GooglePlay или AppStore для его установки.
🔥19👍6
Hola, Amigos!

Нас ждут длинные выходные, поэтому мы сделали подборку интересных и полезных статей на Habr о Flutter. Будет, что почитать!

1. Nanc — backend-agnostic CMS с Flutterлюшками.
В этой статье речь идет о Not A Normal CMS. Вы узнаете, что это такое и что с помощью этой CMS можно делать. А еще внутри много видео-туториалов, есть ссылки на демо с клиентским и CMS-приложением, можно поиграться.

2. Как интегрировать Яндекс.Карты в приложение на Flutter.
Тут все понятно из названия: подробная инструкция с помощью каких пакетов и инструментов интегрировать Яндекс.Карты в любое приложение на Flutter.

3. Как стать Flutter-разработчиком, или Почему кроссплатформа сейчас — это лучший выбор.
Если вдруг вы пропустили: самая популярная статья от нашего Flutter-dev Саши Чаплыгина о том, как стать Flutter-разработчиком. Личный опыт, плюсы и минусы Flutter-разработки и полезные рекомендации по погружению и обучению этого кроссплатформенного фреймворка.

4. Flutter & games: пробуем Bonfire в роли игрового движка.
Статья о фреймворке Bonfire:о плюсах, минусах и практическом применении для разработки игр. Как дополнительный бонус — в конце статьи есть ссылка на GitHub с исходным кодом этого эксперимента.

5. Разработка приложения на Flutter с нуля до релиза: Идея + Базовая инфраструктура.
Немного устаревший, но все еще вполне себе рабочий и подробный инструментарий по разработке приложения на Flutter с нуля. Внутри много кода и ссылка на продолжение.

Присылайте в комментарии статьи, которые вам понравились, будет интересно поизучать!
🔥104👍4🙏1
Hola, Amigos!

Мы хотим спросить, что вам интересно узнать о Flutter?

Задайте
в комментариях любые интересующие вас вопросы, а мы ответим на них в следующих постах. Может быть, вам интересно узнать о наших must в пакетах или виджетах? Или любопытно узнать о команде Flutter-dev в Amiga? Спрашивайте нас обо всем🤓
👍112
Hola, Amigos!

Спасибо за интересные вопросы! Мы будем отвечать на них постепенно в ближайшие недели. А пока присоединяйтесь к чату канала, где можете общаться и задавать друг другу вопросы уже сейчас👨‍💻 Ссылка на чат: https://t.iss.one/+U37TSSnVbYxkZWFi.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7
Flutter Deeplinks, ч.2

Hola, Amigos! С вами Антон Мартышков, Flutter-dev Amiga. В прошлом посте я рассказал про Deep Links для Android и Custom Scheme Links для iOS. Сегодня расскажу об их продвинутых версиях — App Links для Android и Uni Links для iOS.

Основное их отличие от предыдущих это:

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

Android

1. Для работы с App Links у вас уже должно быть подписанное приложение и аккаунт разработчика в Google Play Console. В нем необходимо перейти в setup - app-integrity, там найти sha256-ключ для конфиг-файла ниже.

2. Далее создаем новую папку .well-known в корне вашего сайта и добавляем туда файл assetlinks.json, его код ниже. Не забудьте заменить com.example на имя пакета вашего приложения:

[{
"relation": ["delegate_permission/common.handle_all_urls"],
"target": {
"namespace": "android_app",
"package_name": "com.example",
"sha256_cert_fingerprints":
["Ваш - sha256_cert_fingerprints"]
}
}]
. Проверьте, что перейдя по ссылке типа - https://customdomain.com/.well-known/assetlinks.json вы видете содержимое файла.

3. В файле android/app/src/main/AndroidManifest.xml в блок activity необходимо такой intent-filter:

<intent-filter android:autoVerify="true">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="https" />
<data android:host="customdomain.com" />
</intent-filter>

android:scheme — указывается https
android:host — указывается имя хоста

Протестировать работу этого диплинка можно командой
adb shell am start -a android.intent.action.VIEW -d "https://customdomain.com" your-app-package-name.

iOS

1. Чтобы работать с Uni Links у вас должен быть аккаунт разработчика и сайта с https-схемой, куда позже можно закинуть конфиг файл - apple-app-site-association.

В консоле разработчика нужно включить Identifiers-> Associated Domains - enabled
Далее в Xcode перейти в Capabilities - Associated Domains и добавить новый домен наподобие этого: applinks:customdomain.com

Где applinks так и пишем, ничего не меняем, а customdomain.com — ваш сайт без https://.

2. Создаем файл apple-app-site-association (его код ниже) и кладем в уже знакомую нам .well-known папку в корневом каталоге вашего сайта.
{ 
"applinks": {
"apps": [],
"details": [
{
"appID": "<TeamId>.<BundleId>",
"paths": [ "*" ]
}
]
}
}

https://branch.io/resources/aasa-validator/ — этот инструмент подскажет вам, все ли правильно там положилось и доступно ли это для Apple.

Последние гайдлайны по этому файлу на iOS здесь. TeamId можно найти по ссылке, а BundleId в Xcode.

"paths": [ "*" ] значит, что по любой ссылке вашего сайта будет открываться ваше приложение, как изменить такое поведение описано здесь.

Протестировать приложение можно командой xcrun simctl openurl booted, но учтите, что Apple может сделать привязку вашего приложения с сайтом не сразу, они предупреждают за сутки.
🔥8👍21🎉1
RepaintBoundary

Hola, Amigos! На связи Саша Чаплыгин, Flutter-dev Amiga. Этот пост — один из многих о виджетах. Сегодня поговорим про RepaintBoundary.

RepaintBoundary — это виджет во Flutter, который позволяет оптимизировать производительность рендеринга, предотвращая ненужные перерисовки в частях дерева виджетов, которые не изменились.

Когда виджет помечается как RepaintBoundary, Flutter создает новый слой для него в дереве виджетов. Этот слой кэширует отрисованное представление виджета и перерисовывает его только при необходимости. Это означает, что если виджет за пределами RepaintBoundary обновляется, Flutter может пропустить перерисовку RepaintBoundary и всех его дочерних элементов, которые не изменились.

Как это работает?

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

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

Чтобы использовать виджет RepaintBoundary в своем приложении Flutter, просто оберните виджет, который вы хотите оптимизировать, в RepaintBoundary. Например:

RepaintBoundary(
child: MyWidget(),
);

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