Flutter01-学习准备

1. 简介：

Flutter是谷歌的移动UI框架，可以快速在iOS和Android上构建高质量的原生用户界面。

Flutter可以与现有的代码一起工作。在全世界，Flutter正在被越来越多的开发者和组织使用，并且Flutter是完全免费、开源的。

1）至少支持Linux、Android、IOS 甚至window平台，具有良好的跨平台性。

2) 原生用户界面，不是网页

3) 完全开源免费

 

2. 与其他框架的比较

1）Cordova:Cordova还是基于网页技术进行包装，利用插件的形式开发移动应用的，就这一点。无论是性能还是体验，Flutter都更好

2) React Native 渲染机制不如flutter，容易造成频繁的渲染

3) flutter采用GPU渲染，性能极高，可达128fps(每秒传输帧数)

 

3.安装与环境搭建

1) 首先安装java

2) 安装flutter sdk，注意flutter执行必须联网。配置环境变量使得flutter能在全局环境下运行

3) 使用flutter doctor 进行环境测试

4) 安装 android studio ， 安装完毕后在其内部安装flutter插件

5) 安装android 证书 

6)  安装虚拟机 （可略过此步，直接使用雷电模拟器）

7) 尝试运行flutter项目

在vscode 内，安装flutter 插件

项目下直接flutter run 或者使用debug模式来进行运行

会自动连接模拟器

 

4.helloworld 第一段代码：

import 'package:flutter/material.dart';
//主函数（入口函数），下面我会简单说说Dart的函数
void main() =>runApp(MyApp());
// 声明MyApp类
class MyApp extends StatelessWidget{
  //重写build方法
  @override
  Widget build(BuildContext context){
    //返回一个Material风格的组件
   return MaterialApp(
      title:'Welcome to Flutteraa',
      home:Scaffold(
        //创建一个Bar，并添加文本
        appBar:AppBar(
          title:Text('Welcome to Flutter'),
        ),
        //在主体的中间区域，添加一个hello world 的文本
        body:Center(
          child:Text('Hello World'),
        ),
      ),
    );
  }
}

几个调试的关键字 

• r 键：点击后热加载，也就算是重新加载吧。
• p 键：显示网格，这个可以很好的掌握布局情况，工作中很有用。
• o 键：切换android和ios的预览模式。
• q 键：退出调试预览模式。