第2節(jié)
//安裝flutter
git clone https://github.com/flutter/flutter.git
ls ~/.bash_profile
touch ~/.bash_profile
source ~/.bash_profile
vim ~/.bash_profile
/*
//延用系統(tǒng)配置
if [ -f /etc/bash_profile ]; then
./etc/bash_profile
fi
//鏡像地址
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
//路徑
export PATH="$PATH:~/Downloads/flutter/bin"
*/
flutter -v
//修改權(quán)限
chmod 777
//查看權(quán)限
ls -l
罢洲。文件是隱藏文件
以前默認(rèn)bash(液兽。bash_profile）诽俯，現(xiàn)在zsh（吐辙。zshrc）
//切換命令行
//shell
chsh -s
chsh -l
shell
vi 修改文件
iOS有每個(gè)環(huán)境對應(yīng)的路徑 config里的路徑是絕對路徑著洼，很多地方要用到所以是絕對路徑
echo $PATH
which flutter
flutter doctor
flutter precache
flutter -v
flutter run
flutter run -d 'iPhone X'
flutter create fluter_Demo
跑不起來卡死，清緩存
rm flutter/bin.cache/lockfile
as快捷
common+ {} 光標(biāo)的上下一個(gè)位置
common+络断。 折疊代碼
common+shift+'-' 折疊代碼
as編譯的時(shí)候會(huì)自動(dòng)修改xcconfig配置文件路徑
第3節(jié) 布局與狀態(tài)管理
默認(rèn)寫法
class base_widgetTextDemo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(//
debugShowCheckedModeBanner: false,
home: Scaffold(
appBar: AppBar(
title: Text('title'),
),
body: ContainerDemo(),
),
theme: ThemeData(//主題
primaryColor: Colors.blue,
primarySwatch: Colors.yellow,//統(tǒng)一標(biāo)題顏色
),
);
}
}
text文字
overflow超出顯示
RichText富文本尖啡，TextSpan富文本文字
Container 容器
SizedBox(height: 10),//換行占位
alignment -1,-1左上角
橫row,縱column,stack中間堆疊
//主軸與交叉軸跟 row和column有關(guān) 他兩相反
/*
- 關(guān)于主軸:mainAxisAlignment
- spaceBetween 剩下的空間平均分布到小部件之間 1??2??2??1
- spaceAround 剩下的空間平均分布到小部件的周圍 ??1??1??
- spaceEvenly 剩下的空間和小部件一起平均分布 1??1??1??1
- */
交叉軸：crossAxisAlignment
/*
- 交叉軸：crossAxisAlignment；主軸不影響交叉軸布局
- start上對齊摧玫，end下對齊
*baseline必須要textBaseline - // alphabetic 英文字符 //ideographic 中文字符 第一行中文底部對齊
- */
Expanded 填充式布局驾讲，主軸不留間隙的填充， 主軸設(shè)置和長度沒有意義
Positioned 相對Stack容器最值（左右最寬席赂，上下最長），相對布局时迫，上下左右對齊 = Container
AspectRatio 寬高比例布局 aspectRatio
第4節(jié) 項(xiàng)目實(shí)戰(zhàn)-項(xiàng)目搭建&發(fā)現(xiàn)界面
floatingActionButton懸浮按鈕
BottomNavigationBar tabar （ixedColor: Colors.green,//選擇顏色selectedFontSize: 12.0, selectedFontSize: 12.0,//選擇字體大小
ThemeData（highlightColor: Color.fromRGBO(1, 0, 0, 0.0),//透明splashColor: Color.fromRGBO(1, 0, 0, 0.0),//水波紋
替換啟動(dòng)和icon iOS 一樣的 安卓 android/app/src/main/res/ 不能用大寫字母用下劃線颅停，圖片拖進(jìn)去會(huì)沒了，x是2倍掠拳，h1.5癞揉，m1 AndroidManifest.xml 修改圖片名
安卓被鎖住要修改鏡像 gradle assembleDebug 報(bào)錯(cuò)
啟動(dòng)圖片launch_background
<item>
<bitmap
android:gravity="center"
android:src="@mipmap/app_icon" />
</item>
安卓不用加圖片后綴名，加了有問題
image圖片配置
assets：
- 文件夾/
’文件夾/圖片名‘
//以下三個(gè)為了安卓
centerTitle: true,//去掉 安卓切換app會(huì)有文字
title: Text(
'發(fā)現(xiàn)',
),
elevation: 0.0,//去掉 安卓底部邊欄
MediaQuery.removePadding(//去掉劉耗缗罚空隙
margin 外邊距喊熟，定位子部件，padding 內(nèi)邊距姐刁，父部件
二分芥牌，或多分布局思維 左右/上下 兩塊
decoration: BoxDecoration(//裝飾器，設(shè)置圓角
color: Colors.blue,
borderRadius: BorderRadius.circular(10.0),
image: DecorationImage(
image: AssetImage('images/Hank.png'), fit: BoxFit.cover),//填充
),
width: MediaQuery.of(context).size.width,//獲取屏幕寬度
ListView.builder(重用機(jī)制
Container(
height: 0.5,
color: WeChatThemeColor,
child: Row(//去掉邊
children: <Widget>[
Container(
width: 50,
color: Colors.white,
)
],
),
Container(
color: WeChatThemeColor,包裝一下聂使，設(shè)一下listview背景色
child: ListView.builder(
controller: _scrollController,
itemCount: _listDatas.length + _headerData.length,
itemBuilder: _itemForRow,
)), //列表
},
), //
//鏈?zhǔn)骄幊?_listDatas..addAll(datas)..addAll(datas);
// _listDatas.addAll(datas);
// _listDatas.addAll(datas);
//排序! 首字母排序
_listDatas.sort((Friends a, Friends b) {
return a.indexLetter.compareTo(b.indexLetter);
});
index思路：第一個(gè)必定需要字母頭壁拉，從第二個(gè)開始判斷indexLetter跟前一個(gè)一樣就不顯示
iOS打包谬俄，app app.framework（flutter代碼，字節(jié)碼弃理，二進(jìn)制流）/flutter.framework（flutter引擎）
y ~/ itemHeight //取整
_scrollController 添加滾動(dòng)動(dòng)畫
indexbar控件
1.創(chuàng)建column控件溃论，加scroview讓它可以滾動(dòng)
2.點(diǎn)擊拖拽手勢（加滾動(dòng)動(dòng)畫，用控件的坐標(biāo)算出是第幾個(gè)）
3.增加控件
4痘昌；存儲(chǔ)高度钥勋，滾動(dòng)的時(shí)候直接取
更新代碼庫 flutter pub get
flutter packages get => flutter pub get
代碼網(wǎng)站 https://pub.dev
import 'package:http/http.dart' as http; //重命名為http
配置允許http
//Map轉(zhuǎn)Json
// final chatJson = json.encode(chat);
// print(chatJson);
//Json轉(zhuǎn)Map
// final newChat = json.decode(chatJson);
// print(newChat is Map);
- */
const Chat({this.name, this.message, this.imageUrl});//必須創(chuàng)建新對象
factory Chat.fromJson(Map json) {//工廠構(gòu)造函數(shù)：返回任何對象，已有的對象（單例）辆苔，null算灸，新建的
return Chat(
name: json['name'],
message: json['message'],
imageUrl: json['imageUrl'],
);
}
渲染機(jī)制，不在界面上就沒有了姑子『跣觯可以刻意去保存
flutter閉包，就是一個(gè)對象
超時(shí)了數(shù)據(jù)還會(huì)來
dart 單線程語音
//耗時(shí)操作
//1.后面的操作必須是異步才能用await修飾
//2.當(dāng)前行數(shù)也必須是異步函數(shù) async
getData() async { Future((){//閑時(shí)操作).then(value) {}.catchError(errorFunc){}.whenComplete(() { print('完成了!');}); }//先error再then error也會(huì)掉then,完成一定會(huì)執(zhí)行
Future有一個(gè)執(zhí)行隊(duì)列街佑。同級(jí)then比Future隊(duì)列任務(wù)級(jí)別高
then函數(shù)拋異常會(huì)直接到下一個(gè)catchError函數(shù)
//隊(duì)列
void testFuture() async {
//同級(jí) then比Future隊(duì)列任務(wù)級(jí)別高
Future(() {
sleep(Duration(seconds: 2));
return '任務(wù)1';
}).then((value) {
print('value任務(wù)2';
}).then((value) {
print('value任務(wù)3';
}).catchError((e)=>print('結(jié)束')).then((value) {
print('value任務(wù)4';
}).catchError((e)=>print('結(jié)束2'));//then函數(shù)拋異常會(huì)直接到下一個(gè)catchError函數(shù)
print('任務(wù)添加完畢');
}
//微任務(wù)scheduleMicrotask高于Future
異步編程 https://www.cnblogs.com/lxlx1798/p/11126564.html
多線程 Isolate
用端口監(jiān)聽谢翎，收發(fā)消息
異步操作返回都是futuer
compute 多線程，Isolate的封裝
