flutter的小白之路

    马克思马大大告诉我们:对一切事物都要用辩证的思维去看。那么在初次接触flutter的时候我们就要有疑问,flutter是什么,为什么要去学习flutter?

    通过学习了Wm Leler大佬的《为什么说flutter是革命性的》,恍然大悟。我们都知道,在移动开发的早期,我们如果想开发一款app,那么我们至少要开发两个版本(Android、ios)。这是因为开发ios系统时我们使用的是ios sdks,开发Android时使用谷歌提出的Android sdks,这两种软件开发工具的又是基于不同的编程语言objective-c和java。

正如上图所示,通过这些sdk我们可以与系统直接通信,以创建 UI 组件或访问系统相机,组件被渲染好之后用canvas的方式再渲染到手机屏幕上去,而相应的事件则被传回给组件。虽然思想很简单,但是因为sdk底层语言的不同和设备系统的不同,我们不得不为每一个平台开发一个版本。

      俗话说的好:只要思想不滑坡,办法总比困难多。于是第一个跨平台开发的框架出现了,它是基于 JavaScript 和 WebView建立的,例如 Titanium一系列相关的框架:PhoneGap, Apache Cordova, Ionic 等,在苹果发布 iOS 之前,他们鼓励第三方开发者为 iPhone 构建网页应用程序,因此使用 Web 技术构建跨平台应用程序是顺理成章的一步。

        但是由于js代码无法与设备上的一些服务进行通信,例如设备的文件系统和相机,所以这个时候会通过一个在 JavaScript 代码和原生代码的“桥梁”进行通信,因为平台服务通常不会经常被调用,所以这并不会导致太大的性能问题。

    后来由于react native的出现,响应式编程模式更加简化了web试图的创建过程,使得移动开发更加便利。


        但是这样的框架还是要通过桥接器来与系统进行通信,但是当界面上的 UI 控件通常被频繁地访问(在动画、转化或者用户用手指“滑动”屏幕上的某些东西时,每秒被访问高达 60 次),就会出现性能问题。

        所以,当当当~主角登场!!!

        大家好,我是flutter,是一个不仅提供响应式视图而且不需要js桥接器的移动sdk,没有之一。

        flutter和react native一样,也提供响应式的试图,但是flutter则采用了名为dart的程序语言来编译,以此来避免由js桥接器引起的性能问题。dart是用预编译的方式编译多个平台的原生代码,这就允许flutter直接和凭条进行通信,不需要再通过桥接器,而且这样的话也可以加快应用程序的启动速度,使得用户体验更好。那么,flutter是如何实现ui组件的呢?

    和之前的sdk进行对比,没有了桥接器,平台上也没有了组件。这也是flutter最大的特点,自带组件,Flutter 将 UI 组件和渲染器从平台移动到应用程序中,这使得它们可以自定义和可扩展,这也就代表了我们可以用flutter做出更加炫酷的ui界面。Flutter 唯一要求系统提供的是 canvas,以便定制的 UI 组件可以出现在设备的屏幕上,以及访问事件(触摸,定时器等)和服务(位置、相机等)。dart 程序(绿色)和执行数据编码和解码的原生平台代码(蓝色,适用于 iOS 或 Android)之间仍然有一个接口,但这能比 JavaScript 桥接器快几个数量级。

    flutterli另一大改进就是他的布局,和传统布局不同,每个 UI 组件都将指定自己简单的布局模型,而不是拥有可以应用于任何 UI 组件的一整套布局规则。因为每个 UI 组件都有一个更小的一套布局需要考虑,所以布局可以大量优化。为了进一步简化布局,我们几乎将所有内容都转换为 UI 组件。而dart语言还有一个“tree shaking ”编译器,它只包含你在应用程序中需要的代码。 即使您只需要一个或两个,您也可以随意使用大型的 UI 控件库。其次因为所有组件都是包含在app当中的,这也使得flutter有着非常好的兼容性。所以这使得我们的移动开发更加便捷。

    热重载,这是flutter最受欢迎的功能,我们可以在 Flutter 应用程序运行时对其进行更改,重新加载应用程序的代码,将其从之前的操作位置继续下去。一次热重载通常用不到一秒钟。 如果您的应用遇到错误,您通常可以修复错误,然后继续,就像错误从未发生过。 即使你必须完全重新加载,它也是很快速的。

  所以,综上所述,我们迷人的flutter具有以下优点:

        响应式视图的优点,不需要 JavaScript 的桥接器

        快速,流畅,可预测 ; 代码将 AOT 编译为本机(ARM)代码

        开发人员完全控制 UI 组件和布局

        配有美观,可定制的 UI 组件

        强大的开发者工具,惊人的热重新加载

        性能更好,兼容性更好,开发起来更有乐趣

    认识完了flutter,相信你已经爱上了它,那么怎么用他去开发呢?

    打开度娘,搜索(https://flutter.io/docs/get-started/install),下载好必备的程序之后,就开始配置我们的开发环境,这里就直接甩链接了(https://cloud.tencent.com/developer/article/1196935 &&https://blog.csdn.net/luuuuuu_abc/article/details/79851621&&https://www.cnblogs.com/springxie/p/4742100.html),照着步骤一步步执行,就可以搭建我们的flutter小项目啦!!

    在配置好环境以后,最后我们还要去认识一下flutter的项目目录结构:

       1> android目录:这里存放的是Flutter与android原生交互的一些代码,这个路径的文件和创建单独的Android项目的基本一样的。不过里面的代码配置跟单独创建Android项目有些不一样。

        2> ios目录:这里存放的是Flutter与ios原生交互的一些代码。

        3> lib目录:这里存放的是Dart语言编写的代码,这里是核心代码。不管是Android平台,还是ios平台,安装配置好环境,可以把dart代码运行到对应的设备或模拟器上面。刚才的示例中,就是运行的lib目录下的main.dart这个文件。我们可以在这个lib目录下面创建不同的文件夹,里面存放不同的文件,使用Dart语言写我们的自己的代码。

        4> .gitignore 就是git软件要忽略的文件列表,如果要忽略某些文件,把要忽略的文件名填进去,Git就会自动忽略这些文件。

        5> .metadata 配置信息,如果是web工程的话,里面描述是工程名,访问路径等信息

        6> .packages 是

        7> .iml 项目的配置文件

        8> .lock  安装文件锁定,防止别人和自己误操作

        9> pubspec.yaml文件:这个是配置依赖项的文件,比如配置远程pub仓库的依赖库,或者指定本地资源(图片、字体、音频、视频等)。

        10> .md 包括一个目标机器支持的每个指令的指令模式的开发文件,被 GNU 编译程序集(GCC)引用,通常用于Unix系统中的编译程序

          谢谢!!

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,009评论 5 474
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,808评论 2 378
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 148,891评论 0 335
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,283评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,285评论 5 363
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,409评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,809评论 3 393
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,487评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,680评论 1 295
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,499评论 2 318
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,548评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,268评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,815评论 3 304
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,872评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,102评论 1 258
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,683评论 2 348
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,253评论 2 341

推荐阅读更多精彩内容