Флаттер навигация с обобщенным AppBar - PullRequest
1 голос
/ 08 ноября 2019

В настоящее время я пишу приложение Flutter. У меня есть класс AdvancedAppBar, который расширяет AppBar и используется в качестве гернерализованного AppBar для большинства экранов. Это отдельный файл. У AdvancedAppBar есть FlatButton и PopUpMenu как дети. Нажимая эти кнопки, я хотел бы перейти на другой экран. В настоящее время я использую класс Navigator для навигации между экранами, но, насколько мне известно, это предполагает BuildContext, и я не знаю, как или вообще возможно определить BuildContext для AppBar.

Как реализовать эту навигацию?

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primarySwatch: Colors.blue
      ),
      initialRoute: '/',
      routes: {
        '/': (context) => HomeScreen(),
        '/notifications': (context) => NotificationScreen(),
      },
    );
  }
}


class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: new AdvancedAppBar(),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new MaterialButton(
              height: 40.0,
              minWidth: 300.0,
              color: Colors.blue,
              textColor: Colors.white,
              child: new Text("Nachrichten", textScaleFactor: 2.0,),
              onPressed: (){
                Navigator.pushNamed(context, '/notifications');
                },
            )
          ],
        ),
      ),
    );
  }
}


class AdvancedAppBar extends AppBar{


  AdvancedAppBar({Key key}) : super(
        key: key,
        title:
        Container(child: ConstrainedBox(
        constraints: BoxConstraints.expand(),
          child: FlatButton(
          onPressed: () {
            // here I would like to navigate to another screen
          },
         padding: EdgeInsets.all(0.0),
         child: Image.asset('assets/images/Logo.png')
         )
         )
         ),
        actions: <Widget>[
          PopupMenuButton<PopUpStates>(
  onSelected: (PopUpStates result) {
    switch (result) {
      case PopUpStates.settings: {
      // here I would like to navigate to another screen
      } 
        break;
      case PopUpStates.logout: {
      // here I would like to navigate to another screen
      } 
      break;
      default:
    }},
  itemBuilder: (BuildContext context) => <PopupMenuEntry<PopUpStates>>[
    const PopupMenuItem<PopUpStates>(
      value: PopUpStates.settings,
      child: Text('Einstellungen'),
    ),
    const PopupMenuItem<PopUpStates>(
      value: PopUpStates.logout,
      child: Text('Ausloggen'),
    ),
  ],
)
        ],
        automaticallyImplyLeading: false
  );

}


1 Ответ

1 голос
/ 08 ноября 2019

Давайте создадим ваш конструктор для AdvancedAppBar, чтобы он выглядел примерно так, чтобы вы могли передавать функции

AdvancedAppBar({Key key, Function settings, Function logout})

Теперь мы можем использовать эти аргументы в аргументе onSelected, который теперь будет выглядеть так

onSelected: (PopUpStates result) {
    switch (result) {
      case PopUpStates.settings: {
        settings();
      } 
        break;
      case PopUpStates.logout: {
        logout();
      } 
      break;
      default:
    }},

наконец, давайте передадим функции навигатора с HomeScreen

appBar: new AdvancedAppBar(
  settings: () => Navigator.pushNamed(context, '/settings'),
  logout: () => Navigator.pushNamed(context, '/logout'),
),
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...