フラッターはとても熱いです、なぜそれについて知らないのですか？（上長）

フラッターはとても熱いです、なぜそれについて知らないのですか？（上長）

Flutter は、真のクロスプラットフォームで iOS と Android の両方で実行できる高品質のネイティブ インターフェイスを作成するための Google モバイル UI フレームワークです。Flutter は無料のオープンソースであり、世界中の開発者や組織が使用できます。

Flutter にはいくつかの機能があります。

1. ミリ秒レベルのホットロードを迅速に開発し、変更をアプリに迅速に適用します。完全にカスタマイズ可能なコンポーネントの豊富なセットを使用して、ネイティブ インターフェイスを数分で構築します。

2. 表現力が高く柔軟な UI 機能をネイティブのエンド ユーザー エクスペリエンスに迅速に統合します。階層構造によりUIを完全にカスタマイズでき、高速な描画と柔軟なデザインが完成します。

3. ネイティブ パフォーマンス Flutter コンポーネントには、スクロール、ナビゲーション、アイコン、フォントなど、すべてのプラットフォームにわたる重要な違いが含まれています。これにより、Flutter は、iOS および Android で使用するときに完全なネイティブ パフォーマンス エクスペリエンスを得ることができます。

急速な発展

Flutter ホット リロード テクノロジは、実験、UI の構築、機能の追加、バグの迅速な修正を迅速かつ簡単に行うのに役立ちます。1 秒未満のリロード体験を体験してください。

美しいUI

Flutter には MD デザイン スタイルと iOS コンポーネントが組み込まれており、豊富なジェスチャ API が備わっており、スムーズなスクロール エクスペリエンスとプラットフォームのアイデンティティがユーザーを満足させます。

最新のレスポンシブ フレームワーク (最新のリアクティブ フレームワーク)

Flutter レスポンシブ フレームワークと豊富なプラットフォーム、レイアウト、機能コンポーネントを利用することで、UI の構築が非常にシンプルになります。柔軟で強力な API (2D、アニメーション、ジェスチャー、パフォーマンスなど) を使用して、UI 上のさまざまな問題を解決します。

  int counter = 0;
​
  void increment() {
    // Tells the Flutter framework that state has changed,
    // so the framework can run build() and update the display.
    setState(() {
      counter++;
    });
  }
​
  Widget build(BuildContext context) {
    // This method is rerun every time setState is called.
    // The Flutter framework has been optimized to make rerunning
    // build methods fast, so that you can just rebuild anything that
    // needs updating rather than having to individually change
    // instances of widgets.
    return new Row(
      children: <Widget>[
        new RaisedButton(
          onPressed: increment,
          child: new Text('Increment'),
        ),
        new Text('Count: $counter'),
      ],
    );
  }
}

ネイティブ機能とSDKの使用

アプリの開発にはプラットフォーム API、サードパーティ SDK、ネイティブ コードを使用します。Flutter を使用すると、Java、Swift、Objective-C コードを引き続き使用し、iOS および Android のネイティブ機能を使用できます。

プラットフォームの機能へのアクセスは簡単です。次のコード スニペットが始まります。

    var batteryLevel = 'unknown';
    try {
        int result = await methodChannel.invokeMethod('getBatteryLevel');
        batteryLevel = 'Battery level: $result%';
      } on PlatformException {
        batteryLevel = 'Failed to get battery level.';
      }
      setState(() {
        _batteryLevel = batteryLevel;
      });
}

パッケージの使用方法、プラットフォーム チャネルの作成方法、ネイティブ コード、API、SDK の使用方法を学びます。

統一開発標準

Flutter拥有工具及库帮助你简单快速地在iOS和Android上实现你的想法。若你还没有任何移动开发经验，那么Flutter将会是你构建漂亮的移动APP的一种简单快速的额方式。若你是有经验的iOS或者Android开发人员，那么你可以使用Flutter组件，并且继续使用已有的Java/Objective-C/Swift程序。

构建 漂亮的APP UI 丰富的2D GPU加速APIs 响应式框架 动画/动作 APIs 兼容Android Material组件及苹果组件样式

流程的编码体验 急速热加载技术 IntelliJ：重构，自动补足功能等 Dart语言及核心库 包管理

拥有App所有特性 与移动OS APIs&SDKs互操作性 Maven/Java Cocoapods/ObjC/Swift

优化 测试 Unit测试 继承测试 无设备测试

Debug IDE debug 基于网络debug 异步/唤醒感知 表达式求值程序

配置 时间线 CPU和内存 应用性能图标

部署 编译 Native ARM程序 消除无效代码

发布 App市场 Play Store

标题安装Flutter

在国内安装Flutter需要首先需要一个值得信任的国内镜像。在镜像上边保存着Flutter需要的依赖及相关库，包等。为了使用Flutter，需要使用一个备用存储位置，我们需要配置环境变量。 配置环境变量名： PUB_HOSTED_URL 和 FLUTTER_STORAGE_BASE_URL。

在windows系统中，需要在环境变量设置中添加：

PUB_HOSTED_URL ： pub.flutter-io.cn FLUTTER_STORAGE_BASE_URL ： storage.flutter-io.cn

然后运行Git命令（前提是安装了GitBash工具）：

git clone -b dev https://github.com/flutter/flutter.git Flutter

Flutter文件夹需要注意：文件夹存放的路径上不要出现空格，否则在IDE中进行工程创建后会有警告，SDK环境路径上存在分隔符。

在clone完成之后，即Flutter Sdk下载完毕，还需要配置Flutter环境： xxxx/Flutter/bin目录下。

重新打开一个命令行，在其中输入命令

flutter doctor

进行环境及缺失的依赖检查，并下载需要的依赖。 运行效果如下图：

在环境及相关依赖检查完成之后，可以开始在Android Studio中进行创建工程行为。

注意：Android Studio 预览版中无法保证运行Flutter成功。因此需要使用稳定版AS，且需要3.0版本以上。

Android Studio中需要安装Flutter Plugin，Dart Plugin两个插件。

Dart SDK也需要手动安装，直接下载zip包免安装。

成功准备好IDE环境之后，就可以创建Flutter Project了，默认创建Flutter Application就可以了，按照IDE创建提示一直到最终完成。

需要注意：同样由于网络环境，直接运行Flutter Project是不可行的，UI会一直停留在Gradle正在初始化工程。这时需要修改build.gradle配置中的中央Maven库到一个可信赖的公共Maven库。 这里我修改成Ali的Maven库

buildscript {
    ext.kotlin_version = '1.1.51'
    repositories {
        maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' }
        google()
    }
    // ......
}
​
// ......
​
allprojects {
    repositories {
        maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' }
    }
    google()
}
// ......

然后再次sync工程，进行运行。

首个创建的Flutter Project工程结构如下：

文章分享自：