时间戳

首页 > 解决方案 > 右侧的TextFormfield

flutter - 右侧的TextFormfield

问题描述

class VitalWidget extends StatelessWidget {
  VitalWidget({
    this.vitalType,
    this.unit,
    this.initialValue,
    Key key,
  }) : super(key: key);
  final String vitalType;
  final String unit;
  final String initialValue;
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Row(
          children: [
            Padding(
              padding: const EdgeInsets.only(left: 40),
              child: Text(
                vitalType,
                style: TextStyle(fontSize: 15),
              ),
            ),
            Row(
              children: [
                SizedBox(
                  width: 90,
                  child: Align(
                    alignment: Alignment.centerRight,
                    child: TextFormField(
                      initialValue: initialValue,
                      textAlign: TextAlign.center,
                      inputFormatters: [FilteringTextInputFormatter.digitsOnly],
                      decoration: const InputDecoration(),
                    ),
                  ),
                ),
                Text(unit),
              ],
            ),
          ],
        ),
      ],
    );
  }
}

我知道这不是一件难事，但我已经坚持了一段时间。有没有办法在屏幕右侧制作 textformfield 和 text(unit) ？我尝试使用填充，但它们彼此不一致，并且在不同的屏幕上看起来很奇怪。它很简单，但我无法弄清楚

标签： flutterdart

解决方案

您可以简单地Spacer在Row小部件中使用。实际上，Spacer它占用了屏幕上的所有可用空间。你可以这样做：

class VitalWidget extends StatelessWidget {
  VitalWidget({
    this.vitalType,
    this.unit,
    this.initialValue,
    Key key,
  }) : super(key: key);
  final String vitalType;
  final String unit;
  final String initialValue;
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Row(
          children: [
            Spacer(),    //It will take all the available space on the left
            Padding(
              padding: const EdgeInsets.only(left: 40),
              child: Text(
                vitalType,
                style: TextStyle(fontSize: 15),
              ),
            ),
            Row(
              children: [
                SizedBox(
                  width: 90,
                  child: Align(
                    alignment: Alignment.centerRight,
                    child: TextFormField(
                      initialValue: initialValue,
                      textAlign: TextAlign.center,
                      inputFormatters: [FilteringTextInputFormatter.digitsOnly],
                      decoration: const InputDecoration(),
                    ),
                  ),
                ),
                Text(unit),
              ],
            ),
          ],
        ),
      ],
    );
  }
}

推荐阅读