GetView介紹
GetView只是對(duì)已注冊(cè)的Controller有一個(gè)名為controller的getter的const Stateless的Widget凰萨，如果我們只有單個(gè)控制器作為依賴(lài)項(xiàng)继控，那我們就可以使用GetView，而不是使用StatelessWidget胖眷，并且避免了寫(xiě)Get.Find()武通。
視頻教程地址
GetView如何使用
GetView的使用方法非常簡(jiǎn)單，只是要將你的視圖層繼承自GetView并傳入需要注冊(cè)的控制器并Get.put()即可珊搀，我們來(lái)看下代碼演示：
第一步：應(yīng)用程序入口配置
import 'package:flutter/material.dart';
import 'package:flutter_getx_example/GetViewAndGetWidgetExample/GetViewAndGetWidgetExample.dart';
import 'package:get/get.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
title: "GetX",
home: GetViewAndGetWidgetExample(),
);
}
}
第二步：繼承自GetView并使用狀態(tài)管理
import 'package:flutter/material.dart';
import 'package:flutter_getx_example/GetViewAndGetWidgetExample/GetViewCountController.dart';
import 'package:get/get.dart';
class GetViewAndGetWidgetExample extends GetView<GetViewCountController> {
@override
Widget build(BuildContext context) {
Get.put(GetViewCountController());
// Get.create(() => GetViewCountController());
return Scaffold(
appBar: AppBar(
title: Text("GetX GetView"),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Obx(() => Text(
"count的值為: ${controller?.count}",
style: TextStyle(
color: Colors.red,
fontSize: 30
),
)),
SizedBox(height: 20,),
ElevatedButton(
onPressed: () {
controller.increment();
},
child: Text("點(diǎn)我加1"))
],
),
),
);
}
}
效果展示
image
GetWidget介紹
它 "緩存 "了一個(gè)Controller冶忱，由于cache，不能成為一個(gè) "const Stateless"（因?yàn)?em>cache食棕，所以不能成為一個(gè)const Stateless）朗和。當(dāng)我們使用Get.create(()=>Controller())會(huì)在每次調(diào)用時(shí)生成一個(gè)新的ControllerGet.find<Controller>()`
GetWidget如何使用
第一步：應(yīng)用程序入口設(shè)置
import 'package:flutter/material.dart';
import 'package:flutter_getx_example/GetViewAndGetWidgetExample/GetViewAndGetWidgetExample.dart';
import 'package:get/get.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
title: "GetX",
home: GetViewAndGetWidgetExample(),
);
}
}
第二步：繼承自GetWidget并使用
import 'package:flutter/material.dart';
import 'package:flutter_getx_example/GetViewAndGetWidgetExample/GetViewCountController.dart';
import 'package:get/get.dart';
class GetViewAndGetWidgetExample extends GetWidget<GetViewCountController> {
@override
Widget build(BuildContext context) {
// Get.put(GetViewCountController());
Get.create(() => GetViewCountController());
return Scaffold(
appBar: AppBar(
title: Text("GetX GetView"),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Obx(() => Text(
"count的值為: ${controller?.count}",
style: TextStyle(
color: Colors.red,
fontSize: 30
),
)),
SizedBox(height: 20,),
ElevatedButton(
onPressed: () {
controller.increment();
},
child: Text("點(diǎn)我加1"))
],
),
),
);
}
}
效果展示
image
總結(jié)
在我們平時(shí)的開(kāi)發(fā)過(guò)程中基本上很少會(huì)用到GetWidget错沽，因?yàn)槲覀冊(cè)诖蟛糠智闆r下都不需要緩存Controller簿晓。
當(dāng)我們的頁(yè)面中只依賴(lài)了一個(gè)控制器的情況話(huà)，那么使用GetView將是很好的選擇千埃，因?yàn)樗蟠蠛?jiǎn)化了我們的代碼憔儿。
