iOS在Flutter上折叠搜索栏

时间:2019-12-22 04:07:40

标签: flutter

我正在尝试使用Flutter上的Cupertino Widgets实现ios折叠搜索栏(例如WhatsApp for ios),我正在使用Slivers,但无法获得本机行为,显示用户向下滚动时显示并在向上滚动时隐藏。我正在使用SliverList,但是当我向上滚动列表时,其内容不会隐藏。

import 'package:flutter/cupertino.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return CupertinoApp(
      title: 'Flutter Demo',

      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);


  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {


  @override
  Widget build(BuildContext context) {

    return CustomScrollView(
      dragStartBehavior: DragStartBehavior.start,
          slivers: <Widget>[

            CupertinoSliverNavigationBar(

              leading: CupertinoNavigationBarBackButton(
                onPressed: () => {},
              ),
          largeTitle: Text("Chats"),
    ),

    SliverList(
      delegate: SliverChildListDelegate(
          [
            DecoratedBox(
              child: CupertinoTextField(
                placeholder: "Search...",
              ),
              decoration: BoxDecoration(
                color: Colors.white
              ),
            ),

          ]
      )),
          ],
    );
  }
}

0 个答案:

没有答案