flutter - 使用 TextField 和 DropdownButton 了解 Jank 发生的 AlertDialog

Question

我有带有 TextField 和 DropDownButton 的 AlertDilaog。

问题：

一旦我启动对话框并单击文本字段，警报对话框就会向上移动，并且文本字段中的标签动画就会发生。但是在发生这种情况时，我看到了卡顿。 我做了分析，但我仍在试图了解它发生的原因。

这是屏幕截图

这是分析文件：https ://filebin.net/7wulbm9j88m6jjt3

谁能帮助我理解这个 VsyncProcessCallback 是什么以及选定部分（括号）中发生的任何事情？

我只是想找到 Jank 的根本原因并将其删除。

先感谢您。

文本字段代码：

Widget _addProtocolTextField(BuildContext context) {
    return Container(
      height: 7.h,
      width: 70.w,
      child: TextField(
        controller: _protocolNameController,
        style: TextStyle(
          color: Theme.of(context).textColor,
          fontSize: 13.sp,
        ),
        textAlign: TextAlign.left,
        maxLines: 1,
        decoration: InputDecoration(
          labelText: Strings.protocol_name_lable,
          labelStyle: TextStyle(color: ColorConstants.primaryColor),
          enabledBorder: _getBorder(),
          disabledBorder: _getBorder(),
          focusedBorder: _getBorder(),
          border: _getBorder(),
        ),
      ),
    );
  }

  OutlineInputBorder _getBorder() {
    return OutlineInputBorder(
      borderSide: BorderSide(color: ColorConstants.primaryColor),
    );
  }

Answer 1

由于这么多代码不足以提供真正的解决方案，您可以参考以下提示：

1. 不要使用功能制作小部件，更喜欢根据您的要求制作单独的无状态或有状态小部件
2. 您可以在发布版本中尝试此操作，看看是否有帮助：https ://flutter.dev/docs/perf/rendering/shader