Flutter可以制作IOS搜索栏ui吗？以及如何？

Question

我想制作一个搜索栏的 IOS ui，但我发现的只是常规 ui 如果有人知道我该怎么做那就太好了

示例：

Answer 1

您可以使用 flutter cupertino 库并在 flutter 中制作相同的 Swiftful IOS 风格的搜索 UI，请查看此文档以获取更多信息

下面是有关如何在应用程序中使用它的代码，

class MyPrefilledSearch extends StatefulWidget {
  const MyPrefilledSearch({Key? key}) : super(key: key);

  @override
  State<MyPrefilledSearch> createState() => _MyPrefilledSearchState();
}

class _MyPrefilledSearchState extends State<MyPrefilledSearch> {
  late TextEditingController _textController;

  @override
  void initState() {
    super.initState();
    _textController = TextEditingController(text: 'initial text');
  }

  @override
  Widget build(BuildContext context) {
    return CupertinoSearchTextField(controller: _textController);
  }
}

然后像这样使用它

class MyPrefilledSearch extends StatefulWidget {
  const MyPrefilledSearch({Key? key}) : super(key: key);

  @override
  State<MyPrefilledSearch> createState() => _MyPrefilledSearchState();
}

class _MyPrefilledSearchState extends State<MyPrefilledSearch> {
  @override
  Widget build(BuildContext context) {
    return CupertinoSearchTextField(
      onChanged: (String value) {
        print('The text has changed to: $value');
      },
      onSubmitted: (String value) {
        print('Submitted text: $value');
      },
    );
  }
}

Answer 2

您可以使用此包大标题、搜索栏和应用程序底部，并提供所有动画和过渡； https://pub.dev/packages/super_cupertino_navigation_bar