FormCheckbox<TValue> constructor
FormCheckbox<TValue> ({
- FormController<
TValue> ? form, - Key? key,
- FormStyle? style,
- TValue onSaved(
- bool value
- bool initialValue = false,
- bool enabled = true,
- void onChanged(
- bool value
- bool keepAlive = true,
- FocusNode? focusNode,
- bool autofocus = false,
- bool readOnly = false,
- String? labelText,
- Widget? labelWidget,
- FormAffixStyle? prefix,
- FormAffixStyle? suffix,
- FormFieldValidator<
bool> ? validator,
This widget is used to display a check box and save the check or not.
If labelText or labelWidget is specified, the checkbox is displayed with a label.
Only one of labelText and labelWidget should be specified.
Place under the Form that gave FormController.key, or pass FormController to form.
When FormController is passed to form, onSaved must also be passed together. The contents of onSaved will be used to save the data.
Enter the initial value given by FormController.value in initialValue.
Each time the content is changed, onChanged is executed.
When FormController.validate is executed, validation and data saving are performed.
If enabled is false, the checkbox is deactivated.
If readOnly is set to true, it will show enabled, but the value cannot be changed.
チェックボックスを表示して、チェックの有無を保存するためのウィジェットです。
labelTextもしくはlabelWidgetを指定するとラベル付きでチェックボックスが表示されます。
labelTextとlabelWidgetはどちらか一方のみを指定してください。
FormController.keyを与えたForm配下に配置、もしくはformにFormControllerを渡します。
formにFormControllerを渡した場合、一緒にonSavedも渡してください。データの保存はonSavedの内容が実行されます。
initialValueにFormController.valueから与えられた初期値を入力します。
内容が変更される度onChangedが実行されます。
FormController.validateが実行された場合、バリデーションとデータの保存を行ないます。
enabledがfalseになるとチェックボックスが非有効化されます。
readOnlyがtrueになっている場合は、有効化の表示になりますが、値が変更できなくなります。
Implementation
FormCheckbox({
this.form,
super.key,
FormStyle? style,
TValue Function(bool value)? onSaved,
bool super.initialValue = false,
super.enabled,
this.onChanged,
this.keepAlive = true,
FocusNode? focusNode,
bool autofocus = false,
bool readOnly = false,
String? labelText,
Widget? labelWidget,
FormAffixStyle? prefix,
FormAffixStyle? suffix,
super.validator,
}) : assert(
(form == null && onSaved == null) ||
(form != null && onSaved != null),
"Both are required when using [form] or [onSaved].",
),
assert(!(labelText != null && labelWidget != null),
"Please select either [labelText] or [labelWidget]."),
super(
onSaved: (val) {
if (val == null) {
return;
}
final res = onSaved?.call(val);
if (res == null) {
return;
}
form!.value = res;
},
builder: (field) {
final state = field as _FormCheckBoxState<TValue>;
final theme = Theme.of(field.context);
final mainTextStyle = style?.textStyle?.copyWith(
color: style.color,
) ??
TextStyle(
color: style?.color ?? theme.textTheme.titleMedium?.color,
);
final subTextStyle = style?.textStyle?.copyWith(
color: style.subColor,
) ??
TextStyle(
color: style?.subColor ??
style?.color?.withOpacity(0.5) ??
theme.textTheme.titleMedium?.color?.withOpacity(0.5),
);
final errorTextStyle = style?.errorTextStyle?.copyWith(
color: style.errorColor,
) ??
style?.textStyle?.copyWith(
color: style.errorColor,
) ??
TextStyle(
color: style?.errorColor ?? theme.colorScheme.error,
);
final disabledTextStyle = style?.textStyle?.copyWith(
color: style.disabledColor,
) ??
TextStyle(
color: style?.disabledColor ?? theme.disabledColor,
);
final border = BorderSide(
width: style?.borderWidth ?? kDefaultCheckboxBorderWidth,
color: style?.borderColor ??
style?.disabledBackgroundColor ??
theme.disabledColor,
);
InputBorder getBorderSide(Color borderColor) {
switch (style?.borderStyle) {
case FormInputBorderStyle.outline:
return OutlineInputBorder(
borderRadius: style?.borderRadius ??
const BorderRadius.all(Radius.circular(4.0)),
borderSide: BorderSide(
color: borderColor,
width: style?.borderWidth ?? 1.0,
),
);
case FormInputBorderStyle.underline:
return UnderlineInputBorder(
borderSide: BorderSide(
color: style?.borderColor ?? theme.dividerColor,
width: style?.borderWidth ?? 1.0,
),
borderRadius: style?.borderRadius ??
const BorderRadius.only(
topLeft: Radius.circular(4.0),
topRight: Radius.circular(4.0),
),
);
default:
return const OutlineInputBorder(
borderSide: BorderSide.none,
);
}
}
final borderSide =
getBorderSide(style?.borderColor ?? theme.dividerColor);
final errorBorderSide =
getBorderSide(style?.errorColor ?? theme.colorScheme.error);
final disabledBorderSide =
getBorderSide(style?.disabledColor ?? theme.disabledColor);
final checkbox = Checkbox(
value: field.value ?? false,
tristate: false,
onChanged:
enabled && !readOnly ? (val) => field.didChange(val) : null,
fillColor: WidgetStateProperty.resolveWith((states) {
if (!readOnly && states.contains(WidgetState.disabled)) {
return style?.disabledBackgroundColor ?? theme.disabledColor;
}
if (states.contains(WidgetState.selected)) {
return style?.activeBackgroundColor ??
theme.colorScheme.primary;
}
return style?.backgroundColor ??
theme.checkboxTheme.fillColor?.resolve(states);
}),
checkColor: enabled
? (style?.activeColor ?? theme.colorScheme.onPrimary)
: style?.disabledColor,
side: enabled
? style?.border?.borderSide ?? border
: style?.disabledBorder?.borderSide ?? border,
focusNode: focusNode,
autofocus: autofocus,
shape: style?.shape,
);
if (labelText == null && labelWidget == null) {
return checkbox;
}
return MouseRegion(
cursor: enabled == false
? SystemMouseCursors.forbidden
: SystemMouseCursors.click,
child: InputDecorator(
baseStyle: style?.textStyle,
textAlign: style?.textAlign,
textAlignVertical: style?.textAlignVertical,
decoration: InputDecoration(
contentPadding: style?.contentPadding ??
const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
fillColor: style?.backgroundColor,
filled: style?.backgroundColor != null,
isDense: true,
border: style?.border ?? borderSide,
enabledBorder: style?.border ?? borderSide,
disabledBorder: style?.disabledBorder ??
style?.border ??
disabledBorderSide,
errorBorder:
style?.errorBorder ?? style?.border ?? errorBorderSide,
focusedBorder: style?.border ?? borderSide,
focusedErrorBorder:
style?.errorBorder ?? style?.border ?? errorBorderSide,
prefix: prefix?.child ?? style?.prefix?.child,
suffix: suffix?.child ?? style?.suffix?.child,
prefixIcon: prefix?.icon ?? style?.prefix?.icon,
suffixIcon: suffix?.icon ?? style?.suffix?.icon,
prefixText: prefix?.label ?? style?.prefix?.label,
suffixText: suffix?.label ?? style?.suffix?.label,
prefixIconColor:
prefix?.iconColor ?? style?.prefix?.iconColor,
suffixIconColor:
suffix?.iconColor ?? style?.suffix?.iconColor,
prefixIconConstraints:
prefix?.iconConstraints ?? style?.prefix?.iconConstraints,
suffixIconConstraints:
suffix?.iconConstraints ?? style?.suffix?.iconConstraints,
labelStyle: enabled ? mainTextStyle : disabledTextStyle,
hintStyle: subTextStyle,
suffixStyle: subTextStyle,
prefixStyle: subTextStyle,
counterStyle: subTextStyle,
helperStyle: subTextStyle,
errorStyle: errorTextStyle,
),
child: Row(
children: [
checkbox,
Expanded(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
labelWidget ??
Text(
labelText!,
style: style?.textStyle,
),
if (state.errorText.isNotEmpty)
Text(
state.errorText!,
style: errorTextStyle,
),
],
),
),
],
),
),
);
},
);