Flutter 快速操作更改選定的底部導航欄項目

Question

我正在嘗試在我的 Flutter 應用程序中實現主屏幕快速操作/應用程序快捷方式。 我想要實現的是，當用戶通過快速操作啟動我的應用程序時，應用程序會更改底部導航欄中的選定選項卡。 任何幫助表示贊賞。

main.dart：

runApp(
    MaterialApp(
      theme: Themes.appLightTheme,
      darkTheme: Themes.appDarkTheme,
      home: QuickActionsController(
        child: HomeFrame(currentIndex: 0),
      ),

我的 QuickActionsController class：

import 'package:binfinder/screens/HomeFrame.dart';
import 'package:flutter/material.dart';
import 'package:quick_actions/quick_actions.dart';

class QuickActionsController extends StatefulWidget {
  final HomeFrame child;

  QuickActionsController({Key key, this.child}) : super(key: key);

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

class _QuickActionsControllerState extends State<QuickActionsController> {
  final QuickActions quickActions = QuickActions();
  int _currentIndex = 0;

  @override
  void initState() {
    super.initState();
    _handleQuickActions();
    _setupQuickActions();
  }

  void _setupQuickActions() {
    quickActions.setShortcutItems(<ShortcutItem>[
      ShortcutItem(
        type: 'action_map',
        localizedTitle: 'Map',
      ),
    ]);
  }

  void _handleQuickActions() {
    quickActions.initialize((shortcutType) {
      if (shortcutType == 'action_map') {
        setState(() {
          _currentIndex = 1;
        });
      } else {
        setState(() {
          _currentIndex = 0;
        });
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    widget.child.currentIndex = _currentIndex;
    return widget.child;
  }
}

Answer 1

在下面的演示中，直接點擊應用程序將進入第一頁，在快速操作中選擇主視圖將進入第二頁

_handleQuickActions 需要使用

Navigator.pushReplacement(
        context,
        MaterialPageRoute(
            builder: (context) => BottomNavigationBarController(
                  initialIndex: 1,
                )));

並使用初始索引來控制頁面索引

class BottomNavigationBarController extends StatefulWidget {
  final int initialIndex;

  BottomNavigationBarController({
    this.initialIndex,
    Key key,
  }) : super(key: key);

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

完整代碼

import 'package:flutter/material.dart';
import 'package:quick_actions/quick_actions.dart';
import 'dart:io';

class QuickActionsManager extends StatefulWidget {
  final Widget child;
  QuickActionsManager({Key key, this.child}) : super(key: key);

  _QuickActionsManagerState createState() => _QuickActionsManagerState();
}

class _QuickActionsManagerState extends State<QuickActionsManager> {
  final QuickActions quickActions = QuickActions();

  @override
  void initState() {
    super.initState();
    _setupQuickActions();
    _handleQuickActions();
  }

  @override
  Widget build(BuildContext context) {
    return widget.child;
  }

  void _setupQuickActions() {
    quickActions.setShortcutItems(<ShortcutItem>[
      ShortcutItem(
          type: 'action_main',
          localizedTitle: 'Main view',
          icon: Platform.isAndroid ? 'quick_box' : 'QuickBox'),
      ShortcutItem(
          type: 'action_help',
          localizedTitle: 'Help',
          icon: Platform.isAndroid ? 'quick_heart' : 'QuickHeart')
    ]);
  }

  void _handleQuickActions() {
    quickActions.initialize((shortcutType) {
      if (shortcutType == 'action_main') {
        Navigator.pushReplacement(
            context,
            MaterialPageRoute(
                builder: (context) => BottomNavigationBarController(
                      initialIndex: 1,
                    )));
      } else if (shortcutType == 'action_help') {
        print('Show the help dialog!');
      }
    });
  }
}

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'QuickActions Demo',
        home: QuickActionsManager(child: BottomNavigationBarController(initialIndex: 0,)));
  }
}

class Home extends StatelessWidget {
  const Home({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(body: Center(child: Text('Home')));
  }
}

class Login extends StatelessWidget {
  const Login({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(body: Center(child: Text('Login')));
  }
}

class BottomNavigationBarController extends StatefulWidget {
  final int initialIndex;

  BottomNavigationBarController({
    this.initialIndex,
    Key key,
  }) : super(key: key);

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

class _BottomNavigationBarControllerState
    extends State<BottomNavigationBarController> {
  final List<Widget> pages = [
    FirstPage(
      key: PageStorageKey('Page1'),
    ),
    SecondPage(
      key: PageStorageKey('Page2'),
    ),
  ];

  final PageStorageBucket bucket = PageStorageBucket();

  int _selectedIndex = 0;

  Widget _bottomNavigationBar(int selectedIndex) => BottomNavigationBar(
        onTap: (int index) => setState(() => _selectedIndex = index),
        currentIndex: selectedIndex,
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
              icon: Icon(Icons.add), title: Text('First Page')),
          BottomNavigationBarItem(
              icon: Icon(Icons.list), title: Text('Second Page')),
        ],
      );

  @override
  void initState() {
    _selectedIndex = widget.initialIndex;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: _bottomNavigationBar(_selectedIndex),
      body: PageStorage(
        child: pages[_selectedIndex],
        bucket: bucket,
      ),
    );
  }
}

class FirstPage extends StatelessWidget {
  const FirstPage({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("First Screen"),
      ),
      body: ListView.builder(itemBuilder: (context, index) {
        return ListTile(
          title: Text('Lorem Ipsum'),
          subtitle: Text('$index'),
        );
      }),
    );
  }
}

class SecondPage extends StatelessWidget {
  const SecondPage({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Second Screen"),
      ),
      body: ListView.builder(itemBuilder: (context, index) {
        return ListTile(
          title: Text('Lorem Ipsum'),
          subtitle: Text('$index'),
        );
      }),
    );
  }
}

demo，模擬器進入第二頁有點慢