在Flitter中有没有内置的方式来隐藏一个FloatingActionButtonListView向下滚动,然后在向上滚动时显示它?

推荐答案

import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';

void main() {
  runApp(new MyApp());
}

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

        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
 }
class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

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

 class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  ScrollController _hideButtonController;
  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }
  var _isVisible;
  @override
  initState(){
    super.initState();
    _isVisible = true;
    _hideButtonController = new ScrollController();
    _hideButtonController.addListener((){
      if(_hideButtonController.position.userScrollDirection == ScrollDirection.reverse){
        if(_isVisible == true) {
            /* only set when the previous state is false
             * Less widget rebuilds 
             */
            print("**** ${_isVisible} up"); //Move IO away from setState
            setState((){
              _isVisible = false;
            });
        }
      } else {
        if(_hideButtonController.position.userScrollDirection == ScrollDirection.forward){
          if(_isVisible == false) {
              /* only set when the previous state is false
               * Less widget rebuilds 
               */
               print("**** ${_isVisible} down"); //Move IO away from setState
               setState((){
                 _isVisible = true;
               });
           }
        }
    }});
  }
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: new Center(
        child: new CustomScrollView(
          controller: _hideButtonController,
          shrinkWrap: true,
          slivers: <Widget>[
            new SliverPadding(
              padding: const EdgeInsets.all(20.0),
              sliver: new SliverList(
                delegate: new SliverChildListDelegate(
                  <Widget>[
                    const Text('I\'m dedicating every day to you'),
                    const Text('Domestic life was never quite my style'),
                    const Text('When you smile, you knock me out, I fall apart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('And I thought I was so smart'),
                    const Text('I realize I am crazy'),   
                  ],
                ),
              ),
            ),
          ],
        )
      ),
      floatingActionButton: new Visibility( 
        visible: _isVisible,
        child: new FloatingActionButton(
          onPressed: _incrementCounter,
          tooltip: 'Increment',
          child: new Icon(Icons.add),
        ),     
      ),
    );
  }
}

如果我没有使用listview,我很抱歉,因为我不知道如何使用listview滚动.我将回答你问题的其他部分.

首先,您需要创建一个将监听scrollPostion个事件的scrollcontroller

如果scrollcontroller能够找到scrolldirection向前或向后.添加一个将状态设置为可见的状态.

当你画按钮的时候,你把按钮包装成visibility类.您设置了可视标志,小部件应该忽略输入命令.

编辑:我似乎无法添加指向ScrollController、ScrollerPosition、ScrollDirection和Opacity的链接.我想你可以自己搜索,或者其他人在链接中编辑

Edit2:使用CopsonRoad或使用可见性小部件,除非您希望布局树中有未绘制的小部件

编辑3:鉴于使用原样代码的新手,我会更新代码以鼓励更好的实践.使用可见性而不是不透明度.从setState中删除io.在Flutter 1.5.4上测试-热修复2

Flutter相关问答推荐

如何在flater中实现Notch?

Box约束强制无限高:SizedBox. Expand()

Flutter Go路由深度链接不按预期工作

无效字符(位于字符68处)flutter—update—... europe-west1.firebasedatabase.app/

为什么他们实例化类,然后丢弃该实例?

脚本具有不受支持的MIME类型(';Text/html';).(messaging/failed-service-worker-registration)

Flutter 未处理的异常 - 对 null 值使用 Null 判断运算符

如何从Firebase登录获取用户信息,如电话号码、出生日期和性别

如何制作flutter showDialog、AlertDialog屏障 colored颜色 渐变

如何从sibling ChildWidgetB 触发 ChildWidgetA 中的操作

Flutter 错误:OutletListModel类型的值不能分配给List类型的变量?

如何从 showModalBottomSheet 中的 topRight 和 topLeft 移除平边

为什么 orientation == Orientation.portrait 总是正确的,尽管我的设备已经处于横向

Getx Flutter 在更新值时抛出空错误

将一个 Flutter 应用程序集成到另一个 Flutter 应用程序中

如何使按钮被选中?

type '_InternalLinkedHashMap' 不是使用 http 包的'String' 类型的子类型

既然我们已经有了 Flutter 的内置 setState,为什么还要在 Flutter 中使用 BloC 或 Provider?

将容器扩展到安全区域 - Flutter

小部件库捕获的 Flutter 异常