Flutter的开发环境搭建-图解

前言:Flutter作为一个移动应用开发框架,具有许多优点和一些局限性。最大的优点就是-跨平台开发:Flutter可以在iOS和Android等多个平台上进行跨平台开发,使用一套代码编写应用程序,节省开发时间和成本。

Flutter可以编译出以下平台的程序:

1. Android:Flutter可以生成Android应用程序的APK文件,并在Android设备上运行。

2. iOS:Flutter可以生成iOS应用程序的IPA文件,并在iOS设备上运行。

3. Web:Flutter可以通过编译为JavaScript,生成可以在Web浏览器中运行的应用程序。

4.Windows:Flutter可以生成Windows操作系统上的桌面应用程序。

5. macOS:Flutter可以生成macOS操作系统上的桌面应用程序。

6. Linux:Flutter可以生成Linux操作系统上的桌面应用程序。

值得注意的是,虽然Flutter可以编译为不同平台的应用程序,但在每个平台上的体验可能会有所不同,并且可能需要进行一些平台相关的调整和优化。

下面以Android开发为例,

搭建Flutter的开发环境,请遵循以下步骤:

1. 安装Flutter SDK:

首先,你需要下载和安装Flutter SDK。在Flutter官方网站(https://flutter.dev)上,选择与你的操作系统相对应的安装包进行下载。解压下载的文件,并将flutter的bin目录添加到系统的PATH环境变量中,这样在命令行中就可以直接使用flutter命令了。

安装Dart SDK:Flutter使用Dart语言进行开发,因此还需要安装Dart SDK。在Flutter SDK中已经包含了Dart SDK,所以你无需单独安装。

2.命令行中运行    flutter doctor,检查Flutter SDK的安装、配置环境以及依赖项等,并给出相应的建议和提示。

  • [×]表示还不能正常运行

  • [!]表示还存在一些问题

  • 只有全部为[√],系统环境才是完全安装好,你的检查报告才是没毛病的

看看缺少什么配置,需要用什么,就搜索补充什么配置

3. 配置编辑器:

选择一款适合你的编辑器来进行Flutter开发,常用的编辑器有Android Studio、Visual Studio Code(VS Code)和IntelliJ IDEA。安装你选择的编辑器,我选择的是Android Stuido,File>Setting>Plugins中搜索Dart和flutter插件,并安装,这两个插件可以提供代码补全、调试等特性来提升开发效率。

添加工具

4.新建flutter项目

下一步下一步就行,点击运行

在项目目录中,您应用程序的UI代码位于 lib/main.dart。

4. 配置模拟器或真机:

为了在模拟器或真机上运行和调试Flutter应用程序,你需要配置相应的设备。对于Android开发,可以使用Android模拟器或者通过USB连接真机。对于iOS开发,需要使用Xcode来模拟器或连接真机。

编译过程中,有些文件下载不成功,再次点击run,我这边就可以直接运行显示了

6.编译apk

或者命令行,对应目录下输入flutter build apk 编译apk

7.主内容文件lib/main.dart

内容修改保存后,视图即可更新,即快速调试的能力,单凭这点就让我对flutter有很大好感

 

import 'package:flutter/material.dart';void main() {runApp(const MyApp());
}/// 这里我们的MyApp是一个类,继承了StatelessWidget
class MyApp extends StatelessWidget {const MyApp({super.key});/// 这个组件是这个app的根 这是一个无状态部件,然后实现构造方法,@overrideWidget build(BuildContext context) {///构造方法里面通过MaterialApp()函数定义风格,然后是标题、主题和主页面信息,return MaterialApp(title: 'Flutter Demo',theme: ThemeData(///这里有一个Colors.blue,你试一下改成red,或者green。///如果你这时候项目是运行在模拟器 或者真机上的话,你可以修改后Ctrl + S 进行保存。就能同步展示colorScheme: ColorScheme.fromSeed(seedColor: Colors.green),useMaterial3: true,),///  这里主页面home中调用MyHomePage()函数,也就是我们当前页面所显示的内容。home: const MyHomePage(title: 'Flutter Demo Home Page'),);// return MaterialApp(//   title: '天气预报小程序',//   theme: ThemeData(//     primarySwatch: Colors.blue,//   ),//   home: WeatherPage(),// );}
}/// 这里MyHomePage继承StatefulWidget,
/// 这是一个有状态的部件,这里就需要一个状态了,
/// 通过createState()得到一个_MyHomePageState,
/// 这个_MyHomePageState()就是这个页面的主要内容了,它里面是
class MyHomePage extends StatefulWidget {const MyHomePage({super.key, required this.title});final String title;@overrideState<MyHomePage> createState() => _MyHomePageState();
}class _MyHomePageState extends State<MyHomePage> {int _counter = 0;void _incrementCounter() {setState(() {_counter++;});}/// 在 build 方法中,我们通常通过对基础 Widget 进行相应的 UI 配置,或是组合各类基础 Widget 的方式进行 UI 的定制化。@overrideWidget build(BuildContext context) {///这里返回一个Scaffold,这是一个脚手架,用来构建页面return Scaffold(///然后我们看Scaffold中的内容,AppBar 是页面的导航栏,我们直接将 MyHomePage 中的 title 属性作为标题使用。appBar: AppBar(backgroundColor: Theme.of(context).colorScheme.inversePrimary,///这里我们从App.build方法创建的MyHomePage对象中获取值,并使用它来设置appbar的标题。title: Text(widget.title),),///body 则是一个 Text 组件,显示了一个根据 _counter 属性可变的文本:‘You have pushed the button this many times:$_counter’。body: Center(child: Column(mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text('You have pushed the button this many times:',),Text('$_counter',style: Theme.of(context).textTheme.headlineMedium,),],),),///floatingActionButton,则是页面右下角的带“+”的悬浮按钮。我们将 _incrementCounter 作为其点击处理函数。floatingActionButton: FloatingActionButton(onPressed: _incrementCounter,tooltip: 'Increment',child: const Icon(Icons.add),),);}
}

参考:

https://www.cnblogs.com/libo-web/p/16060590.html

Android Flutter开发环境搭建_大耳猫的博客-CSDN博客

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

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

相关文章

JVM运行时数据区——方法区、堆、栈的关系

方法区存储加载的字节码文件内的相关信息和运行时常量池&#xff0c;方法区可以看作是独立于Java堆的内存空间&#xff0c;方法区是在JVM启动时创建的&#xff0c;其内存的大小可以调整&#xff0c;是线程共享的&#xff0c;并且也会出现内存溢出的情况&#xff0c;也可存在垃圾…

2023JAVA 架构师面试 130 题含答案:JVM+spring+ 分布式 + 并发编程》...

此文包含 Java 面试的各个方面&#xff0c;史上最全&#xff0c;苦心整理最全 Java 面试题目整理包括基JVM算法数据库优化算法数据结构分布式并发编程缓存等&#xff0c;使用层面广&#xff0c;知识量大&#xff0c;涉及你的知识盲点。要想在面试者中出类拔萃就要比人付出更多的…

3.18 Bootstrap 列表组(List Group)

文章目录 Bootstrap 列表组&#xff08;List Group&#xff09;向列表组添加徽章向列表组添加链接向列表组添加自定义内容 Bootstrap 列表组&#xff08;List Group&#xff09; 本章我们将讲解列表组。列表组件用于以列表形式呈现复杂的和自定义的内容。创建一个基本的列表组的…

Debug Stable Diffusion webui

文章目录 SD前期预备一些惊喜TorchHijackForUnet Txt2Img 搭配 Lora 使用单独运行 txt2img.py获取所有资源代码地址参数sd model 主程序代码地址参数(同上)模型InferenceLORA应用重构并使用LORA模型用Lora重构后的网络 做 sampler后处理 以下内容是最近的学习笔记&#xff0c;如…

MySQL基础语法(DDL、DQL、DML、DCL)

目录 SQL通用语法以及分类 SQL通用语法 SQL语句的分类 数据库/表/列的命名规则 DDL语句 DDL设计的数据类型 数据库操作 表操作&#xff08;必须先进入到数据库&#xff09; DQL语句 DQL的执行顺序 基本查询 SELECT 条件查询 WHERE 分组查询 GROUP BY 排序查询 OR…

Python Flask构建微信小程序订餐系统 (十)

🔥 编辑会员信息 🔥 编辑会员信息可以通过点击会员列表操作,也可以点击会员信息详情点击进行操作 🔥 修改编程会员信息列表布局 🔥 修改 web/templates/member/index.html 文件,添加跳转到编辑会员信息的页面 web/templates/member/set.html 🔥 创建用于会员…

python机器学习(四)线性代数回顾、多元线性回归、多项式回归、标准方程法求解、线性回归案例

回顾线性代数 矩阵 矩阵可以理解为二维数组的另一种表现形式。A矩阵为三行两列的矩阵&#xff0c;B矩阵为两行三列的矩阵&#xff0c;可以通过下标来获取矩阵的元素&#xff0c;下标默认都是从0开始的。 A i j : A_{ij}: Aij​:表示第 i i i行&#xff0c;第 j j j列的元素。…

在虚拟机中安装anaconda和pytorch

首先我用的是VMware&#xff0c;ubuntu16.04. 首先建议安装anaconda,登录官网Free Download | Anaconda 下载完成后&#xff0c;来到安装文件目录处&#xff0c;打开终端&#xff0c; 然后在终端输入bash <anaconda文件名> 然后就一直enter和yes到底&#xff0c;直到安…

服务器中了Locked勒索病毒怎么解决,勒索病毒解密恢复方式与防护措施

服务器是企业重要数据存储和处理的关键设备&#xff0c;然而&#xff0c;众所周知&#xff0c;服务器系统并非完全免受网络攻击的。其中一种常见的威胁是勒索病毒&#xff0c;其中一种恶名昭彰的变种是Locked勒索病毒。Locked勒索病毒采用了对称AES与非对称RSA的加密形式&#…

曲线长度预测神经网络设计与实现

在本文中&#xff0c;我们使用深度神经网络 (DNN) 解决几何中的一个基本问题&#xff1a;曲线长度的计算。 我们从监督学习方法的示例中学习了几何属性。 由于最简单的几何对象是曲线&#xff0c;因此我们重点学习平面曲线的长度。 为此&#xff0c;重建了基本长度公理并建立了…

Microsoft发布用于 AutoML 算法和训练的 NNI v1.3

将传统的机器学习方法应用于现实世界的问题可能非常耗时。自动化机器学习 &#xff08;AutoML&#xff09; 旨在改变这种状况——通过对原始数据运行系统流程并选择从数据中提取最相关信息的模型&#xff0c;使构建和使用 ML 模型变得更加容易。 为了帮助用户以高效和自动的方…

【雕爷学编程】Arduino动手做(170)---LGT8F328P 开发板

37款传感器与模块的提法&#xff0c;在网络上广泛流传&#xff0c;其实Arduino能够兼容的传感器模块肯定是不止37种的。鉴于本人手头积累了一些传感器和执行器模块&#xff0c;依照实践出真知&#xff08;一定要动手做&#xff09;的理念&#xff0c;以学习和交流为目的&#x…

【C++ 程序设计】第 1~9 章:常见知识点汇总

目录 一、C 语言简介 二、面向对象的基本概念 三、类和对象进阶 四、运算符重载 五、类的继承与派生 六、多态与虚函数 七、输入/输出流 八、文件操作 九、函数模板与类模板 一、C 语言简介 知识点名称内容C语言的发展简史★★1. C 语言是 C 语言的前身 &…

PyTorch深度学习实战(6)——神经网络性能优化技术

PyTorch深度学习实战&#xff08;6&#xff09;——神经网络性能优化技术 0. 前言1. 数据准备1.1 数据集分析1.2 数据集加载 2. 使用 PyTorch 训练神经网络2.1 神经网络训练流程2.2 PyTorch 神经网络训练 3. 缩放数据集4. 修改优化器5. 构建深层神经网络小结系列链接 0. 前言 …

C#之事件

目录 一、发布者和订阅者 &#xff08;一&#xff09;概述 &#xff08;二&#xff09;有关事件的重要事项 &#xff08;三&#xff09;有关事件的私有委托需要了解的重要事项 二、源代码组件概览 三、声明事件 事件是成员 四、订阅事件 五、触发事件 六、标准事件的…

【Zerotier】通过docker自建PLANET服务器

在如今全球互联的时代&#xff0c;我们对于互联网的依赖程度越来越高。然而&#xff0c;传统的网络连接方式在某些情况下可能会受到一些限制&#xff0c;例如局域网的范围限制、防火墙的阻断或者设备所处的多层NAT等。但是&#xff0c;现在有一个名为ZeroTier的工具出现了&…

【C语言进阶】文件操作

&#x1f525;博客主页&#xff1a;小王又困了 &#x1f4da;系列专栏&#xff1a;C语言 &#x1f31f;人之为学&#xff0c;不日近则日退 ❤️感谢大家点赞&#x1f44d;收藏⭐评论✍️ 目录 一、什么是文件 1.1程序文件 1.2数据文件 1.3文件名 二、文件的打开和关闭 2…

银河麒麟服务器v10 sp1 nginx 部署项目

上一篇&#xff1a;银河麒麟服务器v10 sp1 nginx开机自动启动_csdn_aspnet的博客-CSDN博客 由于项目为前后端分离&#xff0c;前端项目使用nginx部署&#xff0c;VUE项目打包后上传至银河麒麟服务器&#xff1a; 8063 为前端项目文件目录&#xff0c;修改配置 &#xff0c;默认…

脑电信号处理与特征提取——三. 脑电实验设计的原理与实例(古若雷)

三、脑电实验设计的原理与实例 被试间设计的实验结果也有可能是人员不同造成的&#xff0c;所以建议被试内设计。

双端队列(deque)与优先队列(priority_queue)

文章目录 一.双端队列——deque1.deque的优点与缺点2.deque的原理 二.优先队列——priority_queue1.什么是优先队列&#xff1f;2.优先队列的基本使用3.什么是仿函数&#xff1f;4.优先队列的模拟实现 一.双端队列——deque 在上一章stack、queue的模拟实现中&#xff0c;我们…