Flutter介绍

这篇文章是简单的介绍一下Flutter和他的安装，并通道官方Demo。
推荐的学习网址 Flutter中文网

介绍

Flutter是谷歌的移动UI框架，可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界，Flutter正在被越来越多的开发者和组织使用，并且Flutter是完全免费、开源的。

优点

• 跨平台移动UI框架
• Flutter可以与现有的代码一起工作
• Flutter是完全免费、开源
• 热重载
• 响应式框架
• 内置Material Design和Cupertino（iOS风格）
  ··

Dart语言

Dart 是一个为全平台构建快速应用的客户端优化的编程语言。（官网介绍）

优点

• 开源
• 高级语言，安全类型（kotlin），面向对象（java）
• 在全平台极速运行（可编译为移动端、桌面端及后端的 ARM & x64 的二进制文件，或是为 Web 平台编译 Javascript）
• 热重载（ 反复地修改: 在正在运行的应用中使用热重载立刻看到您的修改）
• 为 UI 构建（优化使用针对用户界面的创造进行优化的语言进行开发）

Flutter安装

快速安装

推荐看flutter中文网，一步一步来 https://flutterchina.club/get-started/install/

SDK下载慢

SDK可能下载比较困难，附下载链接

windows版
百度网盘
链接：https://pan.baidu.com/s/1D6nnLzriJINT6Ieyf51ZJg
提取码：jvo1
复制这段内容后打开百度网盘手机App，操作更方便哦
使用免费的60s下载

检查是否成功

运行 flutter doctor 在命令行查看是否有问题

配置AndroidStudio

在Settings 中找到plugins，搜索flutter插件。
一般他会提示安装dart，同意就行。安装完后重新启动。

第一个Flutter工程

创建Flutter工程

在AndroidStudio 选择Create New Flutter Project

选择FlutterApplication

选择之前配置的flutterSdk的目录

net—> net —> finish

跑通Demo

第一次安装可能会很慢，因为要下载gradle。
一般大家都会卡在这里
Running Gradle task ‘assembleDebug’…
修改Android目录下得gradle的插件版本和google库jcenter的阿里镜像地址（因为国内访问太慢）

要修改的地方为三处

按照红线一次替换

  maven { url 'https://maven.aliyun.com/repository/public' }
  maven { url 'https://maven.aliyun.com/repository/google' }
  maven { url 'https://maven.aliyun.com/repository/gradle-plugin' }
  
  classpath 'com.android.tools.build:gradle:4.1.0'
  
  maven { url 'https://maven.aliyun.com/repository/public' }
  maven { url 'https://maven.aliyun.com/repository/google' }
  maven { url 'https://maven.aliyun.com/repository/gradle-plugin' }

修改gradle版本

distributionUrl=https\://services.gradle.org/distributions/gradle-6.5-all.zip

当然你可以不使用我的gradle版本，附google的gradle和插件版本的对比链接
https://developer.android.google.cn/studio/releases/gradle-plugin.html#updating-gradle
修改flutter的gradle中的google库jcenter的阿里镜像地址

就在文件头部

替换为

maven { url 'https://maven.aliyun.com/repository/public' }
maven { url 'https://maven.aliyun.com/repository/google' }
maven { url 'https://maven.aliyun.com/repository/gradle-plugin' }

然后运行到手机查看效果吧。当安装到手机上时就完成了安装。

Fluuter工程结构

https://blog.csdn.net/u013491829/article/details/108624331