Блог

Главная - Вопросы по программированию - ЯЩИК приложения Flutter, который может отображаться на всех моих страницах

ЯЩИК приложения Flutter, который может отображаться на всех моих страницах

#flutter #dart

#flutter #dart

Вопрос:

Я хотел бы знать, есть ли лучший способ сделать это: мне нужен ящик, который открывается с меню (просмотр списка и плитки списка), которое можно использовать для навигации по моему приложению, выхода из системы и смены языка. Ящик выпадает из значка меню, установленного на панели приложений (автоматически)

Я уже создал ящик, и он работает. Я закодировал его на странице настроек, НО я хочу, чтобы этот ящик / значок был доступен на всех страницах (после входа в систему)

Мое «решение для новичков» — скопировать и вставить код ящика на все страницы, но я знаю, что есть лучший способ сделать это, я просто не могу вспомнить, что это такое или как это сделать. Я знаю, что это элементарно, но я застрял, и я не знаю, как это сделать в Google, это как создать метод? функция? пользовательский виджет? частный метод?

Может кто-нибудь, пожалуйста, помочь с этим

Ответ №1:

Вы можете просто создать специальный виджет (с сохранением состояния или без сохранения состояния) и поместить весь код вашего ящика в этот виджет. Затем вы можете создавать экземпляр этого виджета каждый раз, когда он вам понадобится.

 class AppDrawer extends StatefulWidget {

  @override
  _AppDrawerState createState() => _AppDrawerState();

}

class _AppDrawerState extends State<AppDrawer> {
  @override
  Widget build(BuildContext context) {
     // your drawer's code
  }
}

А затем в каком-нибудь другом виджете, где вам нужен ваш ящик:

 @override
Widget build(BuildContext context) => Scaffold(
    appBar: [...]
    drawer: AppDrawer(),
    body: [...]
);

Комментарии:

1. Спасибо. Мне потребовалось некоторое время, чтобы реализовать его правильно, но я это сделал. Создан новый класс (виджет с полным состоянием) Этот класс вернул ящик (со всем моим кодом для этого ящика) Я создал его экземпляр на других страницах, написав: drawer: AppDrawer(), прямо под штрих-кодом приложения и над основным кодом. Кажется, он работает нормально. Еще раз спасибо! С уважением,

Ответ №2:

Может быть лучший подход, но вот как я сделал свой.

Это моя основная панель инструментов, которая содержит ящик

  return Scaffold(
          drawer: Drawer(
            key: Key("dash_board_screen_key"),
            child: menu(context: context, model: model),
          ),
          appBar: AppBar(
            title: Text(
              model.getTitle(),
            ),

            centerTitle: true,
            actions: <Widget>[
              IconButton(
                  icon: Icon(
                    Icons.lightbulb_outline,
                    size: 18,
                  ),
                  onPressed: () {
                    model.toggleDarkMode();
                  }),
            ],
          ),
          body: Padding(
            padding: EdgeInsets.only(left: 20.w, right: 20.w),
            child: Expanded(child: getDashboardWidget(model)),
          ) // dashboard(context),
        );

как вы можете видеть выше, getDashboardWidget возвращает отображаемый виджет

  Widget getDashboardWidget(DashboardController model){

    switch (model.selectedItem) {
      case DashboardMenu.cart:
        return CartScreen();

     

      case DashboardMenu.notification:
        return NotificationScreen();

      case DashboardMenu.profile:
        return ProfileScreen();
    }

    return CartScreen();
  }

таким образом, в зависимости от того, какой вариант ящика был выбран, я обновил только тело страницы панели мониторинга.

Это означает, что все остальные экраны (экран корзины, уведомление) используют один и тот же каркас.