Каким будет правильный подход к управлению состоянием GetX Flutter?
Я хочу изменить фоновое изображение главного экрана, когда пользователь выбирает изображение из GridView. GridView находится в ящике. Я новичок в разработке программного обеспечения, но каким-то образом мне удалось заставить его работать, но новичком. Хотите знать, каков ваш подход? Использование пакета GetX для управления состоянием.
Коды следующие:
HomeScreen Code:
class HomeScreen extends StatelessWidget {
final MyController controller = Get.put(MyController());
@override
Widget build(BuildContext context) {
return Stack(
children: [
GetBuilder<MyController>(
builder: (controller) => Container(
decoration: BoxDecoration(
image: DecorationImage(
image: controller.bgImage.image,
fit: BoxFit.cover,
),
),
),
),
GridView Code:
class MyGridView extends StatelessWidget {
final MyController controller = Get.put(MyController());
@override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
appBar: AppBar(
backgroundColor: Colors.yellow,
title: Text(
'Select a background',
style: TextStyle(color: Colors.black),
),
centerTitle: true,
),
body: Container(
child: GridView.count(
crossAxisCount: 2,
padding: EdgeInsets.all(10.0),
children: [
Container(
child: GestureDetector(
onTap: () => controller.setBGImage1(),
child: Image(
image: controller.bgImageList[0].image,
),
),
),
Container(
child: GestureDetector(
onTap: () => controller.setBGImage2(),
child: Image(
image: controller.bgImageList[1].image,
),
),
),
],
),
),
),
);
}
}
Controller Code:
class MyController extends GetxController {
Image bgImage = Image.asset('assets/jellypop.jpg');
List<Image> bgImageList = [
Image.asset('assets/jellypop.jpg'),
Image.asset('assets/xyz.jpg'),
];
setBGImage1() {
bgImage = bgImageList[0];
update();
}
setBGImage2() {
bgImage = bgImageList[1];
update();
}
}