156 lines
5.4 KiB
Dart
156 lines
5.4 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
|
import 'package:get/get.dart';
|
|
import 'package:regroup/Utils/Common/CommonAppbar.dart';
|
|
import 'package:regroup/Utils/Common/blureffect.dart';
|
|
import 'package:regroup/Utils/Common/sized_box.dart';
|
|
import 'package:regroup/Utils/texts.dart';
|
|
|
|
class Watchlist extends StatefulWidget {
|
|
const Watchlist({super.key});
|
|
|
|
@override
|
|
State<Watchlist> createState() => _WatchlistState();
|
|
}
|
|
|
|
class _WatchlistState extends State<Watchlist> {
|
|
final List<String> images = [
|
|
'assets/images/png/Rectangle 24.png',
|
|
'assets/images/png/Rectangle 25.png',
|
|
'assets/images/png/Rectangle 26.png',
|
|
'assets/images/png/Rectangle 27.png',
|
|
'assets/images/png/Rectangle 28.png',
|
|
'assets/images/png/Rectangle 29.png',
|
|
'assets/images/png/Rectangle 30.png',
|
|
'assets/images/png/Rectangle 31.png',
|
|
'assets/images/png/Rectangle 32.png',
|
|
];
|
|
|
|
var selected = <bool>[].obs;
|
|
var showCircles = false.obs;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
// Initialize the selection list
|
|
selected.value = List<bool>.filled(images.length, false);
|
|
}
|
|
|
|
void toggleSelection(int index) {
|
|
selected[index] = !selected[index];
|
|
}
|
|
|
|
void toggleCircles() {
|
|
showCircles.value = true;
|
|
}
|
|
|
|
void removeSelection() {
|
|
selected.value = List<bool>.filled(images.length, false);
|
|
showCircles.value = false;
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
backgroundColor: Color(0xFF222935),
|
|
extendBody: true,
|
|
appBar: CommonAppbar(
|
|
titleTxt: "Watchlist",
|
|
customActionWidget: Obx(() => showCircles.value
|
|
? GestureDetector(
|
|
onTap: removeSelection,
|
|
child: text16w700_D90B2E("Remove",
|
|
decoration: TextDecoration.underline),
|
|
)
|
|
: SizedBox.shrink()),
|
|
),
|
|
body: Stack(children: [
|
|
Container(
|
|
decoration: const BoxDecoration(
|
|
image: DecorationImage(
|
|
image: AssetImage("assets/images/png/Ellipse 1496.png"),
|
|
fit: BoxFit.fill)),
|
|
),
|
|
Padding(
|
|
padding: EdgeInsets.symmetric(horizontal: 16.w),
|
|
child: Column(
|
|
children: [
|
|
sizedBoxHeight(40.h),
|
|
Expanded(
|
|
child: GridView.builder(
|
|
scrollDirection: Axis.vertical,
|
|
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
|
crossAxisCount: 3,
|
|
mainAxisSpacing: 8,
|
|
crossAxisSpacing: 8,
|
|
childAspectRatio: 1,
|
|
),
|
|
itemCount: images.length,
|
|
itemBuilder: (context, index) {
|
|
return GestureDetector(
|
|
onLongPress: () {
|
|
toggleCircles();
|
|
},
|
|
onTap: () {
|
|
toggleSelection(index);
|
|
},
|
|
child: Obx(() {
|
|
return Stack(
|
|
children: [
|
|
Container(
|
|
width: 115.w,
|
|
height: 115.h,
|
|
child: Image.asset(
|
|
images[index],
|
|
width: 115.w,
|
|
height: 115.h,
|
|
fit: BoxFit.cover,
|
|
),
|
|
),
|
|
if (showCircles.value)
|
|
Positioned(
|
|
top: 8.h,
|
|
right: 8.w,
|
|
child: GestureDetector(
|
|
onTap: () {
|
|
toggleSelection(index);
|
|
},
|
|
child: Container(
|
|
width: 18.w,
|
|
height: 18.h,
|
|
decoration: BoxDecoration(
|
|
color: selected[index]
|
|
? Colors.white
|
|
: Colors.transparent,
|
|
shape: BoxShape.circle,
|
|
border: Border.all(
|
|
color: Colors.white, width: 1),
|
|
),
|
|
child: selected[index]
|
|
? Center(
|
|
child: Icon(
|
|
Icons.check,
|
|
color: Color(0xFF344436),
|
|
size: 12,
|
|
weight: 3,
|
|
),
|
|
)
|
|
: null,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
]),
|
|
);
|
|
}
|
|
}
|