欢迎您光临深圳塔灯网络科技有限公司!
电话图标 余先生:13699882642

网站百科

为您解码网站建设的点点滴滴

Flutter 开发笔记 1

发表日期:2018-04 文章编辑:小灯 浏览次数:1408

最近flutter刚刚发出beta版本,虽然只有0.2.3 但是横向对比了所有的cross-platform方案之后,我发现flutter是目前为止极有可能超越react native 成为最优的cross-platform方案。


今天简单记下流水账, 记录下如何安装及体验hot reload.


1. download flutter_macos_v0.2.3-beta.zip 

2.unzip, cd进目录 并导出全局路径至~/.bash_profile中

如:export PATH=/Users/xxx/Desktop/flutter/bin:$PATH

3.run "flutter doctor" 

这一步相比react native体验要好一些,如果出现哪些依赖没有安装,会在terminal中罗列出来,这样就不用到处去根据错误去google了

4.接下来就是安装XCode 和 Android Studio, 因为flutter 不依赖于android/iOS SDK(只是猜测,因为flutter自带rendering engine,并表示和系统的衔接只有薄薄的一层c/c++代码,所以猜测flutter不依赖native SDK),这里之所以需要安装SDK应该是为了运行simulator/emulator.

5.安装好flutter之后,需要配置IDE.因为之前使用vscode开发react native,所以这里也使用vscode.

vscode install extension 中选择dart code

vscode自带的Command Palette中run"Flutter: Run Flutter Doctor"再次检查依赖是否完整安装

6.之后就是创建工程了

Command Palette --->run "Flutter: New Project"

输入工程名,这里需要注意:工程名必须小写

连接好device或者simulator,可以用"flutter devices" 命令来检查是否有device

然后运行 "Debug>Start Debugging"

下图就是该default demo

在vscode中修改lib/main.dart文件,如theme color 或者text, 保存之后就会看到变化。

这里和react native不同的地方是flutter默认打开了hot reload,感觉更加方便.


本页内容由塔灯网络科技有限公司通过网络收集编辑所得,所有资料仅供用户学习参考,本站不拥有所有权,如您认为本网页中由涉嫌抄袭的内容,请及时与我们联系,并提供相关证据,工作人员会在5工作日内联系您,一经查实,本站立刻删除侵权内容。本文链接:https://www.dengtar.com/18049.html
相关APP开发
    SQL执行错误,请检查