Flutter Breadcrumbs?

问题描述 投票:0回答:1

我需要在每个屏幕/页面上都有一个动态的“后退”按钮,该按钮还应显示前一个屏幕的标题。内置导航器是否可能实现此功能,还是需要从头开始构建?

flutter navigation breadcrumbs
1个回答
0
投票

只需将要显示的字符串传递到将是您下一页的小部件的构造函数。

示例:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  Widget build(context) {
    return Scaffold(
        appBar: AppBar(),
        body: Center(
            child: FlatButton(
                onPressed: () {
                  Navigator.of(context)
                      .push(MaterialPageRoute(builder: (context) {
                    return Sec('title1');
                  }));
                },
                child: Text('Press here'))));
  }
}

Widget backButton(context, t) {
  return Row(children: [
    Expanded(
      child: IconButton(
        icon: Icon(Icons.backspace),
        onPressed: () => Navigator.pop(context),
      ),
    ),
    Text(t,style:TextStyle(fontSize:16))
  ]);
}

class Sec extends StatelessWidget {
  String t;
  Sec(String x) {
    t = x;
  }

  Widget build(context) {
    return Scaffold(
        appBar: AppBar(leading: backButton(context, t)),
        body: Center(
            child: FlatButton(
                onPressed: () {
                  Navigator.pop(context);
                },
                child: Text('Press here to go back'))));
  }
}

Output

© www.soinside.com 2019 - 2024. All rights reserved.