实现图像选择器的数据驱动

lib/pages/components/input_imageList.dart

@@ -20,10 +20,11 @@ class RInputImageList extends StatefulWidget {
 
 class _RInputImageListState extends State<RInputImageList> {
   InputImageList? inputImageList;
-  InputImageListInfo? inputImageListInfo;
+
+  InputImageListInfo? _inputImageListInfo;
   Color _borderColor = Colors.grey;
   bool _isSelected = false;
-  final List<String> _images = [];
+  List<String> _images = [];
   double _height = 0.0;
 
   Widget _child = const Text('请点击此处后选择图片');
@@ -36,24 +37,28 @@ class _RInputImageListState extends State<RInputImageList> {
 
   @override
   Widget build(BuildContext context) {
-    if (inputImageListInfo != null) {
+    if (_inputImageListInfo != null) {
       final imageInfo = ReportInfo.instance
           .getBlockElement(widget.inputImageList) as InputImageListInfo;
-      if (imageInfo != inputImageListInfo) {
-        inputImageListInfo = imageInfo;
+      if (imageInfo != _inputImageListInfo) {
+        if (_inputImageListInfo != null) {
+          _inputImageListInfo!.onSelectedChange.dispose();
+        }
+        _inputImageListInfo = imageInfo;
+        _addSelectImageListening();
         setState(() {
           _images.clear();
           _isSelected = false;
           _child = _getChild();
         });
-        inputImageListInfo!.onSelect!.addListener((sender, e) {
+        _inputImageListInfo!.onSelect!.addListener((sender, e) {
           setState(() {
             if (_images.contains(e)) {
               _images.remove(e);
-              inputImageListInfo!.selectedImages.remove(e);
+              _inputImageListInfo!.selectedImages.remove(e);
             } else {
               _images.add(e);
-              inputImageListInfo!.selectedImages.add(e);
+              _inputImageListInfo!.selectedImages.add(e);
             }
             _child = _getChild();
           });
@@ -71,13 +76,13 @@ class _RInputImageListState extends State<RInputImageList> {
               setState(() {
                 _borderColor = Colors.grey;
                 _isSelected = false;
-                inputImageListInfo!.isSelected = false;
+                _inputImageListInfo!.isSelected = false;
               });
             } else {
               setState(() {
                 _borderColor = const Color.fromARGB(255, 64, 159, 248);
                 _isSelected = true;
-                inputImageListInfo!.isSelected = true;
+                _inputImageListInfo!.isSelected = true;
               });
             }
           },
@@ -136,28 +141,42 @@ class _RInputImageListState extends State<RInputImageList> {
 
   @override
   void dispose() {
-    inputImageListInfo!.onSelect!.dispose();
+    _inputImageListInfo!.onSelect!.dispose();
     super.dispose();
   }
 
+  void _addSelectImageListening() {
+    try {
+      _inputImageListInfo!.onSelectedChange.addListener((sender, e) {
+        setState(() {
+          _images = e;
+          _child = _getChild();
+        });
+      });
+    } catch (e) {
+      print(e);
+    }
+  }
+
   void _initDatas() {
     inputImageList = widget.inputImageList;
     _height = PtToPxConverter.ptToPx(inputImageList!.imageHeight) + 6;
     final element = ReportInfo.instance.getBlockElement(inputImageList!);
     if (element != null) {
-      inputImageListInfo = element as InputImageListInfo;
-      inputImageListInfo!.onSelect!.addListener((sender, e) {
+      _inputImageListInfo = element as InputImageListInfo;
+      _inputImageListInfo!.onSelect!.addListener((sender, e) {
         setState(() {
           if (_images.contains(e)) {
             _images.remove(e);
-            inputImageListInfo!.selectedImages.remove(e);
+            _inputImageListInfo!.selectedImages.remove(e);
           } else {
             _images.add(e);
-            inputImageListInfo!.selectedImages.add(e);
+            _inputImageListInfo!.selectedImages.add(e);
           }
           _child = _getChild();
         });
       });
+      _addSelectImageListening();
     }
   }
 }

lib/report_info/input_image_list_info.dart

@@ -8,15 +8,29 @@ import 'package:fis_lib_report/report_info/block_element_info_interface.dart';
 import 'package:fis_lib_report/report_info/element_info.dart';
 
 class InputImageListInfo extends ElementInfo implements IBlockElementInfo {
+  ///列数
   int? column;
 
+  ///是否有缝隙
   bool? hasGap;
 
+  ///是否制度表
   bool? isReadOnly;
 
+  ///当前是否处于选中状态
   bool? isSelected;
 
-  List<String> selectedImages = [];
+  ///已选图像集合
+  List<String> get selectedImages => _selectedImages;
+  set selectedImages(List<String> v) {
+    _selectedImages = v;
+    onSelectedChange.emit(this, v);
+  }
+
+  ///选中项改变通知UI变化
+  FEventHandler<List<String>> onSelectedChange = FEventHandler<List<String>>();
+
+  List<String> _selectedImages = [];
 
   FEventHandler<String>? onSelect = FEventHandler();
 

lib/report_info/report_info.dart

@@ -13,6 +13,7 @@ import 'package:fis_lib_report/report_info/report_base_info.dart';
 import 'package:fis_lib_report/report_info/report_event_args.dart';
 import 'package:fis_lib_report/report_info/rt_table_info.dart';
 import 'package:fis_lib_report/report_info/single_selected_info.dart';
+import 'package:flutter/cupertino.dart';
 
 class ReportInfo extends ReportBaseInfo {
   static ReportInfo? _reportInfo;
@@ -30,30 +31,19 @@ class ReportInfo extends ReportBaseInfo {
     List<dynamic> jsonBlocks = json['BlockInfos'];
     if (jsonBlocks.isNotEmpty) {
       for (var block in jsonBlocks) {
-        final type = block['ElementType'];
-        final jsonType = ElementType.fromJson(type);
-        final name = jsonType.name;
-        if (name == ElementType.paragraph.name) {
-          final paragraphInfo = block as Map<String, dynamic>;
-          _paragraphInfoFromJson(paragraphInfo);
-        } else if (name == ElementType.rtTable.name) {
-          final tableInfo = block as Map<String, dynamic>;
-          List<dynamic> jsonElements = tableInfo['Cells'];
-          int index = 0;
-          for (var map in jsonElements) {
-            //TODO(Loki):此处可优化Json的结构，无需区分奇偶
-            if (index.isOdd) {
-              final jsonType = map['ElementType'];
-              final type = ElementType.fromJson(jsonType);
-              if (type.name == ElementType.rtCell.name) {
-                final cellMap = map as Map<String, dynamic>;
-                final jsonBlocks = cellMap['Blocks'] as Map<String, dynamic>;
-                _paragraphInfoFromJson(jsonBlocks);
-              }
-            }
-            index++;
-          }
-        }
+        _blockElementInfoFromJson(block);
+      }
+    }
+    List<dynamic> jsonHeaders = json['HeadInfos'];
+    if (jsonHeaders.isNotEmpty) {
+      for (var block in jsonHeaders) {
+        _blockElementInfoFromJson(block);
+      }
+    }
+    List<dynamic> jsonFooters = json['FooterInfos'];
+    if (jsonFooters.isNotEmpty) {
+      for (var block in jsonFooters) {
+        _blockElementInfoFromJson(block);
       }
     }
   }
@@ -157,6 +147,43 @@ class ReportInfo extends ReportBaseInfo {
     return null;
   }
 
+  void _blockElementInfoFromJson(Map<String, dynamic> block) {
+    final type = block['ElementType'];
+    final jsonType = ElementType.fromJson(type);
+    final name = jsonType.name;
+    if (name == ElementType.paragraph.name) {
+      final paragraphInfo = block as Map<String, dynamic>;
+      _paragraphInfoFromJson(paragraphInfo);
+    } else if (name == ElementType.rtTable.name) {
+      final tableInfo = block as Map<String, dynamic>;
+      List<dynamic> jsonElements = tableInfo['Cells'];
+      int index = 0;
+      for (var map in jsonElements) {
+        //TODO(Loki):此处可优化Json的结构，无需区分奇偶
+        if (index.isOdd) {
+          final jsonType = map['ElementType'];
+          final type = ElementType.fromJson(jsonType);
+          if (type.name == ElementType.rtCell.name) {
+            final cellMap = map as Map<String, dynamic>;
+            final jsonBlocks = cellMap['Blocks'] as Map<String, dynamic>;
+            _paragraphInfoFromJson(jsonBlocks);
+          }
+        }
+        index++;
+      }
+    } else if (name == ElementType.imageList.name) {
+      final imageList = block as Map<String, dynamic>;
+      final id = imageList['Id'];
+      final imagesInfo = getElementInfoById(id) as InputImageListInfo;
+      final images = imageList['SelectedImages'];
+      List<String> targetImages = [];
+      for (var i in images) {
+        targetImages.add(i.toString());
+      }
+      imagesInfo.selectedImages = targetImages;
+    }
+  }
+
   void _paragraphInfoFromJson(Map<String, dynamic> paragraphInfo) {
     List<dynamic> jsonElements = paragraphInfo['ElementInfos'];
     if (jsonElements.isEmpty) {