【问题标题】:Flutter: FloatingActionButton over last element of GridViewFlutter:GridView的最后一个元素上的FloatingActionButton
【发布时间】:2021-04-24 18:39:52
【问题描述】:

我有一个带有 FloatingActionButton 的可滚动列表。我想让列表在 FloatingActionButton 之前完成,因为列表的最后一项不再可见,就像在 Gmail 应用程序中一样。

@override
Widget build(BuildContext context) {

return Scaffold(
  key: _scaffoldKey,
  backgroundColor: Colors.white,
  resizeToAvoidBottomInset: false,
  appBar: AppBar(
    brightness: Brightness.light,
    elevation: 0.0,
    backgroundColor: Colors.transparent,
    title: Text(
      'OnePictura',
      style: TextStyle(color: dark, fontSize: 20),
    ),
    actions: [
      Padding(
        padding: const EdgeInsets.all(8),
        child: Container(
          decoration:
              BoxDecoration(shape: BoxShape.circle, color: textWhite),
          child: IconButton(
            icon: Image.asset(
              'graphics/setting_icon.png',
            ),
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => new SettingPage(),
                ),
              );
            },
          ),
        ),
      ),
    ],
  ),
  body: LoadingIndicatorPage(
    loading: _loading,
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Align(
          alignment: Alignment.topLeft,
          child: IconButton(
            icon: ImageIcon(
              AssetImage("graphics/icon_search.png"),
            ),
            onPressed: () {
              showSearch(context: context, delegate: DataSearch(albumList, _userId));
            },
          ),
        ),
        xyz(),
      ],
    ),
  ),
  floatingActionButton: FloatingActionButton(
    onPressed: () async {
      var result = await Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) => new CreateAlbumPage(),
        ),
      );

      if (result) {
        _getAllAlbum();
        setState(() {
          albumList.clear();
        });
      }
    },
    backgroundColor: Colors.white,
    child: Icon(
      Icons.add,
      color: purpleishBlueTwo,
    ),
  ),
);
}





  Widget xyz() {
    if (albumList.length == 0) {
      return Expanded(
        child: SmartRefresher(
          onRefresh: _onRefresh,
          controller: _refreshController,
          enablePullDown: true,
          enablePullUp: false,
          child: Center(
            child: Text(_message),
          ),
        ),
      );
    } else {
      return Expanded(
        child: SmartRefresher(
          onRefresh: _onRefresh,
          controller: _refreshController,
          enablePullDown: true,
          enablePullUp: false,
          child: GridView.builder(
            controller: _scrollController,
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              childAspectRatio: MediaQuery.of(context).size.width /
                  (MediaQuery.of(context).size.height / 1.5),
            ),
            itemCount: albumList.length,
            itemBuilder: (BuildContext context, int index) {
              return buildRow(index);
            },

          ),
        ),
      );
    }
  }




  Widget buildRow(int index) {
    return Padding(
      padding: EdgeInsets.only(top: 10.0, right: 10.0, left: 10.0, bottom: 10.0),
      child: GestureDetector(
        onTap: () async {
          var result = await Navigator.push(
            context,
            MaterialPageRoute(
              builder: (context) =>
                  new AlbumPage(tabIndex: index, albumList: albumList),
            ),
          );

          if (result) {
            _getAllAlbum();
            _getSubscriptionDetails();

            setState(() {
              albumList.clear();
            });
          }
        },
        child: AlbumTile(
          index: index,
          currentUser: _userId,
          albumList: albumList,
          deleteAlbum: _deleteDialog,
        ),
      ),
    );
  }

【问题讨论】:

标签: flutter flutter-layout


【解决方案1】:
child: GridView.builder(
        controller: _scrollController,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 2,
          childAspectRatio: MediaQuery.of(context).size.width /
              (MediaQuery.of(context).size.height / 1.5),
        ),
        itemCount: albumList.length,
        itemBuilder: (BuildContext context, int index) {
          return buildRow(index);
        },

      ),

    child: GridView.builder(
        controller: _scrollController,
        padding: EdgeInsets.only(bottom: 70),
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 2,
          childAspectRatio: MediaQuery.of(context).size.width /
              (MediaQuery.of(context).size.height / 1.5),
        ),
        itemCount: albumList.length,
        itemBuilder: (BuildContext context, int index) {
          return buildRow(index);
        },

      ),

【讨论】:

    猜你喜欢
    • 2019-12-27
    • 2012-04-02
    • 2013-02-06
    • 2017-11-28
    • 1970-01-01
    • 2012-04-12
    • 2016-10-13
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多