huifuwu-app/wisdom_cli/lib/new/widgets/multiple_picker_field.dart

/*
 * @Author: XianKaiQun
 * @Date: 2020-08-25 14:59:08
 * @LastEditors  : WuWei
 * @LastEditTime : 2023-05-10 14:49:22
 * @Description: 
 */
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:wisdom_cli/wisdom_cli.dart';

typedef WMultiplePickerFieldBuilder<T> = Widget Function(
  List<T>? value,
  Future<void> Function() trigger,
);

typedef WMultiplePickerFieldOnChanged<T> = void Function(List<T>? value);

///减少逻辑代码的单选组件
class WMultiplePickerField<T extends WPickerEntity> extends StatefulWidget {
  WMultiplePickerField({
    Key? key,
    required this.getData,
    required this.builder,
    this.title,
    this.value,
    this.onChanged,
  }) : super(key: key);
  final WMultiplePickerFieldBuilder<T> builder;
  final Widget? title;
  final WSinglePickerGetData<T> getData;
  final List<T>? value;
  final WMultiplePickerFieldOnChanged<T>? onChanged;
  @override
  _WMultiplePickerFieldState<T> createState() =>
      _WMultiplePickerFieldState<T>();
}

class _WMultiplePickerFieldState<T extends WPickerEntity>
    extends State<WMultiplePickerField<T>> {
  List<T>? _value;

  List<T>? get value => _value;

  @override
  void initState() {
    super.initState();
    _value = List.of(widget.value ?? []);
  }

  ///触发单选弹出层
  Future<void> _trigger() async {
    final res = await WPickerUtil.multiple<T>(
      context,
      title: widget.title,
      getData: widget.getData,
      initialValue: _value,
    );
    if (res != null) {
      _onChanged(res);
    }
  }

  ///触发[widget.onChanged],
  ///刷新视图[widget.builder]
  void _onChanged(List<T> value) {
    if (_value == value) return;
    _value = value;
    setState(() {});
    if (widget.onChanged != null) {
      widget.onChanged!(value);
    }
  }

  @override
  Widget build(BuildContext context) {
    return widget.builder(value, () => _trigger());
  }
}

///picker表单
class WMultiplePickerFormField<T extends WPickerEntity>
    extends WFormField<List<T>> {
  WMultiplePickerFormField({
    Key? key,
    required WMultiplePickerFieldBuilder<T> builder,
    required WSinglePickerGetData<T> getData,
    required this.field,
    Widget? title,
    this.onChanged,
    FormFieldSetter<List<T>>? onSaved,
    FormFieldValidator<List<T>>? validator,
    AutovalidateMode? autovalidateMode,
    bool enabled = true,
  }) : super(
          key: key,
          field: field,
          onSaved: onSaved,
          validator: validator,
          autovalidateMode: autovalidateMode,
          enabled: enabled,
          builder: (WFormFieldState<List<T>> fieldState) {
            final _fieldState = fieldState as _WMultiplePickerFormFieldState<T>;
            return WMultiplePickerField(
              title: title,
              value: _fieldState.value,
              getData: getData,
              builder: builder,
              onChanged: (value) {
                _fieldState.didChange(value as List<T>?);
              },
            );
          },
        );

  ///直接使用[textField]进行builder
  ///[buildName] 构造要显示的名称
  WMultiplePickerFormField.textField({
    Key? key,
    required String Function(List<T>? value) buildName,
    required WSinglePickerGetData<T> getData,
    required this.field,
    Widget? title,
    T? value,
    this.onChanged,
    TextEditingController? controller,
    FormFieldSetter<List<T>>? onSaved,
    FormFieldValidator<List<T>>? validator,
    AutovalidateMode? autovalidateMode,
    bool enabled = true,
    FocusNode? focusNode,
    InputDecoration? decoration,
    TextInputType? keyboardType,
    TextCapitalization textCapitalization = TextCapitalization.none,
    TextInputAction? textInputAction,
    TextStyle? style,
    StrutStyle? strutStyle,
    TextDirection? textDirection,
    TextAlign textAlign = TextAlign.start,
    TextAlignVertical? textAlignVertical,
    bool autofocus = false,
    // bool readOnly = false,
    ToolbarOptions? toolbarOptions,
    bool? showCursor,
    String obscuringCharacter = '•',
    bool obscureText = false,
    bool autocorrect = true,
    SmartDashesType? smartDashesType,
    SmartQuotesType? smartQuotesType,
    bool enableSuggestions = true,
    MaxLengthEnforcement maxLengthEnforcement = MaxLengthEnforcement.enforced,
    int? maxLines = 1,
    int? minLines,
    bool expands = false,
    int? maxLength,
    // GestureTapCallback onTap,
    VoidCallback? onEditingComplete,
    ValueChanged<String>? onFieldSubmitted,
    List<TextInputFormatter>? inputFormatters,
    double cursorWidth = 2.0,
    Radius? cursorRadius,
    Color? cursorColor,
    Brightness? keyboardAppearance,
    EdgeInsets scrollPadding = const EdgeInsets.all(20.0),
    bool enableInteractiveSelection = true,
    InputCounterWidgetBuilder? buildCounter,
    ScrollPhysics? scrollPhysics,
    Iterable<String>? autofillHints,
  }) : super(
          key: key,
          field: field,
          onSaved: onSaved,
          validator: validator,
          autovalidateMode: autovalidateMode,
          enabled: enabled,
          builder: (WFormFieldState<List<T>> fieldState) {
            final state = fieldState as _WMultiplePickerFormFieldState<T>;
            //主题
            InputDecoration _decoration = decoration ?? InputDecoration();
            _decoration = _decoration.applyDefaults(
              Theme.of(state.context).inputDecorationTheme,
            );
            _decoration = _decoration.copyWith(
              suffixIconConstraints:
                  _decoration.suffixIconConstraints ?? const BoxConstraints(),
              suffixIcon: _decoration.suffixIcon ??
                  Icon(
                    Icons.chevron_right,
                    color: Colors.black38,
                  ),
              errorText: state.errorText,
            );
            final _controller = controller ?? TextEditingController();
            _controller.value = _controller.value.copyWith(
              text: buildName(state.value),
            );
            return WMultiplePickerField(
              title: title,
              value: state.value,
              getData: getData,
              onChanged: (value) => state.didChange(value as List<T>?),
              builder: (value, trigger) {
                return TextField(
                  controller: _controller,
                  focusNode: focusNode,
                  decoration: _decoration,
                  keyboardType: keyboardType,
                  textInputAction: textInputAction,
                  style: style,
                  strutStyle: strutStyle,
                  textAlign: textAlign,
                  textAlignVertical: textAlignVertical,
                  textDirection: textDirection,
                  textCapitalization: textCapitalization,
                  autofocus: autofocus,
                  toolbarOptions: toolbarOptions,
                  readOnly: true,
                  showCursor: showCursor,
                  obscuringCharacter: obscuringCharacter,
                  obscureText: obscureText,
                  autocorrect: autocorrect,
                  smartDashesType: smartDashesType ??
                      (obscureText
                          ? SmartDashesType.disabled
                          : SmartDashesType.enabled),
                  smartQuotesType: smartQuotesType ??
                      (obscureText
                          ? SmartQuotesType.disabled
                          : SmartQuotesType.enabled),
                  enableSuggestions: enableSuggestions,
                  maxLengthEnforcement: maxLengthEnforcement,
                  maxLines: maxLines,
                  minLines: minLines,
                  expands: expands,
                  maxLength: maxLength,
                  // onChanged: onChangedHandler,
                  onTap: () => trigger(),
                  onEditingComplete: onEditingComplete,
                  onSubmitted: onFieldSubmitted,
                  inputFormatters: inputFormatters,
                  enabled: enabled,
                  cursorWidth: cursorWidth,
                  cursorRadius: cursorRadius,
                  cursorColor: cursorColor,
                  scrollPadding: scrollPadding,
                  scrollPhysics: scrollPhysics,
                  keyboardAppearance: keyboardAppearance,
                  enableInteractiveSelection: enableInteractiveSelection,
                  buildCounter: buildCounter,
                  autofillHints: autofillHints,
                );
              },
            );
          },
        );

  final String field;

  final WMultiplePickerFieldOnChanged<T>? onChanged;

  @override
  _WMultiplePickerFormFieldState<T> createState() =>
      _WMultiplePickerFormFieldState<T>();
}

class _WMultiplePickerFormFieldState<T extends WPickerEntity>
    extends WFormFieldState<List<T>> {
  @override
  WMultiplePickerFormField<T> get widget =>
      super.widget as WMultiplePickerFormField<T>;

  @override
  void didChange(List<T>? value) {
    super.didChange(value);
    if (widget.onChanged != null) {
      widget.onChanged!(value);
    }
  }
}