flutter (mac) Dart语法

flutter 官网

网址：https://flutterchina.club/setup-macos/

配置环境变量

• 将flutter下载完成之后, 打开终端命令行 ( 在所下载的文件上一级 )
• 使用vim进行配置环境变量 vim ~/.bash_profile
• 在打开的文件里增加一行代码，意思是配置flutter命令在任何地方都可以使用。
  export PATH=/app/flutter/bin:$PATH ( 注意: 此处的 ‘/app/flutter/bin’ 要添我们下载下来对应flutter里面bin的路径 )
• 配置完成后，需要用source命令重新加载一下 source ~/.bash_profile
• 完成这部以后，就算我们flutter的安装工作完成了，但是这还不能进行开发。可以使用命令来检测一下，是否安装完成了。
  flutter -h

检查开发环境

flutter doctor

Android Studio

下载地址：http://www.android-studio.org/

brew install --HEAD libimobiledevice
brew install ideviceinstaller
brew install ios-deploy
brew install cocoapods
pod setu

安装完 Android SDK后

• 第一步要作的是允许协议（android-licenses）
  flutter doctor --android-licenses
• 完成后，我们再使用flutter doctor进行检测，会看到还是有很多x, 可以进行相应的下载.
• 打开Android Stuido 软件，然后找到Plugin的配置，搜索Flutter插件。

Android studio新建Flutter项目

打开Andorid Studio ，我们选择第二项，新建Flutter项目。
建立完项目后可以去 vscode里面进行编写, 在扩展程序中, 下载flutter

Dart语法

Dart是面向对象的语言，即使是函数也是对象，并且属于Function类型的对象。这意味着函数可以分配给变量或作为参数传递给其他函数。当然你也可以像JavaScript一样，调用一个函数。
( Dart里一切皆对象，包括数字和函数 )

• 创建完成之后, 我们可以如上图写一个小demo
• void main() =>runApp(MyApp()); 因为这个函数体里只有一行代码，所以可以直接使用=>来省略{}，只有函数 体里只有一行时，才可以使用，否则请使用大括号。
• StatefulWidget 和 StatelessWidget
  StatefulWidget ： 具有可变状态的窗口部件，也就是你在使用应用的时候就可以随时变化，比如我们常见的进度条，随着进度不断变化。
  StatelessWidget：不可变状态窗口部件，也就是你在使用时不可以改变，比如固定的文字（写上后就在那里了，死也不会变了）。

import 'package:flutter/material.dart'; // 是Flutter实现Material Design设计风格的基础包,，里面有文本输入框(Text)、图标(Icon)、图片(Image)、行排列布局(Align)、列排列布局(Column)、Decoration、异步、动画等等控件，大家可以理解为网页中的按钮、标题、选项框呀等等控件库吧。

void main()=> runApp(new MyApp()); // main()函数是Dart程序的入口
// 继承（关键字 extends）
class MyApp extends StatelessWidget { // StatelessWidget 无状态类. 当你想展现的内容只需要改动控件本身的配置信息就可以实现的.(例如:文本、图片)
  @override // 继承 StatelessWidget，必须要重写build的方法
  Widget build(BuildContext context) { // 窗口Widget以树形结构组织。 build 方法会携带一个 BuildContext 参数. 可以把Widget想象成一种可视化组件，或者应用中可以与可视化组件进行交互的模块。
    return MaterialApp(  // 返回一个material类的组件对象
      title:'Flutter bottomNavigationBar', // 这个不在窗口中显示
      theme:ThemeData.light(), // ThemeData 是MaterialDesign Widget库的主题数据,Material库的Widget需要遵守相应的涉及规范。 这些涉及规范可自定部分都定义在ThemeData，所以我们可以通过ThemeData来自定义应用主题。 通过Theme.of方法来获取当前的ThemeData. Material Design设计规范中有些是不能自定义的，如导航栏高度，ThemeData只包含了可自定义部分。
      home:BottomNavigationWidget()
    );
  }
}

在vsCode中跑flutter项目

跑项目: flutter run

r 键：点击后热加载，也就算是重新加载吧。(每次修改完代码后, 需要在终端命令行输入 r )
p 键：显示网格，这个可以很好的掌握布局情况，工作中很有用。
o 键：切换android和ios的预览模式。
q 键：退出调试预览模式。

如果嫌以上方法麻烦也可以直接用Debug模式, 实现我们保存，效果立即就会改变, 如下图.

生命周期