flutter - 主题中的 Flutter 表单标签样式需要在字段有内容和没有内容时具有相同的大小

Question

我试图解决以下问题：

标签太大：

当字段有内容时 - 标签大小还可以，但底部需要一些填充：

我需要在主题级别解决，因为它适用于整个应用程序。我想让两个标签文本状态都具有相同的字体大小，并添加一些填充（contentPadding 不起作用）

有解决方案吗？

                    child: FormBuilderTextField(
                      name: 'age',
                      // initialValue: widget.mom.age,
                      decoration: InputDecoration(
                        labelText: ('Age'),
                      ),
                      // valueTransformer: (text) => num.tryParse(text),
                      onChanged: (value) => widget.mom.age = value.toString(),
                      validator: FormBuilderValidators.compose([
                        FormBuilderValidators.numeric(context),
                        FormBuilderValidators.max(context, 70),
                      ]),
                      keyboardType: TextInputType.number,
                    ),
                  ),```

Answer 1

最后我找到了参数：floatingLabelBehavior 并更新了主题。这解决了这个问题，不显示输入字段内的标签，但总是在外面。

                fillColor: Colors.white,
                filled: true,
                floatingLabelBehavior: FloatingLabelBehavior.always,```

Answer 2

我认为使用标签和文本字段的焦点节点和样式属性可以达到您想要的结果

import 'package:flutter/material.dart';

const Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        scaffoldBackgroundColor: darkBlue,
      ),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatefulWidget {
  @override
  _MyWidget createState() => _MyWidget();
}

class _MyWidget extends State<MyWidget> {
  
  String text = "";
  FocusNode focus = FocusNode();
  TextEditingController _controller = TextEditingController();
  

  @override
  Widget build(BuildContext context) {
    return TextFormField(
        controller: _controller,
        onTap: (){
          FocusScope.of(context).requestFocus(focus);
        },
        focusNode: focus,
        style: const TextStyle(
            fontSize: 14,height: 1.6
          ),
        decoration: InputDecoration(
            labelText: 'Add task...',
          labelStyle: TextStyle(
            fontSize: focus.hasFocus || _controller.text.length >= 1 ? 19 : 14,
            fontWeight: focus.hasFocus ? FontWeight.bold : FontWeight.normal
          )
            ),
        keyboardType: TextInputType.text,
      );
  }
}