flutter转换类中的文本字段代码和无状态小部件的构造函数

Question

我是个新手。我想在中转换文本字段小部件类，如下语法所示。

类MyTextField扩展StatelessWidget｛

用于以下代码。提前感谢

TextField(
style: TextStyle(fontSize: 40),
decoration: InputDecoration(
hintText: "enter email",
fillColor: Colors.white24,
filled: true,
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: BorderSide(
color: Colors.blue,
style: BorderStyle.solid,
width: 4)),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: BorderSide(
color: Colors.white,
style: BorderStyle.solid,
width: 4)),
)),

Answer 1

我不确定你想做什么，但如果我理解你的问题，你想把默认的MaterialTextField放入你自己的自定义小部件MyTextField中。您可以将现有代码放入MyTextField的build方法中，如下所示：

class MyTextField extends StatelessWidget {
@override
Widget build(BuildContext context) {
return TextField(
style: TextStyle(fontSize: 40),
decoration: InputDecoration(
hintText: "enter email",
fillColor: Colors.white24,
filled: true,
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: BorderSide(
color: Colors.blue, style: BorderStyle.solid, width: 4)),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: BorderSide(
color: Colors.white, style: BorderStyle.solid, width: 4)),
),
);
}
}

如果你想为提示文本添加参数，比如一个可更改的值，你可以这样做：

class MyTextField extends StatelessWidget {
final String hint;
final InputBorder enabledBorder;
MyTextField({this.hint, this.enabledBorder});

@override
Widget build(BuildContext context) {
return TextField(
style: TextStyle(fontSize: 40),
decoration: InputDecoration(
hintText: hint,
fillColor: Colors.white24,
filled: true,
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: BorderSide(
color: Colors.blue, style: BorderStyle.solid, width: 4)),
enabledBorder: enabledBorder,
);
}
}

然后你可以使用小部件，比如：

MyTextField(
hint: "enter email",
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: BorderSide(
color: Colors.white,
style: BorderStyle.solid,
width: 4,
),
),
);