【问题标题】:TextField suffix animation alignmentTextField后缀动画对齐
【发布时间】:2021-05-04 22:08:30
【问题描述】:

有人遇到过类似的问题吗? TextField sufixIcon 采用这样的小部件:

TextField(
  decoration: new InputDecoration(
    suffixIcon: Icon(Icons.ac_unit),
  ),
),

代码结果

现在我想要同样的东西,但加载动画:

TextField(
  decoration: new InputDecoration(
    suffixIcon: Container(
    child: SpinKitWave(
      color: Colors.red,
      size: 20.0,
    ),
),

带有动画的代码结果

如果我将 suffixIcon 更改为 sufix,也会发生同样的情况。

问题: 像图标一样右对齐,我尝试使用 Horizo​​ntalAlignment 似乎不起作用。

【问题讨论】:

    标签: flutter textfield suffix


    【解决方案1】:

    以下是如何将加载动画对齐到TextField 的右侧:

    @override
      Widget build(BuildContext context) {
        double width = MediaQuery.of(context).size.width;
        double height = MediaQuery.of(context).size.height;
        return SafeArea(
          child: Scaffold(
            body: Center(
              child: Container(
                padding: EdgeInsets.symmetric(horizontal: width * 0.025),
                child: TextField(
                  decoration: InputDecoration(
                    border: OutlineInputBorder(
                      borderRadius: const BorderRadius.all(
                        const Radius.circular(60),
                      ),
                    ),
                    filled: true,
                    fillColor: const Color(0xFFE3F8F8),
                    suffixIcon: Container(
                      width: width * 0.2,
                      height: width * 0.1,
                      child: SpinKitWave(
                        color: Colors.red,
                        size: 20.0,
                      ),
                    ),
                    prefixIcon: Icon(
                      Icons.search,
                      color: const Color(0x99000000),
                    ),
                  ),
                ),
              ),
            ),
          ),
        );
      }
    

    输出:

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-05-13
      • 2018-07-27
      • 1970-01-01
      • 2020-03-27
      • 2021-09-06
      • 1970-01-01
      • 2020-04-08
      • 2021-02-11
      相关资源
      最近更新 更多