Всем привет! Меня зовут Константин, я Flutter-разработчик в компании Nord Clan.

В данной статье мы с моей коллегой Анной хотели бы поделиться нашим опытом связки Flutter и home  виджетов на платформе iOS.

Каждый из нас, пользуясь смартфоном на любой из ОС на главных (или не очень) экранах, сталкивался с виджетами. Виджетами называются маленькие приложения которые выполняют не сложные действия, носят какой-либо информационный характер или же просто украшают ваш экран, учитывая что в данной статье идет речь про Flutter в котором «все это виджет», важно не запутаться, поэтому лучше всего сразу обозначить, что Widget мы будем относить к Flutter, а Home Widget (HW - для сокращения) относить как раз к вспомогательному приложению/виджету нативной системы.

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

Важно пояснить, для написания HW нам в требуется нативный код, по умолчанию любой HW относится к системе с которой мы работаем, Flutter в данном случае может только получать или передавать определенные данные. 

Вся бизнес логика была написана на Flutter, осталось разобраться исключительно с нативным кодом. Для этого мне пришлось задействовать мою коллегу, так как на текущий момент Swift я не знаю :)

Далее я передаю слово Анне, нашему потрясающему iOS разработчику :)

Для начала хотелось бы пройтись по некоторым нюансам iOS.

При добавлении WidgetKit (iOS 14, *) в приложение, существуют ограничения платформы, которые нужно было решить.

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

Во-вторых, HW имеют статус read-only, что означает, что они лишь отображают информацию из приложения, но не являются чем-то самостоятельным. Такое поведение HW лишает нас интерактива, с которым может взаимодействовать пользователь. По сути, HW в iOS - просто картинка с информацией, по тапе на которую откроется приложение. Единственная возможность как-то взаимодействовать с приложением через HW - это подцепить к нему WidgetURL() и передать туда ссылку на конкретный экран в приложении, но на этом всё.

Большая проблема: HW всегда будет открывать приложение. Это ограничение не дает нам возможности послать запрос в приложение по тапу на HW и при этом не открыть приложение во весь экран. 

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

В итоге эти ограничения платформы дают нам следующее: 

1.  HW всегда будет открывать приложение.

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

3. Разная реализация обработки урлов под все размеры HW.

4. Вишенка на торте: вся настройка HW возможна только на SwiftUI, никакого UIKit.

Выводы которые были сделаны: 

Необходимо создать метод, который будет возвращать, открыто ли приложение с HW и с какого именно. Это необходимо, чтобы мы со стороны Flutter могли поставить условие, что если приложение открыто с HW, то идет запрос на открытие двери. Если приложение просто открыто по тапу на него, ничего не должно происходить.

Далее переходим к реализации.

Задача: по нажатию на HW запустить приложение, вызвать в нем метод по открытию двери, отобразить то, что запрос отработал показав баннер и плавно скрыть приложение.

Проблема: Использование Home Widget на нативной платформе и бизнес логики написанной на Flutter. 

Как решали: со стороны Flutter создали канал связи (FlutterMethodChannel) имя которого должно совпадать с тем, которое мы создаем со стороны iOS, важно не ошибиться (как и всегда):

  static const platformChannel = MethodChannel('widgetChannel');

В AppDelegate настраиваем связь с созданным каналом, в методе didFinishLaunchingWithOptions:

 override func application(
  _
   application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
    ) -> Bool {
        
        let controller: FlutterViewController = window?.rootViewController as! FlutterViewController
        let channelName = "widgetChannel"
        let methodChannel = FlutterMethodChannel(name: channelName,
                                                 binaryMessenger: controller.binaryMessenger)

Создаем контроллер, канал и настраиваем все это в methodChannel, таким образом у нас появляется связь с приложением, но нужно еще настроить то, посредством чего мы будем общаться. Здесь это происходит по средством передачи сообщений, в нашем случае мы передаем Bool:

Future<void> resultFromIosWidget(BuildContext context) async {
    try {
      final bool result =
          await platformChannel.invokeMethod('openedFromWidget');
      
      if (result == true) {
        await MainRequests().openDoor(UrlConsts.doorUrlUl);} 
    } on PlatformException catch (e) {
      '${e.message}';
    } 
}

Нужно создать условие во Flutter, под критерии которого будет подходить метод открытия HW на iOS.

Со стороны iOS создаем переменную:

@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
    
    var isTappedOnWidget: Bool = false

Изначально значение ставим на false, чтобы каждый раз при открытии приложение не срабатывало это условие. Нам нужно только, чтобы этот сценарий срабатывал по открытию приложения из HW.

В расширении AppDelegate создаем метод, который будет ловить нажатие и понимать, что приложение открыто именно с HW:

extension AppDelegate {
   private func openedFromWidget(url: URL, isTapped: Bool) {
        var tapped = isTappedOnWidget
        if url.scheme == "widget", url.host == "widgetFamily", tapped == true {
            let widgetFamily = url.lastPathComponent
            tapped = isTapped
        }
    }
}

Ссылку создаем и формируем при настройке HW:

import WidgetKit
import SwiftUI

struct DoorOpenerWidgetEntryView: View {
    @Environment(\.widgetFamily) var widgetFamily
    var entry: Provider.Entry
 
    @ViewBuilder
    var body: some View {

        switch widgetFamily {
        case .systemSmall, .systemMedium:
            SystemWidgetView()
                .widgetURL(widgetLink)
        case .accessoryRectangular, .accessoryCircular:
          AccessoryWidgetView()
                .widgetURL(widgetLink)
        default:
            Text(Constants.errorWidget)
        }
    }
    private var widgetLink: URL {
        URL(string: "widget://widgetFamily/\(widgetFamily)")!
    }
}

Таким образом мы будем знать, что приложение раскрыто именно с HW, и даже узнаем с какого именно.

Возвращаемся в AppDelegate, создаем обработчик для канала, который будет принимать наше условие и сравнивать его с тем, какое условие необходимо со стороны Flutter, чтобы запустить запрос openDoor().

В recieveResult() получаем актуальное значение isTappedOnWidget и передаем его в prepareMethodHandler(), далее этот метод вызываем в didFinishLaunchingWithOptions перед return true:

private func prepareMethodHandler(channel: FlutterMethodChannel) {
        channel.setMethodCallHandler({
            (call: FlutterMethodCall, result: @escaping FlutterResult) -> Void in
            if call.method == "openedFromWidget" {
                self.recieveResult(result)
            } else {
                result(FlutterMethodNotImplemented)
                return
            }
        })
    }

 private func recieveResult(_ result: FlutterResult) {
        let answer = isTappedOnWidget
        result(answer)
    }

Но если сейчас все собрать - ничего не сработает, потому что мы нигде не меняем наше Bool условие с false на true, и не вызываем метод openFromWidget с нужным нам булем. 

Поэтому переопределяем метод application(app, open, options) в AppDelegate, в котором будем менять условие. Этот метод будет отрабатывать только при открытии приложения из HW, т.к. он отслеживает ранее созданные нами урлы. И если мы зашли в приложение по одному из урлов виджета и наш флаг isTappedOnWidget = true, то мы наконец-то попадаем под все условия, которые обозначили для себя со стороны Flutter:

override func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool {
    
        isTappedOnWidget = true

        if isTappedOnWidget == true {
            openedFromWidget(url: url, isTapped: isTappedOnWidget)
        }

        return true
    }

Что уже сделано: У нас открывается приложение с HW и идет запрос, мы получаем ответ и открываем дверь. Но приложение еще на экране, нужно его плавно скрыть. Это делаем через DispatchQueue.main.asyncAfter() в отдельной функции. Прописываем его также в расширении AppDelegate и вызываем сразу после смены флага в application(app, open, options):

private func closeApp () {
DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
            self.isTappedOnWidget = false
            UIControl().sendAction(#selector(URLSessionTask.suspend), to: UIApplication.shared, for: nil)
        }
}

Самое главное, чтобы этот метод корректно отрабатывал каждый раз при закрытие приложения в виджет, нам нужно сменить флаг с true на false, чтобы вернуть все в изначальное положение:

override func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool {
    
        isTappedOnWidget = true

        if isTappedOnWidget == true {
            openedFromWidget(url: url, isTapped: isTappedOnWidget)
        }
        closeApp()

        return true
    }

Таким образом мы получаем связку HW на платформе iOS с Flutter приложением.

Спасибо за прочтение статьи! А был ли у Вас опыт работы с Home Widget? Делитесь в комментариях! :)