calendar_selected_preview_view.dart 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350
  1. import 'package:clean/base/base_controller.dart';
  2. import 'package:clean/base/base_page.dart';
  3. import 'package:clean/module/calendar/selected_preview/calendar_selected_preview_controller.dart';
  4. import 'package:flutter/Material.dart';
  5. import 'package:flutter_screenutil/flutter_screenutil.dart';
  6. import 'package:get/get.dart';
  7. import 'package:lottie/lottie.dart';
  8. import 'package:wechat_assets_picker/wechat_assets_picker.dart';
  9. import '../../../resource/assets.gen.dart';
  10. import '../../../router/app_pages.dart';
  11. import '../../people_photo/photo_group.dart';
  12. class CalendarSelectedPreviewPage
  13. extends BasePage<CalendarSelectedPreviewController> {
  14. const CalendarSelectedPreviewPage({Key? key}) : super(key: key);
  15. static void start(PhotoGroup photoGroup) {
  16. Get.toNamed(RoutePath.calendarSelectedPreview,
  17. arguments: {"photoGroup": photoGroup});
  18. }
  19. @override
  20. bool statusBarDarkFont() {
  21. return false;
  22. }
  23. @override
  24. bool immersive() {
  25. return true;
  26. }
  27. @override
  28. Widget buildBody(BuildContext context) {
  29. return Stack(children: [
  30. PopScope(
  31. canPop: false,
  32. onPopInvokedWithResult: (didPop, result) {
  33. if (didPop) {
  34. return;
  35. }
  36. controller.clickBack();
  37. },
  38. child: Container(
  39. child: SafeArea(
  40. child: Obx(() {
  41. if (controller.photoGroup.value.images.isEmpty) {
  42. return _noNoPicturesCard();
  43. } else if (controller.isKeepAll.value) {
  44. return _finishCleanCard();
  45. }
  46. return Column(
  47. children: [
  48. _titleCard(),
  49. Flexible(
  50. child: Obx(() {
  51. return SizedBox(
  52. child: GridView.builder(
  53. padding: EdgeInsets.symmetric(horizontal: 16.w),
  54. scrollDirection: Axis.vertical,
  55. // 设置为垂直方向滚动
  56. physics: BouncingScrollPhysics(),
  57. gridDelegate:
  58. SliverGridDelegateWithFixedCrossAxisCount(
  59. crossAxisCount: 3, // 每行显示 2 个元素
  60. mainAxisSpacing: 8.w, // 垂直间距
  61. crossAxisSpacing: 8.h, // 水平间距
  62. ),
  63. itemCount:
  64. controller.photoGroup.value.images.length,
  65. itemBuilder: (context, index) {
  66. return _buildPhotoItem(context, index,
  67. controller.photoGroup.value.images);
  68. }),
  69. );
  70. }),
  71. ),
  72. Obx(() {
  73. if (controller.photoGroup.value.images.isNotEmpty) {
  74. return _bottomBarCard();
  75. } else {
  76. return SizedBox();
  77. }
  78. }),
  79. SizedBox(height: 8.h),
  80. ],
  81. );
  82. }),
  83. ),
  84. )),
  85. Obx(() {
  86. if (controller.isKeepAll.value) {
  87. return IgnorePointer(
  88. child: Assets.images.bgPhotoSelectedPreviewFinish.image(
  89. width: 360.w,
  90. ),
  91. );
  92. } else {
  93. return IgnorePointer(
  94. child: Assets.images.bgHome.image(
  95. width: 360.w,
  96. ),
  97. );
  98. }
  99. }),
  100. ]);
  101. }
  102. Widget _titleCard() {
  103. return Container(
  104. alignment: Alignment.centerLeft,
  105. padding:
  106. EdgeInsets.only(left: 16.w, top: 14.h, right: 16.w, bottom: 20.h),
  107. child: Column(
  108. crossAxisAlignment: CrossAxisAlignment.start,
  109. children: [
  110. Obx(() {
  111. return Row(
  112. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  113. children: [
  114. GestureDetector(
  115. onTap: () => controller.clickBack(),
  116. child: Assets.images.iconBackArrow.image(
  117. width: 28.w,
  118. height: 28.h,
  119. ),
  120. ),
  121. // 如果photoGroup数据为空,不显示全选按钮
  122. controller.photoGroup.value.images.isEmpty
  123. ? Container()
  124. : GestureDetector(
  125. onTap: () => controller.toggleGroupSelection(
  126. controller.photoGroup.value.images),
  127. child: Obx(() => Text(
  128. controller.photoGroup.value.selectedPhotosIds
  129. .length ==
  130. controller.photoGroup.value.images.length
  131. ? 'Deselect All'
  132. : 'Select All',
  133. style: TextStyle(
  134. color: Colors.white.withValues(alpha: 0.7),
  135. fontSize: 14.sp,
  136. fontWeight: FontWeight.w400,
  137. ),
  138. )),
  139. ),
  140. ],
  141. );
  142. }),
  143. ],
  144. ),
  145. );
  146. }
  147. Widget _bottomBarCard() {
  148. return GestureDetector(
  149. onTap: () {
  150. controller.clickDelete();
  151. },
  152. child: Container(
  153. width: 328.w,
  154. height: 48.h,
  155. decoration: ShapeDecoration(
  156. color: Color(0xFF0279FB),
  157. shape: RoundedRectangleBorder(
  158. borderRadius: BorderRadius.circular(10.r),
  159. ),
  160. ),
  161. padding: EdgeInsets.symmetric(horizontal: 16.w),
  162. child: Row(
  163. mainAxisAlignment: MainAxisAlignment.center,
  164. children: [
  165. Assets.images.iconDelete.image(
  166. width: 18.w,
  167. height: 18.h,
  168. ),
  169. SizedBox(width: 5.w),
  170. Obx(() {
  171. if (controller.photoGroup.value.selectedPhotosIds.isNotEmpty) {
  172. return Text(
  173. 'delete ${controller.selectedFilesSizeString}',
  174. textAlign: TextAlign.center,
  175. style: TextStyle(
  176. color: Colors.white,
  177. fontSize: 16.sp,
  178. fontWeight: FontWeight.w500,
  179. ),
  180. );
  181. } else {
  182. return Text(
  183. 'Keep All',
  184. textAlign: TextAlign.center,
  185. style: TextStyle(
  186. color: Colors.white,
  187. fontSize: 16.sp,
  188. fontWeight: FontWeight.w500,
  189. ),
  190. );
  191. }
  192. }),
  193. ],
  194. ),
  195. ));
  196. }
  197. Widget _buildPhotoItem(context, index, List<AssetEntity> images) {
  198. return GestureDetector(
  199. onTap: () => controller.clickImage(index),
  200. child: Obx(() {
  201. final photoId = controller.photoGroup.value.images[index].id;
  202. final isSelected =
  203. controller.photoGroup.value.selectedPhotosIds.contains(photoId);
  204. return Stack(
  205. children: [
  206. Container(
  207. width: 104.w,
  208. height: 104.w,
  209. decoration: ShapeDecoration(
  210. color: Colors.white.withValues(alpha: 0.12),
  211. shape: RoundedRectangleBorder(
  212. borderRadius: BorderRadius.circular(9.27.sp),
  213. ),
  214. ),
  215. child: ClipRRect(
  216. borderRadius: BorderRadius.circular(9.27.sp),
  217. child: AssetEntityImage(
  218. controller.photoGroup.value.images[index],
  219. thumbnailSize: const ThumbnailSize.square(300),
  220. isOriginal: false,
  221. ),
  222. )),
  223. Positioned(
  224. right: 8.w,
  225. bottom: 8.h,
  226. child: GestureDetector(
  227. onTap: () => controller.toggleImageSelection(index),
  228. child: Container(
  229. child: isSelected
  230. ? Center(
  231. child: Assets.images.iconSelected.image(
  232. width: 20.w,
  233. height: 20.h,
  234. ),
  235. )
  236. : Center(
  237. child: Assets.images.iconUnselected.image(
  238. width: 20.w,
  239. height: 20.h,
  240. )),
  241. )),
  242. ),
  243. ],
  244. );
  245. }),
  246. );
  247. }
  248. Widget _noNoPicturesCard() {
  249. return Column(
  250. mainAxisAlignment: MainAxisAlignment.start,
  251. children: [
  252. _titleCard(),
  253. SizedBox(height: 170.h),
  254. Column(
  255. mainAxisAlignment: MainAxisAlignment.center,
  256. crossAxisAlignment: CrossAxisAlignment.center,
  257. children: [
  258. Container(
  259. width: 70.w,
  260. height: 70.h,
  261. clipBehavior: Clip.antiAlias,
  262. decoration: BoxDecoration(),
  263. child: Assets.images.iconNoPictures.image(),
  264. ),
  265. SizedBox(height: 22.h),
  266. Text(
  267. 'No pictures found',
  268. textAlign: TextAlign.center,
  269. style: TextStyle(
  270. color: Colors.white,
  271. fontSize: 20.sp,
  272. fontWeight: FontWeight.w700,
  273. ),
  274. ),
  275. SizedBox(height: 12.h),
  276. Text(
  277. 'No pictures available at the moment',
  278. textAlign: TextAlign.center,
  279. style: TextStyle(
  280. color: Colors.white.withValues(alpha: 0.6),
  281. fontSize: 14.sp,
  282. fontWeight: FontWeight.w400,
  283. ),
  284. ),
  285. ],
  286. ),
  287. ],
  288. );
  289. }
  290. Widget _finishCleanCard() {
  291. return Container(
  292. width: 360.w,
  293. child: Column(
  294. mainAxisAlignment: MainAxisAlignment.start,
  295. children: [
  296. Spacer(
  297. flex: 3,
  298. ),
  299. Text(
  300. 'Great!',
  301. textAlign: TextAlign.center,
  302. style: TextStyle(
  303. color: Colors.white,
  304. fontSize: 32.sp,
  305. fontWeight: FontWeight.w700,
  306. ),
  307. ),
  308. SizedBox(height: 14.h),
  309. Text(
  310. "You've completed 1 photo review",
  311. textAlign: TextAlign.center,
  312. style: TextStyle(
  313. color: Colors.white.withValues(alpha: 0.8),
  314. fontSize: 16.sp,
  315. fontWeight: FontWeight.w400,
  316. ),
  317. ),
  318. SizedBox(height: 47.h),
  319. // Assets.images.iconPhotoSelectedPreviewFireworks.image(
  320. // width: 158.w,
  321. // height: 158.h,
  322. // ),
  323. SizedBox(
  324. child: Lottie.asset(
  325. Assets.anim.animPhotoSelectedPreviewFireworks,
  326. width: 158.w,
  327. height: 158.w,
  328. repeat: false,
  329. )),
  330. Spacer(
  331. flex: 5,
  332. ),
  333. ],
  334. ),
  335. );
  336. }
  337. }