KMP + Compose 跨平台 Android IOS 实战入门

KMP(Kotlin Multiplatform)是一种面向移动端开发的跨平台框架,使用 Kotlin 语言编写,可实现在 Android 和 iOS 平台上共享代码和逻辑。通过 KMP 框架,我们可以编写一次代码,然后在不同的平台上进行部署和运行,大大提高了开发效率和代码重用性。KMP 框架允许我们使用相同的代码基础来构建和维护应用程序,减少了开发过程中的重复劳动,同时也能够更方便地进行代码调试和测试。

由于 KMP 的跨平台只停留在逻辑上,那么从 UI 上就需要使用到 Compose 的跨平台了

在使用 KMP + Compose 进行开发时,需要几个硬性条件:

1️⃣ Mac电脑(苹果开发必须mac)
2️⃣ Android Studio
3️⃣ Xcode
4️⃣ 配置 ios 开发环境(cocoapods、开发者账号等)


一切准备好之后,在 Android Studio 上安装 Kotlin Multiplatform Mobile 插件:

创建一个 KMM 项目:

Android 端配置默认即可,IOS 这边的 framework distribution 确保是 cocoapods


创建完一个项目后,会有这些目录:

和通常的 Android 工程相比,多了两个模块:iosApp 和 shared

顾名思义就是 IOS 的代码会在 iosApp 模块中,shared 模块则存放的是 Android 和 IOS 的通用代码,包括逻辑代码和UI代码


想要在 shared 模块下写 Compose,还需要额外的依赖:

 settings.gradle.kts:

pluginManagement {repositories {// ....maven("https://maven.pkg.jetbrains.space/public/p/compose/dev")}plugins {id("org.jetbrains.compose").version("1.6.1")}
}

share 模块的 build.gradle.kts:

plugins {// ....id("org.jetbrains.compose")
}kotlin {// ....sourceSets {commonMain.dependencies { // 公共模块 UI或业务 依赖implementation(compose.ui)implementation(compose.foundation)implementation(compose.material)implementation(compose.runtime)}}}

配置好后,Sync 一下就可以在 share 模块中编写 Compose 代码和运行了


IOS 这边默认是没有用到 Compose 的,所以需要替换一下配置信息让 IOS 调用到 share 模块的 Compose 函数

iosApp -> iosApp -> IOSApp.swift:

import SwiftUI
import shared@main
struct iOSApp: App {var body: some Scene {WindowGroup {ContentView()}}
}

ContentView.swift:

import SwiftUI
import sharedstruct ContentView: View {var body: some View {ComposeView().ignoresSafeArea()}
}struct ComposeView: UIViewControllerRepresentable {func makeUIViewController(context: Context) -> UIViewController {Main_iosKt.iOSView() // 调用公共模块的函数}func updateUIViewController(_ uiViewController: UIViewController, context: Context) {}
}

IOS 调用 Main_iosKt.iOSView() 对应的就是 share 模块 main.ios.kt 文件中的 iOSView 函数

share -> iosMain -> kotlin -> 包名 -> main.ios.kt

import androidx.compose.ui.window.ComposeUIViewController
import platform.UIKit.UIViewControllerfun iOSView(): UIViewController = ComposeUIViewController {CommonView()
}

CommonView:

share -> commonMain -> kotlin -> 包名 -> CommonView.kt

@Composable
internal fun CommonView() {Box(Modifier.fillMaxSize()) {Box(Modifier.size(100.dp).background(Color.Cyan).align(Alignment.TopStart))Box(Modifier.size(100.dp).background(Color.Green).align(Alignment.Center))Box(Modifier.size(100.dp).background(Color.Blue).align(Alignment.BottomEnd))}
}

然后在 Edit Configurations 配置一下 IOS 的运行设备配置

运行:


Android 这边为了规范,也新建一个:

share -> androidMain -> kotlin -> 包名 -> main.android.kt

@Composable
fun AndroidView() {CommonView()
}

在 Android 端进行调用: 

class MainActivity : ComponentActivity() {override fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)setContent {AndroidView()}}
}

运行:


KMP + Compose 这一套确实能够实现逻辑和 UI 上的跨平台,但是如果是涉及到 IOS 特定的属性,就需要通过与 IOS 原生的交互来实现

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/8484.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python能够干什么?

python有哪些用途? Python是一种高级编程语言,它被广泛用于各种不同的领域。以下是Python的一些常见用途: 网络应用开发:Python可以用于编写Web应用程序、API、爬虫、网络服务器等。数据科学和机器学习:Python拥有许…

深究muduo网络库的Buffer类!!!

最近在学习了muduo库的Buffer类,因为这个编程思想,今后在各个需要缓冲区的项目编程中都可以用到,所以今天来总结一下! Buffer的数据结构 muduo的Buffer的定义如下,其内部是 一个 std::vector,且还存在两个…

Shell编程之条件语句

条件测试 文件测试与整数测试 字符串测试与逻辑测试 if语句 if单分支语句 if双分支语句 if多分支语句 case分支语句 条件测试操作 条件测试操作 1 条件判断 test命令测试表达式是否成立,若成立返回0.否则返回其它数值。 格式 1 test 条件表达式 格式 2 …

【Redis7】了解Redis

1.常见数据库 1.1.键值存储数据库 如 Map 一样的key-value 对,典型代表就是 Redis。 1.2.列存储数据库 关系型数据库是典型的行存储数据库,按行存储的数据在物理层面占用的是连续存储空间,不适合海量数据存储。而按列存储则可实现分布式存储&…

猫不爱喝水是正常的?求求別再被洗脑了!日常可以补水的主食分享

猫不爱喝水正常吗?看给猫喂的什么,喂的罐头的话不爱喝水问题不大。喂的干粮猫还长期不喝水,处于缺水状态,可能会出现便秘、上火、尿黄、尿少等症状。在高温的夏季,猫还可能因脱水而中暑,严重时甚至可能导致…

用c++实现汉诺塔问题、归并排序

6.1.3 汉诺塔问题 【问题】 汉诺塔问题(Hanio tower problem)来自一个古老的传说:有一座宝塔(塔A),其上有64个金碟,所有碟子按从大到小由塔底堆放至塔顶。紧挨着这座宝塔有另外两座宝塔(塔B和塔C),要求把塔A上的碟子移动到塔C上…

01-xss基本原理

核心:攻击的是前端&#xff0c; 一、课程引入 1、开发一个简单的PHP页面&#xff0c;代码如下&#xff1a; <?php // xss 基础演示代码&#xff1a;从浏览器中接受一个URL地址参数名为content if(isset($_GET[content])){$content$_GET[content];echo "你输入的内容…

再议大模型微调之Zero策略

1. 引言 尽管关于使用Deepspeed的Zero策略的博客已经满天飞了&#xff0c;特别是有许多经典的结论都已经阐述了&#xff0c;今天仍然被问到说&#xff0c;如果我只有4块40G的A100&#xff0c;能否进行全量的7B的大模型微调呢&#xff1f; 正所谓“纸上得来终觉浅&#xff0c;…

进程状态与优先级

Linux内核源代码&#xff1a; 首先我们需要明确一点&#xff0c;Linux操作系统和操作系统的进程状态是不同的 上图大概标识了各个状态对应在操作系统的状态 普通进程 R运行状态&#xff08;running&#xff09;: 并不意味着进程一定在运行中&#xff0c;它表明进程要么是在…

ROS 2边学边练(44)-- 从头开始构建一个视觉机器人模型

前言 从此篇开始我们就开始接触URDF(Unified Robot Description Format&#xff0c;统一机器人描述格式)&#xff0c;并利用其语法格式搭建我们自己的机器人模型。 动动手 开始之前我们需要确认是否安装joint_state_publisher功能包&#xff0c;如果有安装过二进制版本的urdf_…

解密某游戏的数据加密

前言 最近有个兄弟通过我的视频号加我&#xff0c;咨询能否将这个dubo游戏游戏开始前就将数据拿到从而进行押注&#xff0c;于是通过抓包工具测试了下&#xff0c;发现数据有时候是明文&#xff0c;有时候确实密文&#xff0c;大致看了下有这几种加密&#xff1a;Md5aes、Md5&a…

网络层协议之 IP 协议

IP 协议格式 4 位版本&#xff1a;此处的取值只有两个&#xff0c;4&#xff08;IPv4&#xff09;和 6&#xff08;IPv6&#xff09;&#xff0c;即指定 IP 协议的版本。 4 位首部长度&#xff1a;描述了 IP 报头多长&#xff0c;IP 报头是变长的&#xff0c;因为报头中的选项部…

点餐小程序 点餐系统 微信点餐系统 支持微信小程序 支付公众号 可接入第三方配送 全开源uniapp

餐饮连锁v2版-体验后台&#xff08;复制粘贴以下地址到浏览器&#xff0c;打开网址即可登录&#xff0c;) 本文来自&#xff1a;点餐小程序 点餐系统 微信点餐系统 支持微信小程序 支付公众号 可接入第三方配送 全开源uniapp - 源码1688 演示后台&#xff1a;https://diancan.…

异构图神经网络——Heterogeneous Graph Neural Networks

相关代码见文末 1.回顾同构图 1.1 GNN GNN基本计算方法——邻接矩阵乘以节点,聚合相邻节点的特征,得到本节点的特征表达 1.2 Graph Attention Network 引入图注意力,实现边的权重可学习,最简单的方法是,将两个节点的特征进行拼接,使用一组可学习的权重参数映射为边的权…

华为数据之道第一部分导读

目录 导读 第一部分 序 第1章 数据驱动的企业数字化转型 非数字原生企业的数字化转型挑战 业态特征&#xff1a;产业链条长、多业态并存 运营环境&#xff1a;数据交互和共享风险高 IT建设过程&#xff1a;数据复杂、历史包袱重 数据质量&#xff1a;数据可信和一致化…

学习大数据,所需更要的shell基础(2)

文章目录 read读取控制台输入函数系统函数bashnamedirname 自定义函数Shell工具&#xff08;重点&#xff09;cutawk 正则表达式入门常规匹配常用特殊字符 read读取控制台输入 1&#xff09;基本语法 read (选项) (参数) ①选项&#xff1a; -p&#xff1a;指定读取值时的提示…

C++初识多态(1)

1.多态要解决的问题&#xff08;引入&#xff09; 任何一种机制的存在&#xff0c;必然是有其存在的意义的&#xff0c;例如我们前面学过的函数重载&#xff0c;运算符重载&#xff0c;以及引用等等&#xff0c;都是解决一些特殊问题的&#xff1b; 下面通过一些具体的例子&a…

组合模式(Composite)——结构型模式

组合模式(Composite)——结构型模式 组合模式是一种结构型设计模式&#xff0c; 你可以使用它将对象组合成树状结构&#xff0c; 并且能通过通用接口像独立整体对象一样使用它们。如果应用的核心模型能用树状结构表示&#xff0c; 在应用中使用组合模式才有价值。 例如一个场景…

剁手党必看——转转红包使用规则与最优组合计算全解析

​ 1、省钱攻略基础之“了解平台红包使用规则” 2、举个栗子 3、最优红包组合计算方法进化过程 3.1、初代“笛卡尔乘积”版 3.2、二代“边算边比较Map聚合”版 3.3、三代“边算边比较数组索引定位”版 4、总结 1、省钱攻略基础之“了解平台红包使用规则” 规则一&#x…

介绍 ffmpeg.dll 文件以及ffmpeg.dll丢失怎么办的五种修复方法

ffmpeg.dll 是一个动态链接库文件&#xff0c;属于 FFmpeg运行库。它在计算机上扮演着非常重要的角色&#xff0c;因为它提供了许多应用程序和操作系统所需的功能和组件。当 ffmpeg.dll 文件丢失或损坏时&#xff0c;可能会导致程序无法正常运行&#xff0c;甚至系统崩溃。下面…