如何使用 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

您可以为标题或直接controller.text设置一个状态变量。要更新 UI，您可以在 CupertinoTextField.

上使用 addListener 或 onChanged 方法


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,
        ),
      ),
    ],
  ));
}

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

How to edit the text title in CupertinoSliverNavigationBar using a controller in flutter?

flutter

flutter-cupertino

cupertino-widgets