2024-04-09 16:32:18 +08:00
|
|
|
import 'package:flutter/material.dart';
|
|
|
|
import 'package:get/get.dart';
|
|
|
|
import 'package:sk_base_mobile/app_theme.dart';
|
|
|
|
import 'package:sk_base_mobile/util/screen_adaper_util.dart';
|
2024-04-10 11:04:27 +08:00
|
|
|
import 'package:sk_base_mobile/widgets/common/multi-picker/multiselect_dropdown.dart';
|
|
|
|
import 'package:sk_base_mobile/widgets/form_item/sk_form_item.dart';
|
|
|
|
import 'package:sk_base_mobile/widgets/form_item/sk_base_field.dart';
|
2024-04-09 16:32:18 +08:00
|
|
|
|
|
|
|
class SkMultiPickerDropdown<T> extends SkBaseFieldWidget {
|
|
|
|
final Function(FocusNode)? onTap;
|
|
|
|
final bool isRequired;
|
|
|
|
final String? hint;
|
|
|
|
final bool isTextArea;
|
|
|
|
final bool isDense;
|
|
|
|
final Function(String)? onTapOutside;
|
|
|
|
final Function(String)? onChanged;
|
|
|
|
final String? Function(String?)? validator;
|
|
|
|
final EdgeInsetsGeometry? contentPadding;
|
2024-04-10 11:04:27 +08:00
|
|
|
final void Function(List<ValueItem<T>>)? onOptionSelected;
|
2024-04-09 16:32:18 +08:00
|
|
|
final Icon? prefix;
|
|
|
|
final Widget? suffixIcon;
|
|
|
|
final InputBorder? border;
|
2024-04-10 11:04:27 +08:00
|
|
|
final List<ValueItem<T>>? options;
|
|
|
|
final List<ValueItem<T>>? selectedOptions;
|
|
|
|
final MultiSelectController<T> multiSelectController =
|
|
|
|
MultiSelectController<T>();
|
2024-04-09 16:32:18 +08:00
|
|
|
SkMultiPickerDropdown(
|
|
|
|
{super.key,
|
|
|
|
super.customLabel = false,
|
|
|
|
super.autoFocus = false,
|
2024-04-10 11:04:27 +08:00
|
|
|
super.labelText,
|
|
|
|
this.options,
|
|
|
|
this.selectedOptions,
|
2024-04-09 16:32:18 +08:00
|
|
|
this.onTap,
|
2024-04-10 11:04:27 +08:00
|
|
|
this.onOptionSelected,
|
2024-04-09 16:32:18 +08:00
|
|
|
this.hint,
|
|
|
|
this.isRequired = false,
|
|
|
|
this.onTapOutside,
|
|
|
|
this.prefix,
|
|
|
|
this.suffixIcon,
|
|
|
|
this.onChanged,
|
|
|
|
this.border,
|
|
|
|
this.isTextArea = false,
|
|
|
|
this.contentPadding,
|
|
|
|
this.isDense = false,
|
|
|
|
this.validator});
|
|
|
|
|
|
|
|
@override
|
|
|
|
Widget build(BuildContext context) {
|
|
|
|
return SkFormItem(
|
2024-04-10 11:04:27 +08:00
|
|
|
customLabel: customLabel,
|
|
|
|
labelText: labelText,
|
|
|
|
isRequired: isRequired,
|
|
|
|
controller: baseFieldController,
|
|
|
|
child: MultiSelectDropDown<T>(
|
|
|
|
controller: multiSelectController,
|
|
|
|
focusNode: focusNode,
|
|
|
|
selectedOptions: selectedOptions ?? [],
|
|
|
|
dropdownHeight: ScreenAdaper.height(300),
|
|
|
|
onOptionSelected: onOptionSelected,
|
|
|
|
options: options ?? <ValueItem<T>>[],
|
|
|
|
borderColor: AppTheme.nearlyBlack,
|
|
|
|
fieldBackgroundColor: fillColor,
|
|
|
|
borderWidth: 1,
|
|
|
|
borderRadius: ScreenAdaper.sp(15),
|
|
|
|
focusedBorderWidth: 2,
|
|
|
|
focusedBorderColor: AppTheme.primaryColorLight,
|
|
|
|
hint: '请选择',
|
|
|
|
hintStyle: Theme.of(Get.context!).inputDecorationTheme.hintStyle,
|
|
|
|
hintPadding: EdgeInsets.symmetric(horizontal: ScreenAdaper.width(5)),
|
|
|
|
selectionType: SelectionType.multi,
|
|
|
|
chipConfig: ChipConfig(
|
|
|
|
wrapType: WrapType.scroll,
|
|
|
|
labelStyle: TextStyle(
|
|
|
|
fontSize: ScreenAdaper.height(26), color: AppTheme.white),
|
|
|
|
backgroundColor: AppTheme.primaryColor,
|
2024-04-09 16:32:18 +08:00
|
|
|
),
|
2024-04-10 11:04:27 +08:00
|
|
|
optionTextStyle: TextStyle(fontSize: ScreenAdaper.height(26)),
|
|
|
|
selectedOptionIcon: const Icon(Icons.check_circle),
|
|
|
|
),
|
|
|
|
);
|
2024-04-09 16:32:18 +08:00
|
|
|
|
|
|
|
// return DropdownButtonFormField<String>(
|
|
|
|
// focusNode: focusNode,
|
|
|
|
// onTap: () {
|
|
|
|
// if (widget.onTap != null) {
|
|
|
|
// widget.onTap!(focusNode);
|
|
|
|
// }
|
|
|
|
// },
|
|
|
|
// icon: Icon(Icons.arrow_drop_down),
|
|
|
|
// selectedItemBuilder: (context) => [
|
|
|
|
// Container(
|
|
|
|
// width: ScreenAdaper.width(200),
|
|
|
|
// child: SingleChildScrollView(
|
|
|
|
// scrollDirection: Axis.horizontal,
|
|
|
|
// child: Row(mainAxisSize: MainAxisSize.min, children: [
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// SkTag(text: '角色', color: AppTheme.primaryColor),
|
|
|
|
// ]),
|
|
|
|
// ),
|
|
|
|
// )
|
|
|
|
// ],
|
|
|
|
// autovalidateMode: AutovalidateMode.onUserInteraction,
|
|
|
|
// decoration: InputDecoration(
|
|
|
|
// prefixIcon: widget.prefix,
|
|
|
|
// errorStyle: const TextStyle(fontSize: 0, height: 0.01),
|
|
|
|
// contentPadding: widget.contentPadding,
|
|
|
|
// isDense: widget.isDense,
|
|
|
|
// border: widget.border,
|
|
|
|
// floatingLabelBehavior: widget.floatingLabelBehavior,
|
|
|
|
// label: widget.labelText != null
|
|
|
|
// ? Row(
|
|
|
|
// crossAxisAlignment: CrossAxisAlignment.center,
|
|
|
|
// mainAxisSize: MainAxisSize.min,
|
|
|
|
// children: [
|
|
|
|
// if (widget.isRequired)
|
|
|
|
// Text(
|
|
|
|
// "*",
|
|
|
|
// style: TextStyle(
|
|
|
|
// color: Colors.red,
|
|
|
|
// fontSize: ScreenAdaper.height(30)),
|
|
|
|
// ),
|
|
|
|
// Text(
|
|
|
|
// widget.labelText!,
|
|
|
|
// style: TextStyle(fontSize: ScreenAdaper.height(30)),
|
|
|
|
// ),
|
|
|
|
// ])
|
|
|
|
// : null,
|
|
|
|
// focusedBorder: OutlineInputBorder(
|
|
|
|
// borderSide:
|
|
|
|
// const BorderSide(color: AppTheme.primaryColorLight, width: 2),
|
|
|
|
// borderRadius: BorderRadius.circular(ScreenAdaper.sp(15))),
|
|
|
|
// hintText: widget.hint ?? '请输入',
|
|
|
|
// ),
|
|
|
|
// items: [],
|
|
|
|
// onChanged: (Object? value) {},
|
|
|
|
// );
|
|
|
|
}
|
|
|
|
}
|