2

我使用 NestedScrollView 和 SliverAppBar 在滚动时隐藏应用栏。在 NestedScrollView 的正文中,我有一个带有 PageStorageKey 的 CustomScrollView,但是当我切换回事件选项卡时,滚动位置会丢失。我不明白。请你帮助我好吗?

home_screen.dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:liveitup/app/screens/HomeScreen/drawer_icon.dart';
import 'package:liveitup/app/screens/HomeScreen/drawer_page.dart';
import 'package:liveitup/app/screens/HomeScreen/tabs/bottom_navigation.dart';
import 'package:liveitup/app/screens/HomeScreen/tabs/tab_item.dart';
import 'package:liveitup/app/screens/HomeScreen/tabs/tab_navigators/event_tab_navigator.dart';
import 'package:liveitup/app/screens/HomeScreen/tabs/tab_navigators/message_tab_navigator.dart';
import 'package:liveitup/app/screens/HomeScreen/tabs/tab_navigators/notification_tab_navigator.dart';
import 'package:liveitup/blocs/UserBloc/bloc.dart';

import '../../../constants.dart';

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

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

class _HomeScreenState extends State<HomeScreen> {

  var _currentTab = TabItem.events;

  void _selectTab(TabItem tabItem) {
      setState(() => _currentTab = tabItem);
  }

  @override
  Widget build(BuildContext context) {
    var scaffoldKey = GlobalKey<ScaffoldState>();
    UserBloc _userBloc = BlocProvider.of<UserBloc>(context);
    return Scaffold(
      backgroundColor: Colors.blue,
      drawer: DrawerPage(),
      key: scaffoldKey,
      body: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            SliverAppBar(
              expandedHeight: 0,
              pinned: false,
              floating: true,
              forceElevated: innerBoxIsScrolled,
              backgroundColor: Colors.green,
              leading: GestureDetector(
                  onTap: () => scaffoldKey.currentState?.openDrawer(),
                  child: const DrawerIcon()),
              title: const Center(
                child: Text(app_name),
              ),
              actions: [
                //Icon(Icons.search),
                (_currentTab == TabItem.events)
                    ? Icon(Icons.filter)
                    : Container(),
              ],
            ),
          ];
        },
        body: Builder(builder: (BuildContext context) {
          if (_currentTab == TabItem.events) {
            return CustomScrollView(
              key: const PageStorageKey<TabItem>(TabItem.events),
              slivers: [
                SliverList(
                    delegate: SliverChildListDelegate([
                  for (var index = 1; index < 1000; index++)
                    Text(
                      index.toString(),
                      textAlign: TextAlign.center,
                      style: const TextStyle(
                        color: Colors.white,
                        fontWeight: FontWeight.w600,
                        fontSize: 40.0,
                        letterSpacing: 2.0,
                        wordSpacing: 100.0,
                      ),
                    ),
                ])),
              ],
            );
          } else if (_currentTab == TabItem.messages) {
            return const Center(
              child: Text('message list'),
            );
          } else if (_currentTab == TabItem.notifications) {
            return const Center(
              child: Text('notitifcatiion list'),
            );
          }
          return Text('notitifcatiion list');
        }),
      ),
      bottomNavigationBar: BottomNavigation(
        currentTab: _currentTab,
        onSelectTab: _selectTab,
      ),
    );
  }
}

tab_item.dart

import 'package:flutter/material.dart';

enum TabItem { events, messages, notifications }

const Map<TabItem, String> tabName = {
  TabItem.events: 'events',
  TabItem.messages: 'messages',
  TabItem.notifications: 'notifications',
};

botom_navigation.dart

import 'package:flutter/material.dart';
import 'package:liveitup/app/screens/HomeScreen/tabs/tab_item.dart';

class BottomNavigation extends StatelessWidget {
  BottomNavigation({required this.currentTab, required this.onSelectTab});
  final TabItem currentTab;
  final ValueChanged<TabItem> onSelectTab;

  @override
  Widget build(BuildContext context) {
    return BottomNavigationBar(
      type: BottomNavigationBarType.fixed,
      items: [
        BottomNavigationBarItem(
          icon: Icon(
            Icons.home,
            color: currentTab == TabItem.events ? Colors.black : Colors.grey,
          ),
          label: tabName[TabItem.events],
        ),
        BottomNavigationBarItem(
          icon: Icon(
            Icons.message,
            color: currentTab == TabItem.messages ? Colors.black : Colors.grey,
          ),
          label: tabName[TabItem.messages],
        ),
        BottomNavigationBarItem(
          icon: Icon(
            Icons.notifications,
            color: currentTab == TabItem.notifications
                ? Colors.black
                : Colors.grey,
          ),
          label: tabName[TabItem.notifications],
        ),
      ],
      onTap: (index) => onSelectTab(
        TabItem.values[index],
      ),
      currentIndex: currentTab.index,
      //selectedItemColor: Colors.black,
    );
  }
}

应用程序

4

0 回答 0