在Flutter中,可以使用TextField小部件来创建必填表单文本字段。下面是一个简单的代码示例,演示如何在Flutter中创建一个必填的邮件文本字段:
import 'package:flutter/material.dart';
class MailerForm extends StatefulWidget {
@override
_MailerFormState createState() => _MailerFormState();
}
class _MailerFormState extends State {
final _formKey = GlobalKey();
String _email = '';
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Mailer Form'),
),
body: Padding(
padding: EdgeInsets.all(16.0),
child: Form(
key: _formKey,
child: Column(
children: [
TextFormField(
decoration: InputDecoration(
labelText: 'Email',
),
validator: (value) {
if (value.isEmpty) {
return 'Please enter your email';
}
return null;
},
onSaved: (value) {
_email = value;
},
),
SizedBox(height: 16.0),
RaisedButton(
onPressed: () {
if (_formKey.currentState.validate()) {
_formKey.currentState.save();
// 提交表单数据
sendEmail(_email);
}
},
child: Text('Submit'),
),
],
),
),
),
);
}
void sendEmail(String email) {
// 此处是发送邮件的逻辑
print('Sending email to $email');
// 发送邮件的代码
}
}
void main() {
runApp(MaterialApp(
home: MailerForm(),
));
}
在上面的示例中,我们使用了TextField
小部件来创建邮件文本字段。字段的validator
属性用于验证文本字段是否为空。如果为空,它将返回一个错误消息。onSaved
属性用于在提交表单时将文本字段的值保存到_email
变量中。
在点击提交按钮时,我们首先调用_formKey.currentState.validate()
来验证表单字段。如果验证通过,我们再调用_formKey.currentState.save()
来保存表单数据,并调用sendEmail
函数将邮件发送给指定的邮件地址。
这是一个基本的示例,你可以根据自己的需求进行调整和扩展。