? ? ? ?針對原生開發(fā)和混合開發(fā)的優(yōu)缺點(diǎn)，咱也不多說了，總的來說，就是犧牲一部分性能，然后適應(yīng)各大平臺，想了解原生開發(fā)和混合開發(fā)的區(qū)別以及各大混合開發(fā)具體區(qū)別的，可以在https://book.flutterchina.club/chapter1/mobile_development_intro.html了解一下，這里就不做過多介紹。下面開始Hello world。

? ? ? ? 關(guān)于flutter的安裝教程，請移步https://book.flutterchina.club/chapter1/install_flutter.html。

第一步：新建工程

1.Create New Flutter Project，選擇Flutter Application

圖1-1 創(chuàng)建項(xiàng)目?

2.點(diǎn)擊next，進(jìn)入項(xiàng)目配置頁面，Project name填寫Hello world！注意，項(xiàng)目名稱只能由小寫字母，數(shù)字，下劃線組成，第一個(gè)字符必須是小寫字母，最后一個(gè)不能為下劃線

圖1-2 設(shè)置項(xiàng)目屬性

3.點(diǎn)擊Next 設(shè)置包名

圖1-3 設(shè)置包名

4.點(diǎn)擊Finish完成項(xiàng)目的創(chuàng)建。

圖1-4 項(xiàng)目創(chuàng)建完成

5.運(yùn)行項(xiàng)目查看效果，運(yùn)行結(jié)果如圖1-5所示，對于項(xiàng)目的具體解析，可以查看https://book.flutterchina.club/chapter2/first_flutter_app.html

圖1-5 默認(rèn)程序運(yùn)行結(jié)果

6.清空main.dart中所有的代碼，開始編寫我們自己的Hello world！

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyAppextends StatelessWidget {

@override

? Widgetbuild(BuildContext context) {

return MaterialApp(

title:'Flutter Demo',

? ? ? theme:ThemeData(

primarySwatch: Colors.blue,

? ? ? ),

? ? ? home:Scaffold(

appBar:AppBar(

title:Text("Welcome to Flutter"),

? ? ? ? ),

? ? ? ? body:Center(

child:Text("Hello world!"),

? ? ? ? ),

? ? ? )

);

? }

}

7.進(jìn)行調(diào)試，查看運(yùn)行結(jié)果

圖1-6 點(diǎn)擊綠色三角塊，運(yùn)行程序

圖1-7 Hello world運(yùn)行結(jié)果

? ? ? ? 到這里位置，完成了我們的第一個(gè)Flutter程序的編寫，學(xué)習(xí)Flutter邁出了人生中的第一大步。