flutter - 如何在 Flutter 中使用控制器编辑 CupertinoSliverNavigationBar 中的文本标题？

Question

我想知道是否有一种方法可以实际编辑大标题作为我的 TODO 列表应用程序的 CupertinoSliverNavigationBar 的一部分我想将大标题作为可编辑的标题，并且当向上滚动时它实际上显示标题。

 Widget build(BuildContext context) {
    return CupertinoPageScaffold(
        child: CustomScrollView(
      slivers: [
        // The CupertinoSliverNavigationBar
        CupertinoSliverNavigationBar(
          leading: Material(
              child: IconButton(
            icon: const Icon(Icons.home),
            onPressed: () {},
          )),
          trailing: Material(
              child: IconButton(
            icon: const Icon(Icons.add),
            onPressed: () {},
          )),
          largeTitle: const Text('Large Title'),
        ),
      ],
    ));
  }
}

这是基本代码。

谢谢你。

Answer 1

您可以为 title 或 direct 设置状态变量controller.text。要更新 UI，您addListener可以onChanged在CupertinoTextField.

final TextEditingController controller = TextEditingController.fromValue(
  const TextEditingValue(text: "default title"),
);

@override
void initState() {
  super.initState();
  controller.addListener(() {
    setState(() {});
  });
}

@override
void dispose() {
  controller.dispose();
  super.dispose();
}

@override
Widget build(BuildContext context) {
  return CupertinoPageScaffold(
      child: CustomScrollView(
    slivers: [
      // The CupertinoSliverNavigationBar
      CupertinoSliverNavigationBar(
        leading: Material(
            child: IconButton(
          icon: const Icon(Icons.home),
          onPressed: () {},
        )),
        trailing: Material(
            child: IconButton(
          icon: const Icon(Icons.add),
          onPressed: () {},
        )),
        largeTitle: Text(controller.text),
      ),

      SliverToBoxAdapter(
        child: CupertinoTextField(
          controller: controller,
        ),
      ),
    ],
  ));
}