美文网首页
flutter 创建应用

flutter 创建应用

作者: cheng1314 | 来源:发表于2020-09-01 09:23 被阅读0次

    一、创建新应用

    1、创建新应用

    flutter create xxx (xxx为应用名称)

    2、运行应用

    flutter run

    3、查看flutter连接设备

    flutter devices

    4、推荐使用Androidstudio运行flutter项目

    Android Studio打开项目的之后,通过(Preferences>Plugins on macOS, File>Settings>Plugins on Windows & Linux).安装Flutter和Dart两个插件即可运行flutter项目在iOS和安卓设备上.

    二、环境、工具、版本问题

    1.flutter有stable、beta、dev、master版本,选择stable版本
    2.flutter doctor 可插件项目问题;
    3.工具:xcode、Androidstudio、VPN镜像

    三、程序入口

    JavaScript没有预定的入口函数、但是在Dart中,每个app必须有一个顶级的main()函数作为应用程序的入口

    //Dart
    main() {
    }
    

    变量

    Dart的类型是安全的 - 它使用静态类型检查和运行时的组合,检查确保类型始终与变量的静态值匹配类型,尽管某些类型是必选的,但某些类型注释是可选的,因为Dart会执行类型推断。

    创建分配变量

    在JavaScript中无法定义变量类型;在Dart中变量必须是系统能够解析的类型;

    //JavaScript 
    var name = "xiaoming";
    //Dart
    String name = "xiaoming";//定义一个确定类型的变量
    var name = "xiaoming";//定义一个可以推断的变量
    //以上两种类型在Dart都可以使用
    

    默认值

    在JavaScript中,未初始化的变量值为undefined;在Dart中未初始化的变量值为null

    • [注意 ]在 Dart中数字也被定义成对象,所以只要是定义成数字类型未初始化的变量都为null
    //JavaScript 
    var age;// undefined 
    //Dart
    var age;
    int age;
    //以上二者都为null
    

    检查null或零

    • 在JavaScript中,1或任何非null的对象都被视为true
    //JavaScript 
    var myNull = null;
    if (!myNull) {
        console.log('true');
    }
    var zero = 0;
    if (!zero) {
        console.log('true');
    }
    
    • 在Dart中只有布尔值为true被视为true
    //Dart 
    var myNull = null;
    if (myNull == null) {
        print('true');
    }
    var zero = 0;
    if (zero == 0) {
        print('true');
    }
    
    • 从Dart1.2开始,null-aware运算符可以帮助我们做null检查
      bool isConnected(a,b) {
        bool outCon = outgoing[a]?.contains[b] ?? false;
        bool inCom =  incoming[b] ?.contains[a] ?? false;
      }
    

    ?.运算符在左边为null的情况阻断右边调用,??运算符作用是在左侧为null的时候为其设置默认值;

      print(null ?? false);  //false
      print(false ?? 11);//false
      print(true ?? false);//true
    
    • 获取一个数据中的数组长度可以这样做
    int length = model?.data?.length ?? 0;
    

    FUCTIONS

    //JavaScript 
    function fn() {
        return true;
    }
    //Dart
    fn() {
        return true;
    }
    bool fn() {
        return true;
    }
    

    异步编程

    与JavaScript一样,Dart支持单线程执行。在JavaScript中Promise表示最终的执行完成或失败,在Dart中使用Future来表示异步操作;

    import 'dart:convert';
    import 'dart:html';
    
    void main() {
      _getIPAddress() {
        final url = "https://httpbin.org/ip";
        HttpRequest.request(url).then((value) => {
          print(json.decode(value.responseText)['origin'])
        }).catchError((error) => print(error));
      }
      _getIPAddress();
    }
    
    

    async 和 await

    在Dart中async函数返回一个Future,函数主体是稍后执行。await运算符用于等待Future:

    import 'dart:convert';
    import 'dart:html';
    
    void main() {
      _getIPAddress() async{
        final url = "https://httpbin.org/ip";
        var request = await HttpRequest.request(url);
        String ip = json.decode(request.responseText)['origin'];
        print(ip);
      }
      _getIPAddress().then((value) => {
          print('获取ip结束')
        }).catchError((error) => print(error));
    }
    

    相关文章

      网友评论

          本文标题:flutter 创建应用

          本文链接:https://www.haomeiwen.com/subject/uahrsktx.html