Заводим Яндекс Карты в Compose Multipltform

...

С самого начала я попробовал проделать стандартную процедуру из документации Kotlin. Подключаем Pod прямо в описании build.gradle, можем даже указать название пакета или еще какие-нибудь флаги cinterop. Под капотом всей этой темы работает cinterop. Он прочтет заголовки уже скомпилированной библиотеки Objective-C и создаст нам klib файлы, которые позволяют легко "трогать" нужный нам функционал, не покидая common module. Кстати, в документации Kotlin даже в качестве примера используется YandexMapsMobile.

Примерная схема работы с подключенным pod

// build.gradle.kts

kotlin {
    ios()

    cocoapods {
        summary = "CocoaPods test library"
        homepage = "https://github.com/JetBrains/kotlin"

        ios.deploymentTarget = "13.5"

        pod("YandexMapsMobile") {
            version = "4.4.0-lite"
        }
    }
}

// iosMain/*.kt
import cocoapods.YandexMapKit.*
Copy

Этот способ не сработал. Конкретно сама библиотека скомпилировалась, линковщик отработал, импорты тоже, даже установка токена работала. Но вот, как только в проекте появился следующий импорт:

import cocoapods.YandexMapsMobile.YMKMapView
Copy

То сразу посыпались ошибки линковщика: Undefined symbols: "OBJC_CLASS на-на-на Проблема была вызвана именно OpenGL зависимостью, которую карты используют для отрисовки, именно поэтому линковщик выдает исключение, когда в проект импортируется представление карты. Так как проект уже задерживался, нужно в срочном порядке придумать другое решение.

Можно самостоятельно скомпилировать библиотеку YandexMapsMobile в framework, включая все зависимости и подключить, что называется, вручную. Данный способ тоже описан в документации и довольно широко применяется. Отличие от предыдущего метода заключается лишь в том, что мы просто собираем framework сами, а не возлагаем эту ношу на cocoapods.
"А как же мне достать framework, а не pod?" - подумал я. Оказалось все довольно просто. Получить .framework библиотеки можно несколькими способами:

1. Найти на официальной странице разработчиков
2. Найти на неофициальной странице от хороших людей
3. Собрать своими ручками проект с pod зависимостью и достать framework из DerivedData (тут ссылки нет – своими ручками все)

После того, как задача с .framework решена, можно приступать к его подключению в проект.

1. Кидаем куда-нибудь в проект ваш .framework
2. Создаем .def файл с информацией о нашем framework
3. Пишем конфигурацию в build.gradle.kts и радуемся  или нет

// build.gradle.kts
kotlin {
  sourceSets {
    val myYandexMapsMobileDefFilePath = "$projectDir/src/nativeInterop/cinterop/YandexMapsMobile.def"
    val myYandexMapsMobileCompilerLinkerOpts = "-F${projectDir}/../iosApp/"
    val myYandexMapsMobileIncludeDirs = "$projectDir/../iosApp/Pods/YandexMapsMobile"
    iosArm64 {
        compilations.getByName("main") {
            val YandexMapsMobile by cinterops.creating {
                // Path to .def file
                packageName("cocoapods.YandexMapsMobile")
                defFile(myYandexMapsMobileDefFilePath)
                includeDirs(myYandexMapsMobileIncludeDirs)
                compilerOpts(myYandexMapsMobileCompilerLinkerOpts)
            }
        }
    
        binaries.all {
            // Tell the linker where the framework is located.
            linkerOpts(myYandexMapsMobileCompilerLinkerOpts)
        }
    }
  }
}
Copy

Как написать .def файл и добавить собственные linker options можете узнать в документации Kotlin multiplatform.

На этом этапе ошибка не пропала, поэтому пришлось решать задачу "обходным путем"

Представление самой карты написано на swift и используется библиотека, импортированная через pod. Kotlin framework тоже через pod добавлен (native cocoapods), поэтому pod я добавил, просто прописав в Podfile вручную.

# ../iosApp/Podfile

platform :ios, '14.1'

target 'iosApp' do
  use_frameworks!

  pod 'composeApp', :path => '../composeApp'
  pod 'YandexMapsMobile', '4.4.0-lite' # Yandex Maps SDK

end
Copy

Для работы с представлением карты в проекте написана Composabel expect функция, она реализована в iosMain и в androidMain. Параметры естественно зависят от ваших потребностей.

@Composable
expect fun YandexMap(
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    zoom: Float = 14f,
    location: LatLng? = null,
    startPosition: LatLng? = null,
    points: List<PointMapModel>,
    onPointClick: (id: Long) -> Unit,
    customPosition: Boolean,
    canSelectPosition: Boolean,
    anotherLocationSelected: Boolean,
    bottomFocusAreaPadding: Int,
    onPositionSelected: (lat: Double, lng: Double) -> Unit,
    onDragged: () -> Unit
)
Copy

Я попробовал различными способами завернуть UIViewController, но лучше ничего не получилось, чем его просто разместить как поле в протоколе.

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

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

fun initKoinIos(
    mapProtocol: YandexMapProtocol
) {
    startKoin {
        modules(
            module {
                single<YandexMapProtocol> { mapProtocol }
            } +
            commonModule() +
            listOf(platformModule())
        )
    }
    Napier.base(DebugAntilog())
}
Copy

Собственно сам запуск DI и также установка токена карты. Запускать карту onStart() в этом месте вовсе необязательно.

import SwiftUI
import ComposeApp
import YandexMapsMobile
  
@main
 struct iOSApp: App {
    init() {
        YMKMapKit.setApiKey(Constants().MAPKIT_API_KEY)
        YMKMapKit.sharedInstance().onStart()
        KoinDI_iosKt.doInitKoinIos(mapProtocol: YandexMapProtocolImpl())
    }

	var body: some Scene {
		WindowGroup {
		ContentView()
		}
	}
}
Copy

Реализация actual функции со специфичной логикой.

Главные моменты это изъятие из DI нужного модуля.

val yandexMapProtocol = koinInject<YandexMapProtocol>().apply {
        addCameraListener(onDragged)
        addMapPointListener(onPointClick)
    }
Copy

Далее обертка в UIKitView

UIKitView(
        factory = {
            yandexMapProtocol.viewController.view
        },
Copy

Полный код файла: