我有以下小部件:
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
class BirthdayWidget extends StatefulWidget {
final DateTime birthday;
final ValueChanged<DateTime> onChangedBirthday;
const BirthdayWidget({
Key key,
@required this.birthday,
@required this.onChangedBirthday,
}) : super(key: key);
@override
_BirthdayWidgetState createState() => _BirthdayWidgetState();
}
class _BirthdayWidgetState extends State<BirthdayWidget> {
final controller = TextEditingController();
final focusNode = FocusNode();
@override
void initState() {
super.initState();
setDate();
}
@override
void didUpdateWidget(covariant BirthdayWidget oldWidget) {
super.didUpdateWidget(oldWidget);
setDate();
}
void setDate() => setState(() {
controller.text = widget.birthday == null
? ''
: DateFormat.yMd().format(widget.birthday);
});
@override
Widget build(BuildContext context) => FocusBuilder(
onChangeVisibility: (isVisible) {
if (isVisible) {
selectDate(context);
//
} else {
FocusScope.of(context).requestFocus(FocusNode());
}
},
focusNode: focusNode,
builder: (hasFocus) => TextFormField(
controller: controller,
validator: (value) => value.isEmpty ? 'Is Required' : null,
decoration: InputDecoration(
prefixText: ' ',
hintText: 'Your birthday',
prefixIcon: Icon(Icons.calendar_today_rounded),
border: OutlineInputBorder(),
),
),
);
Future selectDate(BuildContext context) async {
final birthday = await showDatePicker(
context: context,
initialDate: widget.birthday ?? DateTime.now(),
firstDate: DateTime(1950),
lastDate: DateTime(2100),
);
if (birthday == null) return;
widget.onChangedBirthday(birthday);
}
}
class FocusBuilder extends StatefulWidget {
final FocusNode focusNode;
final Widget Function(bool hasFocus) builder;
final ValueChanged<bool> onChangeVisibility;
const FocusBuilder({
@required this.focusNode,
@required this.builder,
@required this.onChangeVisibility,
Key key,
}) : super(key: key);
@override
_FocusBuilderState createState() => _FocusBuilderState();
}
class _FocusBuilderState extends State<FocusBuilder> {
@override
Widget build(BuildContext context) => GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () => widget.onChangeVisibility(true),
child: Focus(
focusNode: widget.focusNode,
onFocusChange: widget.onChangeVisibility,
child: widget.builder(widget.focusNode.hasFocus),
),
);
}
我通过下面的代码调用这个小部件,因为我在特定屏幕中调用它Widget buildBirthday() => BirthdayWidget(
birthday: user.dateOfBirth,
onChangedBirthday: (dateOfBirth) =>
setState(() => user = user.copy(dateOfBirth: dateOfBirth)),
);
例如,如果年龄低于 18 岁,我想隐藏下面的小部件:CustomTextFormField(
onChanged: (passNo) => setState(
() => user = user.copy(passportNumber: passNo),
),
userValue: user.passportNumber,
userFLName: 'Passport Number',
keyBoardType: TextInputType.number,
),
我希望这足够清楚:)。
最佳答案
将要隐藏的小部件包裹在 Visibility()
中小部件并设置 visible
值到 age>=18
Visibility(
visible: (DateTime.now().difference(birthday).inDays/365)>=18,
child: CustomTextFormField(
onChanged: (passNo) => setState(
() => user = user.copy(passportNumber: passNo),
),
userValue: user.passportNumber,
userFLName: 'Passport Number',
keyBoardType: TextInputType.number,
),
),
OP 的建议答案:已编辑
所以我发现它可以与我完成的 Visibility Widget 一起使用,如下代码所示:
if ((DateTime.now().difference(user.dateOfBirth).inDays / 365) >=
18)
CustomTextFormField(
validation: (value) {
if (value.isEmpty) {
return 'Please enter Passport Number';
}
return null;
},
onChanged: (passNo) => setState(
() => user = user.copy(passportNumber: passNo),
),
userValue: user.passportNumber,
userFLName: 'Passport Number',
keyBoardType: TextInputType.number,
),
关于flutter - 如何根据日历中的选择在 18 岁以下时隐藏小部件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66677964/