开发第一个flutter app的六个关键步骤

news2024/11/24 3:49:27

Flutter这些年发展的很快,特别是在 Google 持续的加持下,Flutter SDK 的版本号已经来到了 3开头,也正式开始对 Windows、macOS 和 Linux 桌面环境提供支持。如果从 Flutter 特有的优势来看,我个人认为主要是它已经几乎和原生的性能表现没什么太大的差别,这一点是 React Native 和 Vue 等前端框架望尘莫及的。

在我们熟悉的应用中也有很多是使用 flutter 或更严谨的说部分用到 flutter 进行开发的,例如微信、闲鱼、淘宝、学习强国、微博等大家经常会使用到的 App。所以有国内大厂们做技术的案例,同时他们的参与也持续的丰富了技术生态,很多企业或个人开发者在考虑应用开发时不可避免的会将 flutter 作为技术选型的目标之一。

那我们作为一个普通开发者或者更直白的说,作为一个之前没有接触过 flutter 的开发者,我们应该如何去开发自己的第一个 flutter app 呢?

在这里我主要分享开发使用 flutter app 的一个环境配置相关的注意项。

环境配置的主要步骤可以分为6步:

1、软硬件系统的准备

硬件系统主要包括操作系统和内存,这里我们以 Windows 为例,操作系统需要是 64 位的 Windows 10 或以上版本;

磁盘的空间我们需要预留大约 30 GB,因为里面需要包括到 flutter SDK、Android SDK、IntelliJ IDEA、Visual Studio、Chrome、Git 和 Java SE 等工具。

相信这一步大家的电脑都能做到,如果准备完这一步,那相当于完成了第一步,将正式进入到环境的配置环节。

2、Java 环境配置

为什么会配置 Java 环境呢?因为 Flutter 是基于 Android 的,所以要安装 Java 环境。

Java 环境下载地址需要访问 Oracle 的官网,具体的安装步骤和正常的软件安装一样比较简单,这里就不进行赘述了。

3、配置 Flutter SDK

在这一步大家应该都知道 flutter 是使用的 dart 语法,所以在这一步我们也需要同步的集成 dart sdk ,按照 flutter sdk 也非常简单,只需要在官网下载安装包即可。

在这里插入图片描述

另外这里需要注意的是解压缩后的 zip 文件,需要选择一个合适的文档位置存放。这个位置用来保存 flutter sdk 和 dart sdk,此后非必要不要随意进行移动。

打开解压后的文件会看到 flutter_console 文件,后面我们使用 flutter 命令时,也需要通过双击这个文件进来再执行flutter相关命令。

安装成功后,需要复制代码下面的代码在命令行验证环境配置。

flutter doctor
如果看到下面的这个界面就代表 flutter 安装成功了。

在这里插入图片描述

4、安装 IntelliJ IDEA

IntelliJ IDEA 也是访问官网下载页面,这里我们下载并安装个人免费的 Community(社区版)就够用了。

安装完毕后,启动 IDEA,选择“New Project”(新建项目),接着依次选择 Android -> Install SDK。

在这里插入图片描述

最后我们还需要在 IntelliJ IDEA 中安装 IDEA 的 Dart 和 Flutter 插件,安装 Flutter 插件时,会提示安装 Dart 插件,一并安装即可。

5、安装 Chrome

这个就不用多说了,我相信开发者的电脑都有 Chrome 浏览器,如果没有的话直接百度下进行安装即可,这个安装非常简单也不用多说。

可能也有小伙伴会问为什么需要安装Chrome,因为我们主要用于预览和调试 Web App页面。

6、安装 Visual Studio

Visual Studio 用于开发运行在 Windows 中的软件,下载 Community(免费的个人社区) 版本即可。

安装时可以对照下面的图进行配置选择:

在这里插入图片描述

到这一步,整个环境配置的流程就完成了,我们可以启动 IDEA 开启第一个 flutter app 的搭建。

7、小程序运行环境集成

另外附加增加了一个针对很多同学是直接从小程序转到flutter,同样一个功能业务仅需一次小程序开发,即可实现在除了微信端的其它 App 中也运行起来。

原理其实挺简单的,FinClip 提供了小程序 SDK 给 Flutter 应用进行集成,这样以来 App 即拥有了一套可运行小程序业务代码的宿主环境。

在这里插入图片描述

集成 SDK 需要在 FinClip 平台中创建应用并绑定小程序,获得每个应用专属的 SDK KEY 及 SDK SECRET ,随后可以在集成 SDK 时填写对应的参数。打开小程序时 SDK 会自动初始化,并校验 SDK KEY,SDK SECRET 与BundleID (Application ID) 是否正确。

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

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

相关文章

【嵌入式项目应用】__UART自定义通信协议代码实现方法

目录 前言 一、什么是通信协议 二、简单通信协议的问题 三、通信协议的常见内容 1. 帧头 2. 设备地址/类型 3. 命令/指令 4. 命令类型/功能码 5. 数据长度 6. 数据 7.帧尾 8.校验码 四、通信协议代码实现 1. 消息数据发送 a. 通过串口直接发送每一个字节 b. 通过…

16. 机器学习 - 决策树

Hi,你好。我是茶桁。 在上一节课讲SVM之后,再给大家将一个新的分类模型「决策树」。我们直接开始正题。 决策树 我们从一个例子开始,来看下面这张图: 假设我们的x1 ~ x4是特征,y是最终的决定,打比方说是…

十年JAVA搬砖路——Linux搭建Ldap服务器。

1.安装命令 yum -y install openldap compat-openldap openldap-clients openldap-servers openldap-servers-sql openldap-devel2.启动ldap systemctl start slapd systemctl enable slapd3.修改密码 slappasswd Aa123456获得返回的密码加密密码串: {SSHA}DkSw0…

SQLServer数据库透明加密 安当加密

安当TDE透明加密组件是一种用于数据保护的解决方案,它对数据进行加密,以防止未经授权的访问和数据泄露。 以下是安当TDE透明加密组件的主要功能介绍: 数据保护:安当TDE透明加密组件可以对数据库中的敏感数据进行加密,…

软件无线电处理平台解决方案:330-基于FMC接口的Kintex-7 XC7K325T PCIeX4 3U PXIe接口卡

基于FMC接口的Kintex-7 XC7K325T PCIeX4 3U PXIe接口卡 一、板卡概述 本板卡基于Xilinx公司的FPGAXC7K325T-2FFG900 芯片,pin_to_pin兼容FPGAXC7K410T-2FFG900 ,支持PCIeX8、64bit DDR3容量2GByte,HPC的FMC连接器,北京太速科…

TypeScript之命名空间与模块

一、模块 TypeScript 与ECMAScript 2015 一样,任何包含顶级 import 或者 export 的文件都被当成一个模块 相反地,如果一个文件不带有顶级的import或者export声明,那么它的内容被视为全局可见的 例如我们在在一个 TypeScript 工程下建立一个…

Linux 网络流量监控利器 iftop命令详解及实战

简介 iftop 是什么 在 Linux 系统下即时监控服务器的网络带宽使用情况,有很多工具,比如 iptraf、nethogs 等等,但是推荐使用小巧但功能很强大的 iftop 工具。 iftop 是 Linux 系统一个免费的网卡实时流量监控工具,类似于 top 命令…

智能防雷浪涌保护器的行业应用

智能浪涌保护器是一种能够自动监测和控制电涌保护器(SPD)的工作状态,实现SPD的自我保护和远程管理的设备。智能防雷是一种将云计算、移动互联网和物联网技术引入到综合防雷措施中,实现雷电预警、智能化防雷、智能化监测的系统。这…

群晖 | Synology Directory Server 批量导入用户 文件模板格式

目录 错误写法 正确写法 错误写法 在网上找到过类似的教程,但是一律都以失败告终: 正确写法 其实并不是只要写上前面的属性即可, 就算后面不写也需要使用 tab 补齐 ,所有的属性: 1.名称 2.密码 3.描述 4…

开源问答平台网站源码系统商业运营版源码系统 带完整的搭建教程

在我们现在的日常生活中,人们对于获取信息的需求越来越大,而问答平台作为一种快速、有效的信息获取方式,受到了广泛的关注和使用。同时,随着开源技术的普及和成熟,越来越多的开发者选择使用开源技术进行网站的开发和维…

几种常见的接地类型详解

接地作为一种应用最为广泛的电气安全措施,是指电力系统和电气装置的中性点、电气设备的外露导电部分和装置外导电部分经由导体与大地相连。接地的作用主要是防止人身遭受电击、设备和线路遭受损坏、预防火灾和防止雷击、防止静电损害和保障电力系统正常运行。按其功…

关于 iOS 报Multiple commands produceMultiple 错误的解决方案

今天在运行一个RN老项目的时候,报了一个下面的错误。 对应的信息如下: Multiple commands produce /Users/xzh/RN/work/cgv_app/ios/build/Debug-iphonesimulator/cgv_app.app/Entypo.ttf Multiple commands produce /Users/xzh/RN/work/cgv_app/ios/bu…

EASYX实现多物体运动

eg1:单个物体运动使用easyx实现单个小球的运动 #include <stdio.h> #include <easyx.h> #include <iostream> #include <math.h> #include <stdlib.h> #include <conio.h> #include <time.h> #define PI 3.14 #define NODE_WIDTH 4…

应用在阀门控制中的直流有刷驱动芯片

控制阀又称阀门&#xff0c;是流体运送系统中的控制部件&#xff0c;具有导流、截流、调节、节流、防止倒流、分流或溢流卸压等功能。阀门是一种用于控制流体&#xff08;液体、气体、粉体等&#xff09;流动的装置&#xff0c;广泛应用于工业生产、建筑、农业、能源等领域。 …

提高效率!5个顶级网页开发工具助你事半功倍!

1.WordPress–一站式网站建设工具 价格&#xff1a;基本版终身免费&#xff0c;个人版HK$30&#xff0c;高级版HK$63&#xff0c;商务版HK$1993 推荐指数&#xff1a;★★★★ WordPress是一个使用PHP语言开发的博客平台。它可以在PHP和MySQL数据库的服务器上设置自己的网站&…

从项目开始学习Vue——01

目录标题 一、官方文档二、搭建环境三、停止服务四、使用 webstorm 一键创建项目创建过程可能出现错误 五、启动和访问项目&#xff08;一&#xff09;启动&#xff08;二&#xff09;访问项目六、项目目录讲解 一、官方文档 https://cn.vuejs.org/ 二、搭建环境 参考&#…

新版开源UI千月影视APP源码/后端基于ThinkPHP框架/前后端完美匹配

源码简介&#xff1a; 开源UI千月影视APP源码&#xff0c;它是基于ThinkPHP框架&#xff0c;而且前后端完美匹配。这是一个广泛使用的PHP开发框架&#xff0c;具有稳定性和安全性方面的优势。 2023版本UI千月影视APP是一款提供电影、电视剧、综艺节目等视频内容的应用程序&am…

如何使用ps制作ico图标文件

如何使用ps制作ico图标文件 Chapter1 如何使用ps制作ico图标文件Chapter2 ICOFormat.8bi&#xff08;Photoshop Ico、Cur插件&#xff09;的下载使用1. ICOFormat.8bi的作用2. ICOFormat.8bi使用 Chapter3 ps手机计算机图标教程,手绘设计精美手机APP软件图标的PS教程步骤 01 制…

ArcGIS Pro怎么生成高程点

一般情况下&#xff0c;我们从公开渠道获取到的高程数据都是DEM数据&#xff0c;但是如果要用到CAD等软件内则需要用到高程点&#xff0c;那么如何从DEM提取高程点呢&#xff0c;这里为大家介绍一下生成方法&#xff0c;希望能对你有所帮助。 数据来源 本教程所使用的数据是…

Java中的继承和多态

目录 1. 继承 1.1 为什么需要继承 1.2 继承概念 1.3 继承的语法 1.4 父类成员访问 1.4.1 子类中访问父类的成员变量 1.4.2 子类中访问父类的成员方法 1.5 super关键字 1.6 子类构造方法 1.7 super和this 1.8 再谈初始化 1.9 protected 关键字 1.10 继承方式…