Flutter GetX真香系列。在生產(chǎn)環(huán)境已使用半年，使用GetX真正實(shí)現(xiàn)View和Controller分離，同時(shí)該庫內(nèi)置網(wǎng)絡(luò)請求和一些封裝組件，如Dialog,Snackbar等。GetX的狀態(tài)管理我覺得在使用上比Bloc和Provider好用。話不多說先看效果。上方播放器放在AppBar中，下方為TabView，同時(shí)加載狀態(tài)為骨架屏。具體實(shí)現(xiàn)如下。
骨架屏使用，具體用法可看Pub中的示例，很簡單。
shimmer_animation: 2.1.0
GetX 是 Flutter 上的一個(gè)輕量且強(qiáng)大的解決方案：高性能的狀態(tài)管理、智能的依賴注入和便捷的路由管理。
GetX 有3個(gè)基本原則：
性能： GetX 專注于性能和最小資源消耗。GetX 打包后的apk占用大小和運(yùn)行時(shí)的內(nèi)存占用與其他狀態(tài)管理插件不相上下。如果你感興趣，這里有一個(gè)性能測試。
效率： GetX 的語法非常簡捷，并保持了極高的性能，能極大縮短你的開發(fā)時(shí)長。
結(jié)構(gòu)： GetX 可以將界面、邏輯、依賴和路由完全解耦，用起來更清爽，邏輯更清晰，代碼更容易維護(hù)
在此再安利一個(gè)AndroidStudio插件，GetX。在創(chuàng)建類時(shí)直接選擇GetX，會(huì)自動(dòng)創(chuàng)建view和logic。
logic主要為網(wǎng)絡(luò)請求和一些邏輯相關(guān)功能封裝，state中主要是狀態(tài)變化需要監(jiān)聽的類。
在view中可與provider一樣在build中通過泛型的形式監(jiān)聽類的變化，也可通過controllr的obx進(jìn)行監(jiān)聽。
我個(gè)人習(xí)慣使用GetBuilder的形式監(jiān)聽狀態(tài)變化。
整個(gè)頁面的view層代碼如下
view層繼承GetView.邏輯層就繼承GetxController，網(wǎng)絡(luò)請求繼承GetConnect。
class VideoCollectPageextends GetView {
StringvideoId;
VideoCollectPage(this.videoId, {Key? key}) :super(key: key);
@override
Widgetbuild(BuildContext context) {
VideoDetailPageLogic logic = Get.find(tag:videoId);
return GetBuilder(builder:(controller){
return Column(
children: [
Container(
height:33.w,
width: double.infinity,
padding:EdgeInsets.only(left:21.w),
alignment: Alignment.centerLeft,
color:const Color(0xFFF4F4F4),
child:Text(
"已更新至${logic.state.videoDetailData?.videoDSetDtos?.length}",
style: Get.theme.textTheme.subtitle1,
),
),
Expanded(
child:CupertinoScrollbar(
child:ListView.separated(
separatorBuilder: (BuildContext context, int index) {
return Container(
height:4.w,
);
},
physics:const BouncingScrollPhysics(),
itemBuilder: (_, index) {
return InkWell(
child:Container(
width:73.w,
padding:EdgeInsets.only(left:21.w),
child:Row(
children: [
Card(
clipBehavior: Clip.antiAlias,
child:CachedNetworkImage(
width:133.w,
fit: BoxFit.fill,
imageUrl: logic.state.videoDetailData
?.videoDSetDtos?[index].coverUrl ??
""),
shape:RoundedRectangleBorder(
borderRadius:
BorderRadius.all(Radius.circular(7.w))),
),
SizedBox(
width:4.w,
),
Column(
children: [
SizedBox(
height:13.w,
),
Text(
logic.state.videoDetailData
?.videoDSetDtos?[index].title ??
"",
maxLines:2,
softWrap:true,
style:TextStyle(
color: (logic.state.currentPlayPostion ==
index)
? Colors.orangeAccent
: Get.theme.textTheme.bodyText1?.color),
),
SizedBox(
height:22.w,
),
Row(
children: [
Text(
(logic
.state
.videoDetailData
?.videoDSetDtos?[index]
.currentVideoCount
.toString() ??
"") +
"video_num".tr,
maxLines:1,
softWrap:true,
style: Get.textTheme.subtitle1,
)
],
)
],
)
],
),
),
onTap: () {
logic.state.currentPlayPostion = index;
logic.state.player.stop();
logic.state.player.reset().then((value) {
logic.state.player.setDataSource(
logic.state.videoDetailData?.videoDSetDtos?[index]
.videoUrl ??
"",
autoPlay:true);
logic.update();
});
},
);
},
itemCount:
logic.state.videoDetailData?.videoDSetDtos?.length ??0,
),
),
)
],
);
},init: logic,);
}
}
但是GetX有些人認(rèn)為背離了Google官方設(shè)計(jì)的Flutter思想，我現(xiàn)在公司的項(xiàng)目中只有我會(huì)Flutter，后我又對移動(dòng)端組內(nèi)成員進(jìn)行培訓(xùn)，陪訓(xùn)的過程中先是學(xué)習(xí)基礎(chǔ)小部件，然后就是培訓(xùn)使用GetX,對移動(dòng)端組內(nèi)成員的陪訓(xùn)用了兩周就要吧獨(dú)立寫需求了?？梢奊etX的簡潔。
另外請關(guān)注我的個(gè)人站http://jvm.plus
