小白误入Flutter引发的血案

琢磨着做个安卓游戏自己玩玩,一开始准备看传统的Android教程,毕竟Java出身,偶然看见flutter开发app可以多平台使用,不需要改代码,按捺不住,就准备搭建个环境试试,结果惨不忍睹。

搭建Flutter环境

下载了 flutter_windows_1.17.1-stable.zip,Android studio3.6(并且下载插件flutter)

解压后path添加环境变量
一个小提示:我以前设置环境变量都要找到"此电脑",然后右键"属性",再点击"高级系统设置",为此我被迫将"此电脑"放到了桌面。
其实有一个快捷方法,就是按下"start"键,也就是键盘上windows图标的那个键,输入"env"即可。

E:\flutter\bin

然后就执行了

 flutter doctor

小白误入Flutter引发的血案_第1张图片
这第一个叉叉很明显了,说不能定位到Android SDK,很温馨地提示你设置环境变量ANDROID_SDK_ROOT,那就去设置吧。
小白误入Flutter引发的血案_第2张图片

这下可以了吧。再执行一下

flutter doctor 

小白误入Flutter引发的血案_第3张图片

还有一个错误,Android license status unknown。许可证什么东东,错误提示有时候不一样,反正可以执行下面这个命令

flutter doctor --android-licenses

残酷的事实又一次击败了我
小白误入Flutter引发的血案_第4张图片
这简直就是错误连连看啊,一番百度之后,哦豁,原来是jdk的问题,我的是jdk11,图中的这个类在jdk11已经被删掉了,身为一名Java程序员,电脑怎么可能只有一个版本的jdk,麻溜地换上了jdk8,总算问题解决了。

至于No devices available,只是因为没有启动AVD(Android Virtual Device),你可以使用Android studio自带的AVD,也可以使用Genymotion,我用的就是后者。

到此我就该打开我的android studio一显身手了,打开studio,多了一个选项
小白误入Flutter引发的血案_第5张图片
按下它,
小白误入Flutter引发的血案_第6张图片
next
小白误入Flutter引发的血案_第7张图片
目录到flutter即可,不需要到bin目录,next然后finish。

小白误入Flutter引发的血案_第8张图片

Creating Flutter Project这里我也卡住了,一开始我以为是网速慢,直到我打了三局王者,我明白了,不是网速慢,是压根没连上。怎么办呢,我又进不去。
看看这个目录,里面还是有一些文件的。
在这里插入图片描述
打开任务管理器,强制关闭该任务,重新打开studio,选择
在这里插入图片描述
这样子你就可以进来了,此时你的Android项目是不完整的,少了很多东西。
很明显是因为某个众所周知的原因导致我们连不上,不要慌,flutter为了照顾我们国内的开发者,给我们开了个小门。

Using Flutter in China

里面讲解了中国开发者无法连接的问题。

里面提供了几个链接。

flutter中文开发文档
flutter-1.17.1下载链接
以及环境变量的配置

方法一
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
git clone -b dev https://github.com/flutter/flutter.git
export PATH="$PWD/flutter/bin:$PATH"
cd ./flutter
flutter doctor


方法二 上海交通大学的镜像站
FLUTTER_STORAGE_BASE_URL: https://mirrors.sjtug.sjtu.edu.cn/
PUB_HOSTED_URL: https://dart-pub.mirrors.sjtug.sjtu.edu.cn/

当然咯,我们是Windows用户,配置就下面这样
小白误入Flutter引发的血案_第9张图片
小白误入Flutter引发的血案_第10张图片

这样都好了之后,就把原来的项目删了,重建吧,因为之前的项目不完整嘛。

成功打开了第一个项目,就该运行下第一个demo了。

小白误入Flutter引发的血案_第11张图片
记得打开你们的avd,没安装的可以点这个位置安装,avd就是虚拟设备,sdk就是平时说的安卓系统,安卓10还是安卓8,你自己选。
小白误入Flutter引发的血案_第12张图片
点击运行,开心吧,你想得美,你的项目build不起来,纳尼?

具体信息我就不截图了,毕竟我已经下好了,前面的截图都是为了给人看,特地把数据改回去再截图的,,,总之呢,就是右下角有个什么Running ‘gradle assembleDebug之类的一直转啊转啊,就是成功不了,原因也一样,要连接google才行。。。

那就继续改配置,改镜像呗。

小白误入Flutter引发的血案_第13张图片
找到build.gradle,将上图标红的两个地方注释掉,删掉也行,替换成下面的

maven { url 'https://plugins.gradle.org/m2/' }
maven { url 'http://maven.aliyun.com/nexus/content/repositories/google' }
maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' }
maven { url 'http://maven.aliyun.com/nexus/content/repositories/jcenter'}

将下面的这个文件中也改掉,改的地方和上面一样。
小白误入Flutter引发的血案_第14张图片
到了这里基本上搭建就完成了。。。。

最后还有一个就是json转实体类

android flutter项目中有个pubspec.yaml,类似于maven的pom.xml,需要引入什么就配置什么

小白误入Flutter引发的血案_第15张图片

如图引入了四个dart,点击pub get后就会下载,前面的^表示大版本一直,中、小版本会选择更新的,但不会低于你写的中、小版本。

小白误入Flutter引发的血案_第16张图片这个json_to_model就是将你的jsons(一定要是这个名字jsons)下的json都生成实体类。
jsons目录和lib目录同级,在项目的根目录下执行命令

flutter pub run json_to_model

小白误入Flutter引发的血案_第17张图片
这样就可以在你的dart里引用生成的model了,如果idea一直报import错误的时候,明明包路径正确,包也存在,就是报错,可以尝试改成相对路径

小白误入Flutter引发的血案_第18张图片

over!!!

你可能感兴趣的:(flutter)