flutter - 创建自定义文本表单域

Question

我正在尝试创建自定义 textformfield，这样我就可以轻松地只在一个地方设置样式。但目前我一直在研究如何通过验证和保存过程。有人可以给我一个我可以使用的自定义小部件 textformfield 的工作示例吗？我一直在寻找它一整天，但找不到。感谢您的帮助。

这里的例子是在凸起的按钮上:

import 'package:flutter/material.dart';
import 'package:wkndr/resources/constants.dart';

class CustomButton extends StatelessWidget {
  CustomButton({@required this.text, @required this.onPressed});

  final String text;
  final GestureTapCallback onPressed;

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      color: colorPrimary,
      child: Text(text, style: TextStyle(fontSize: 17.0, color: colorWhite)),
      onPressed: onPressed,
      shape: new RoundedRectangleBorder(
          borderRadius: new BorderRadius.circular(30.0)),
    );
  }
}

调用自定义凸起按钮:

final _signUpButton = Container(
      child: CustomButton(
          text: sign_up,
          onPressed: () {
            _signUp();
          }),
    );

Answer 1

您可以为样式制作通用的 InputDecoration，而不是制作自定义 textformfield

class CommonStyle{
  static InputDecoration textFieldStyle({String labelTextStr="",String hintTextStr=""}) {return InputDecoration(
    contentPadding: EdgeInsets.all(12),
    labelText: labelTextStr,
    hintText:hintTextStr,
    border: OutlineInputBorder(
      borderRadius: BorderRadius.circular(10),
    ),
  );}
}

例子:-

TextFormField(
        controller: usernameController,
        keyboardType: TextInputType.text,
        textInputAction: TextInputAction.next,
        focusNode: userFocus,
        onFieldSubmitted: (_) {
          FocusScope.of(context).requestFocus(passFocus);
        },
        validator: (value) => emptyValidation(value),
        decoration: CommonStyle.textFieldStyle(labelTextStr:"Username",hintTextStr:"Enter Username"),
      )