首页 > 其他分享 >iOS原生接入Flutter

iOS原生接入Flutter

时间:2022-11-22 13:24:56浏览次数:62  
标签:原生 iOS module flutter install path post Flutter

官方文档:https://flutter.cn/docs/development/add-to-app/ios/project-setup

原生的oc写的代码,新的需求页面想要用flutter来写,那么如何在原生项目里加入flutter呢?

1、新建一个OC的原生工程项目。该项目是个简单的project的,只有一个页面和一个按钮,点击按钮present到flutter页面

 

2、创建一个flutter的Module项目,用来写flutter页面的。这里的module命名为flutter_module。

这里使用flutter命令创建

cd到相应的ios工程目录下,执行以下命令:

flutter create --template module flutter_module

 相应的目录下出现flutter_module,说明创建成功

 

3、接着在原生的oc工程中引入cocoapod来做管理。

cd 到原生的oc工程中,执行 pod init

修改podfile

在podfile依赖文件的依赖部分添加如下内容:

1)在 Podfile 中添加下面代码:

flutter_application_path = './flutter_module'
load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')

 2)每个需要集成 Flutter 的 Podfile target,执行 install_all_flutter_pods(flutter_application_path)

target 'MyApp' do
  install_all_flutter_pods(flutter_application_path)
end

 3)在 Podfile 的 post_install 部分,调用 flutter_post_install(installer)

post_install do |installer|
  flutter_post_install(installer) if defined?(flutter_post_install)
end

 如下图,增加3个红色框内容:

 

4、执行pod install 就可以把创建的flutter module和原生的oc项目关联起来了

 

标签:原生,iOS,module,flutter,install,path,post,Flutter
From: https://www.cnblogs.com/jys509/p/16914807.html

相关文章

  • 什么是云原生?
    什么是云原生?技术的变革,一定是思想先行,云原生是一种构建和运行应用程序的方法,是一套技术体系和方法论。云原生(CloudNative)是一个组合词,Cloud+Native。Cloud表示应用程序位......
  • vue3 封装axios
    1添加一个新的http.js文件封装axios 引入axios //引入Axiosimportaxiosfrom'axios'定义一个根地址//视你自己的接口地址而定varroot2='http://121.4.6......
  • [Android开发学iOS系列] TableView展现一个list
    TableView基础本文讲讲TableView的基本使用.顺便介绍一下delegation.TableView用来做什么TableView用来展示一个很长的list.和Android中的RecyclerView不同,iOS中的......
  • 【云原生】Kubernetes(k8s)Calico 客户端工具 calicoctl
    目录一、概述二、calicoctl安装三、calicoctl简单使用1)认证信息配置2)查看IP资源池3)配置IP池4)IP资源池示例演示5)固定IP示例演示6)网络策略(NetworkPolicy)四、Kube-ip......
  • vue+axios+ssm解决跨域问题
    环境1.vue-admin-template模板2.axios3.后端java跨域问题解决方案注意:配置了前端解决方案后端可以不用配置,反之后端配置了前端可以不用配置前端解决方案前端采用......
  • vue+axios跨域问题
    环境1.vue-admin-template模板2.axios3.后端java跨域问题解决方案前端vue.config.js文件在module.exports中找到devServer完成如下配置devServer:{port:p......
  • 微信小程序ios保存文件预览打不开的问题
    需求:微信小程序能下载xls文件到手机容易出错的点:1、没有配置域名,因为我的文件地址是阿里云的,小程序下载的时候会报没有配置域名,(因为我本地跑的时候勾选了不效验域名,所以......
  • axios二次封装-main.js使用
    axios封装:配置代理:axios封装:axios的二次封装:请求拦截统一token处理:引入:使用:导入:响应拦截统一错误处理:导入:main.js:login页面:效果:请求:我们要请求......
  • 云原生学习笔记-1-docker
    一、基础环境说明1、操作系统:Centos7.6;1master;2node2、docker版本:docker-ce19.03.8-3二、docker安装1、使用阿里镜像仓库,mirror.aliyun.com#step1:安装必要的一些......
  • React native ios上架
    1.申请开发者账号,去苹果开发者中心申请2.applicationloader集申请证书、真机调试、发布于一身,避免繁琐的官网申请过程http://kxdang.com/topic/appuploader/iosdev1.htm......