CrossConf 2024

Hola, Amigos! С радостью делимся результатами крупнейшей ежегодной конференции по кроссплатформенной разработке и последним трендам в IT!

Мы заняли 3 место в номинации «Лучший материал» со статьей Александра Чаплыгина «Камера и Flutter». Если еще не читали, то можете исправить это по ссылке

И 2 место в номинации «Лучшая компания-просветитель в сфере кроссплатформенных технологий», в том числе благодаря нашему каналу Flutter.Много.

Спасибо, что читаете и поддерживаете нас! ❤️ Без вас этой победы бы не было. Будем и дальше делиться с вами полезными материалами и новыми событиями. Оставайтесь с нами!

Hola, Amigos! На связи Flutter-команда агентства продуктовой разработки Amiga.

Раскрываем карты! Несколько месяцев мы держали в секрете одну разработку — это наша собственная библиотека для помощи в разработке и тестировании - amiga_dev_screen. Она предоставляет возможности для логирования ошибок, кастомных событий и запросов к API, а также с ее помощью можно менять окружение и добавлять прокси для использования с снифферами🔥

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

Сейчас библиотека проходит финальные этапы доработки — релиз будет в декабре этого года.

Делитесь в чате, ждете ли вы выход библиотеки?

Hola, Amigos! На связи Михаил Чернецов, Flutter dev в Amiga, и Павел Гершевич, Mobile Team Lead в Amiga. Недавно мы рассматривали два пакета Chopper и Retrofit, сегодня разберемся с их преимуществами и недостатками.

Chopper

🦋 В преимущества использования Chopper можно записать более простую, по сравнению с Retrofit, обработку ошибок, так как он под капотом использует пакет http, а не dio.

🦋 Из коробки есть готовые интерсепторы для логирования запросов к API.

🦋 Chopper используется достаточно популярной библиотекой swagger_dart_code_generator, которая помогает нам практически не писать код для работы с сетью, а использовать для генерации Swagger.

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

Retrofit
🦋 У Retrofit уже встроена поддержка парсинга JSON из коробки, которую можно также вынести в отдельные изоляты.

🦋 Retrofit использует Dio, для которого существует большое количество дополнительных пакетов - от логирования (pretty_dio_logger) и провайдера для изображений (dio_image_provider) до кеширования (dio_cache_interceptor), работы с cookies (dio_cookie_manager) и обеспечения безопасности через SSL Pinning (http_certificate_pinning).

🦋 Но работа с Dio делает немного сложнее добавление своих интерсепторов, так как dio имеет более комплексную логику обработки.

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

Делитесь в чате, что используете на своих проектах. Chopper или Retrofit?

Hola, Amigos! На связи Михаил Чернецов, Flutter dev в Amiga. В прошлый раз мы рассмотрели Chopper, аналог Retrofit для нативного Android, теперь же посмотрим на пакет Retrofit, работающий на схожих принципах.

Retrofit под капотом использует Dio - пакет для взаимодействия с сетью. Для начала работы нам нужно создать абстрактный класс, из которого будет сгенерирован код для запросов к API:

```
part "my_service.g.dart";

@RestApi()
abstract class MyService {
factory MyService (Dio dio) = _MyService;

@GET('/todos')
Future> getTodos();

@Post(‘/todos’)
Future addTodo({
@Body required CreateTodoBody body,
});
}
```

Для создания общей логики обработки запросов используется класс Interceptor с методами onRequest, onResponse и onError, который обрабатывает запросы, ответы и ошибки. Лучше использовать разные интерсепторы для различной логики вместо создания одного для обработки всего и сразу.

Чтобы отменить запрос, например, если у пользователя пропало интернет-соединение, нужно сделать это в методе onRequest:

return handler.reject(MyException(),requestOptions: options);

И для использования нашего сервиса необходимо передать в него Dio:

```
Dio dio = Dio();
dio.options.baseUrl = ‘http://example.com/api’;
final client = MyService(dio);

await client.getTodos();
```

Делитесь в чате, что вы используете - Chopper или Retrofit?

Hola, Amigos! На связи Михаил Чернецов, Flutter dev в Amiga. Сегодня поговорим про то, как мы работаем с сетевыми запросами, а именно об одной из библиотек, которая нам это облегчает - Chopper.

Chopper уже достаточно давно существует и был создан как аналог библиотеки Retrofit, которая активно используется на Android. Он использует генерацию кода для упрощения работы с HTTP-клиентом.

Для использования Chopper, необходимо создать сервисы для работы с Rest API:

```
part "my_service.chopper.dart";

@ChopperApi(baseUrl: "/todos")
abstract class MyService extends ChopperService {

@Get()
Future> getTodos();

@Post()
Future addTodo({
@Body Map body,
});
}
```

Также необходимо создать класс самого клиента:

final chopper = ChopperClient( baseUrl: "http://example.com/api", services: [ MyService .service, ], interceptor: [ MyInterceptor(), ], );

Также для общей логики всех запросов можно использовать Interceptor, аналог middleware на Backend. В Chopper существует Request и Response Interceptor’ы.

class HeaderInterceptor extends RequestInterceptor{ @override FutureOr<Request> onRequest(Request request)async { return request.copyWith( headers: { …request.headers, ‘my\_header’: ‘abc’ }, ); } }

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

Дайджест октября

Hola, Amigos! Собрали в одну подборку все полезные посты и статьи октября, которые вы могли пропустить. Выбирайте, что вам интересно, и переходите по ссылкам.

⚪️ Базовые концепции пакета rxdart. Часть 1

⚪️ Базовые концепции пакета rxdart. Часть 2

⚪️ Инструмент Dart FFI

🔴 Запись доклада «Логирование на Flutter или какие метрики помогут в оптимизации»

⚪️ Platform Channels

⚪️ Pigeon для Platform Channels

⚪️ Команда Flutter. Павел Гершевич

Всем хорошего кода! 🙂

Hola, Amigos! На связи Павел Гершевич, Mobile Team Lead в Amiga. В прошлом году мы уже знакомили вас с нашей командой и рассказывали об их пути во Flutter, но время идет и команда меняется, поэтому возвращаем рубрику о наших классных разработчиках! Начнем, конечно же, с меня🔥

Я познакомился с Flutter в далеком 2018, когда он был еще в Alpha-версии. До него и параллельно с ним я работал с нативным Android на Java и Kotlin, попутно переместившись из мобильной разработки на Web, где занимался React.js. Тогда не было особо источников для расширения знаний о фреймворке, поэтому учился по официальной документации и YouTube-каналу Flutter. Уже позже я познакомился с тем, что начало появляться в сети, и сейчас продолжаю следить за YouTube, Medium, VC и Habr. Еще слушаю доклады на конференциях и общаюсь со спикерами на совместных ивентах — это всегда прокачивает хард-скиллы.

В свободное время я не только выступаю на крупных конференциях — DUMP, CodeFest, Mobius и других — но и веду занятия по мобильной разработке у студентов крупнейшего ВУЗа Сибири - Сибирского Федерального Университета.

Для тех, кто только начинает свой путь с Dart и Flutter, могу посоветовать:
Курс LazyLoad Dart & Flutter;
Книгу «Основы Dart»;
Конечно же, дождаться выхода книги «Основы Flutter».

Желаю вам успешного профессионального роста! Не забывайте приходить в чат, если возникают вопросы или трудности, я всегда буду рад поделиться опытом и помочь!

Hola, Amigos! Снова вещаем о Flutter на классных мероприятиях и зовем вас присоединиться! В этот раз выступим на конференции CrossConf по кроссплатформенной разработке и трендам IT, которая пройдет в Москве 8 ноября🔥

Конференция состоит из нескольких потоков:

- Crossplatform / Ecosystem
- Flutter
- Kotlin
- Product & Design
- Management

Павел Гершевич, Flutter Team Lead в Amiga, выступит с докладом «UI логгера на Flutter: Как сделать работу с логами удобнее и быстрее?».

В своем выступлении он расскажет о Dev Screen, зачем он нужен и как его внедрять, а также о том, как эффективно с ним работать при релизе приложения. Доклад будет особенно полезен Flutter-разработчикам.

Программа лежит по ссылке, а мы ждем вас 8 ноября в 12:45 во втором зале!

Hola, Amigos! На связи Михаил Чернецов, Flutter dev в Amiga. Сегодня мы посмотрим на еще один способ интеграции нативного кода в Flutter - Pigeon.

Pigeon - инструмент, создающий интерфейсы для работы с нативным кодом при помощи кодогенерации. Это помогает нам не прописывать обработку Platform Channels напрямую.

-----------------------------------------------

Давайте посмотрим, как с ним работать. Для начала создадим в корне проекта папку pigeons, в которой будут находится необходимые шаблоны.

```

import 'package:pigeon/pigeon.dart';

@HostApi()
abstract class CalculateHostApi {
int calculate(int a, int b);
}

```

Стоит учитывать, как данные передаются в платформу и какие типы данных поддерживаются платформой. Это можно узнать по ссылке.
Для получения сообщений от платформы необходимо использовать аннотацию @FlutterApi.
Так же можем описать классы, которые будут использоваться, Pigeon также сгененирует платформенных код для них.

Создадим файл generateCalculate.sh для того, чтобы запускать Shell-скрипт.

```

flutter pub run pigeon \
--input "pigeons/calculate.dart" \
--dart_out "lib/calculate.g.dart" \
--kotlin_out "android/app/src/main/kotlin/com/example/pigeon_example/Calculate.g.kt" \
--swift_out "ios/Runner/Calculate.g.swift"

```

Здесь мы обозначаем директории, в которых будет генерироваться Pigeon-файлы.
Если их не добавить, то данные файлы не сгенерируются. Для использования плагина на уровне Flutter-приложения теперь вызываем сгенерированный класс:

```

await CalculateHostApi().calculate(3, 7);

```

-----------------------------------------------

Для настройки Pigeon на Android теперь необходимо сделать две вещи:

1️⃣ Создать файл Calculate.kt и реализовать код нашего плагина:

```

class Calculate : FlutterPlugin, CalculateHostApi{
// Функция которую мы реализуем
override fun calculate(a: Long, b: Long): Long {
return a + b
}
// Подключение плагина к движку
override fun onAttachedToEngine(binding: FlutterPlugin.FlutterPluginBinding) {
CalculateHostApi.setUp(binding.binaryMessenger,this)
}

}

```

2️⃣ Добавить в плагины наш плагин в функции configureFlutterEngine в MainActivity:

```
flutterEngine.plugins.add(Calculate())

```

Для iOS необходимо внести изменения в файл AppDelegate.swift, проставить CalculateHostApi в наследники и вызвать CalculateHostApiSetup в функции application:

```
let controller: FlutterViewController = window?.rootViewController as! FlutterViewController
CalculateHostApiSetup.setUp(
binaryMessenger: controller.binaryMessenger,
api: self
)

```

И в этом же классе реализуем функционал нашего плагина:

func calculate(a: Int64, b: Int64) \-> Int64{ return a + b}

Тем самым мы реализовали Platform Channel с помощью Pigeon в нашем приложении.
Делитесь в чате, пробовали ли вы Pigeon для своих Platform Channels?

Hola, Amigos! На связи Павел Гершевич, Mobile Team Lead в Amiga. Мы продолжаем рассказывать вам про вызов нативного кода из Flutter. Сегодня поговорим про Platform Channel, что это такое и зачем оно нужно?

Platform Channel - основной способ вызова нативного кода из Android и iOS на Flutter. Существует 2 типа - Method Channel и Event Channel. Основная разница в том, как они взаимодействуют с нашим приложением. Method Channel служит для вызова функций, а Event Channel это Stream, в который добавляются события.

Давайте посмотрим, как их создавать, на примере Method Channel. Для начала дадим нашему каналу имя и запишем его вместе с пакетом нашего приложения:

```

final channelName = ‘sample.example.com/my_method_channel’;

```

Далее подготовим метод, который обратится в нативный код:

```

Future nativeSum(int a, int b) async {
await platfom.invokeMethod(‘nativeSum’,{‘a’: a, ‘b’: b});
}

```

Если вызвать этот метод сейчас, то мы получим исключение, что такой Method Channel не найден, так как нам нужно добавить нативный код.

Для Android мы сначала добавляем конфигурацию в MainActivity.kt, создавая константу с названием канала:

```

private val CHANNEL = “sample.example.com/my_method_channel”

```

И добавляя сам канал методе configureFlutterEngine:

```

MethodChannel(flutterEngine.dartExecutor.binaryMessenger, CHANNEL).setMethodCallHandler(this)

```

Теперь нам надо добавить интерфейс MethodCallHandler к нашему классу MainActivity. После чего у нас появится метод для обработки обращений из Dart. Давайте напишем обработку для такого метода.

```

when (call.method) {
“nativeSum” -> {
val a = call.argument(“a”) ?: 0
val b = call.argument(“b”) ?: 0
result.success(a + b)
}
else -> result.notImplemented()
}

```

И давайте теперь сделаем это для iOS на Swift. Тут все изменения будут происходить в файле AppDelegate.swift. Создаем канал:

```

let myChannel = FlutterMethodChannel(name: “sample.example.com/my_method_channel”, binaryMessenger: controller.binaryMessenger)
```

И затем добавим обработку вызовов:

```

myChannel.setMethodCallHandler({
[weak self] (call: FlutterMethodCall, result: FlutterResult) -> Void in

switch call.method:
case “nativeSum”:
let args = call.arguments as? [String, Any]
let a = args[“a”] as? Int
let b = args[“b”] as? Int
result(a + b)
default:
result(FlutterMethodNotImplemented)
})

```

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

Делитесь в чате, пробовали ли вы писать свои платформенные каналы?