前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Flutter Start

Flutter Start

作者头像
spilledyear
修改2018-08-28 13:45:37
1.2K0
修改2018-08-28 13:45:37
举报
文章被收录于专栏:小白鼠

Flutter中文网

获取Flutter SDK

代码语言:javascript
复制
git clone -b beta https://github.com/flutter/flutter.git

设置环境变量

先新增两个环境变量,这个是为了方便国内用户:

image.png FLUTTER_STORAGE_BASE_URL https://storage.flutter-io.cn

image.png PUB_HOSTED_URL https://pub.flutter-io.cn

然后设置Flutter SDK环境变量

image.png 这个对应刚刚clone 下来得路径, 添加到Path环境变量上。

运行 flutter doctor

该命令检查您的环境并在终端窗口中显示报告。Dart SDK已经在捆绑在Flutter里了,没有必要单独安装Dart。 仔细检查命令行输出以获取可能需要安装的其他软件或进一步需要执行的任务。第一次运行一个flutter命令(如flutter doctor)时,它会下载它自己的依赖项并自行编译。以后再运行就会快得多。

image.png

升级 Flutter channel 和 packages

要同时更新Flutter SDK和你的依赖包,在你的应用程序根目录(包含pubspec.yaml文件的目录)中运行flutter upgrade 命令:

代码语言:javascript
复制
flutter upgrade

新建应用

这里使用IDEA作为开发工具。

装插件:flutter、Dart

安装插件的时候需要先安装 Dart,然后再安装 flutter

image.png

image.png

新建flutter应用

File --> New project

image.png

可能需要等较长一段时间。新建好之后,应用大概长这个样子,只有lib文件夹下只有一个 main.dart 文件

image.png

启动应用

能启动应用的前提是你经配置好了Android SDk。这个刚好在我学Ionic的时候配置过了,所以这里可以省了这个过程,不会的同学可以去看看我之前写的文档。 还有一点需要注意的是,需要关闭 Hyper-V。因为我之前安装 Docker-for-window的时候开启了这个选项,所以在用安卓模拟器启动应用的时候失败了。

image.png

这些工作都准备好了之后,就可以启动应用了。如果你想在 模拟器上运行,前提是你已经通过 android avd 工具创建了一个模拟器。

image.png 这就是通过 android avd 创建的模拟器

还是简单介绍一下怎么创建一个 模拟器

代码语言:javascript
复制
android ave

点击Create

image.png 配置参数

image.png 点击确定

image.png

有了模拟器之后就可以启动应用了:

点击这个按钮启动应用

image.png

image.png

就是一个简单的计数程序,可以看到,已经可以成功运行了。

异常

启动报错

Unable to download needed Android SDK components, as the following licenses have not been accepted: Android SDK Platform 27 try to run flutter doctor --android-licenses

image.png 在命令行下执行那条提示的命令

image.png 提示有一个新版本的 Android SDK需要安装

执行以下命令

代码语言:javascript
复制
andorid sdk

弹出了 Andoird SD管理界面

image.png 然后下载 Android8.1 的 package

image.png

下载之后,再执行程序其实可以运行了。但是命令行下执行 flutter doctor --android-licenses 命令,还是提示需要更新Android SDK

image.png 所以,下载package之后已经可以了,下面的操作作用也不大。

按照提示,在命令行以下命令

代码语言:javascript
复制
D:\GreenSoft\Android\tools\bin\sdkmanager --update

image.png

image.png

image.png

image.png 发现更新失败了。不过不影响程序运行,说明这个操作没什么用。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018.05.21 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 获取Flutter SDK
  • 设置环境变量
  • 运行 flutter doctor
  • 升级 Flutter channel 和 packages
  • 新建应用
  • 启动应用
  • 异常
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档