介紹
Google 在 2017 年發表 Flutter。
使用 Dart 語言的原因:Hot Reload 功能。
變數
var 根據內容自動決定型態
dynamic 可以儲存任何型態
const 宣告後不可再改,
final 宣告後不可再改,
string 可以用 ‘ 或 “
Windows 環境建置
Git
WinRAR
Flutter SDK:安裝在 C:\flutter → 編輯系統環境變數 (Path – C:\flutter\bin)。
Android Studio:安裝 Flutter 插件 (Font: 18、Flutter – Format code on save)。
JDK 11
【Google Drive 備份】
DEBUG
debugShowCheckedModeBanner: false,
Scaffold
MaterialApp(
home: Scaffold(
appBar: AppBar(title: const Text('My App')),
body: const Text('Hello World'),
), // Scaffold
), // MaterialApp
AppBar
centerTitle: true,
AssetImage
1. 在 Project 下創建 images 資料夾,放圖片進去。
2. pubspec.yaml:assets: – images/。
3. Packages get。
Image(image: AssetImage('')),
App Icon
右鍵 Project → Flutter → Open Android module → New Window → 右鍵 res → New → Image Asset。
Hot Reload
stless → MyApp。
Container
as big as possible.
SafeArea:Alt+Enter → Wrap with widget → widget 命名改成 SafeArea。
Margin(外邊距)/Padding(內邊距)
EdgeInsets.all(10.0),
EdgeInsets.symmetric(vertical: 50.0, horizontal: 10.0),
EdgeInsets.fromLTRB(10.0, 20.0, 30.0, 40.0),
EdgeInsets.only(left: 10.0),
Column/Row
Column(children: [],),
mainAxisSize: MainAxisSize.min,
verticalDirection: VerticalDirection.up,
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.stretch, //Expanded
SizedBox
SizedBox(
height: 10.0,
),
TextStyle
letterSpacing: 2.5,
Card with padding
Alt+Enter → Wrap with widget → Padding → padding: …
ListTile
icon + text.
leading: (icon)
title: (text)
Expanded
for Column or Row (child) (flex: 比例)
TextButton (old FlatButton)
default with padding (left: 16.0, right: 16.0)
onPressed: (){}, // setState style: TextButton.styleFrom(padding: EdgeInsets.zero),
Stateful Widget
stful
setState(() {
});
Random
import 'dart:math'; Random().nextInt(max); // 0 ~ max-1
AudioPlayers
audioplayers: ^3.0.0 import 'package:audioplayers/audioplayers.dart'; final player = AudioPlayer(); player.play(AssetSource('note1.wav'));
Class & Constructor
create ___.dart at lib (sam with main.dart)
class Question {
String questionText = 'Undefined question.';
bool questionAnswer = true;
// Question({required this.questionText, required this.questionAnswer});
Question({required String q, required bool a}) {
questionText = q;
questionAnswer = a;
}
}
Private
在前面加_
將所有地方的某個變數變成Private:對變數右鍵 → Refactor → Rename。
Inheritance
class B extends A
Polymorphism
@override same function (at A) when you extends from A
(can use “super.func()” to use old func in new func, even the name is same as func)
this
void main() {
User andy = User(age: 18);
print(andy.age);
}
class User {
int age = 0;
// User({required this.age});
User({required int age}) {
this.age = age;
}
}
Set Background Image (BoxDecoration)
In a container.
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('images/background.png'),
fit: BoxFit.cover,
),
),
Visibility
Warp with widget, and rename to “Visibility”.
visible: bool(ture or false).
floatingActionButton
floatingActionButton: FloatingActionButton(
onPressed: () {},
child: const Icon(Icons.add),
),
Theme
MaterialApp(
theme: ThemeData.dark(),
);