【问题标题】:How do I pass data to a screen while using auto_route in flutter?在颤动中使用 auto_route 时如何将数据传递到屏幕?
【发布时间】:2022-01-13 17:04:03
【问题描述】:

我有一个包含 5 个底部导航栏项目的主页(就像 instagram 一样),我需要将一个布尔值传递给其中一个页面。我正在使用 auto_route 进行导航。

 AutoRoute(
  path: '/home',
  name: 'HomeRouter',
  page: Home,
  children: [
    AutoRoute(
      path: 'timeline',
      name: 'TimelineRouter',
      page: Timeline,
     ),

      AutoRoute(
      path: 'profile',
      name: 'ProfileRouter',
      page: EmptyRouterPage,
      children: [
        AutoRoute(
          path: '',
          page: Profile,    <-----
        ),
        AutoRoute(
          path: ":currentUserId",
          name: "EditProfileRouter",
          page: EditProfile,
        ),
        
      ],
    ),
   ],
  )

我需要向个人资料页面传递一个布尔值,但我不确定如何使用 auto_route 来做到这一点。有什么提示吗? 当我传递一个布尔值时,页面由于某种原因收到了一个空值。获得空值的可能原因是什么?

【问题讨论】:

    标签: flutter flutter-navigation


    【解决方案1】:
    I used a bool value on the profile page to remove the leading icon while I am calling on the bottom navbar so I am sharing my code I Hope this will work for you.Thanks
        
        ////Bottom Navigation page
            
            import 'package:flutter/material.dart';
            import 'package:traveling/helpers/AppColors.dart';
            import 'package:traveling/screens/Employee/home/Home.dart';
            import 'package:traveling/screens/Employee/profile/Profile.dart';
            import 'package:traveling/screens/Employee/setting/Setting.dart';
            
            
            
            class EmployeeBottomNavBar extends StatefulWidget {
              const EmployeeBottomNavBar({Key? key}) : super(key: key);
            
              @override
              _EmployeeBottomNavBarState createState() => _EmployeeBottomNavBarState();
            }
            
            class _EmployeeBottomNavBarState extends State<EmployeeBottomNavBar> {
              int pageIndex = 0;
              bool visible = true;
            
              List<Widget> pageList = <Widget>[EmployeeHome(), EmployeeProfile(leadingIcon: false,), Setting()];
            
              @override
              Widget build(BuildContext context) {
                return Scaffold(
                    body: pageList[pageIndex],
                    bottomNavigationBar: BottomNavigationBar(
                        fixedColor: Colors.redAccent[400],
                        currentIndex: pageIndex,
                        onTap: (value) {
                          setState(() {
                            pageIndex = value;
                          });
                        },
                        // type: BottomNavigationBarType.fixed,
                        items: [
                          BottomNavigationBarItem(
            
                              activeIcon: Container(
                                height: 40,
                                width: 80,
                                decoration: BoxDecoration(
                                  shape: BoxShape.circle,
                                  color: Color(0xff2161c0),
                                ),
                                child: Icon(
                                  Icons.home,
                                  color: AppColors.white,
                                ),
                              ),
                              icon: Icon(
                                Icons.home,
                                color: Color(0xff2161c0),
                              ),
                              label: ""),
                          BottomNavigationBarItem(
                              activeIcon: Container(
                                height: 40,
                                width: 80,
                                decoration: BoxDecoration(
                                  shape: BoxShape.circle,
                                  color: Color(0xff2161c0),
                                ),
                                child: Icon(
                                  Icons.person,
                                  color: AppColors.white,
                                ),
                              ),
                              icon: Icon(
                                Icons.person,
                                color: AppColors.baseLightBlueColor,
                              ),
                              label: ""),
                          BottomNavigationBarItem(
                              activeIcon: Container(
                                height: 40,
                                width: 80,
                                decoration: BoxDecoration(
                                  shape: BoxShape.circle,
                                  color: AppColors.baseLightBlueColor,
                                ),
                                child: Icon(
                                  Icons.settings,
                                  color: AppColors.white,
                                ),
                              ),
                              icon: Icon(
                                Icons.settings,
                                color: AppColors.baseLightBlueColor,
                              ),
                              label: ""),
                        ]
                    )
                );
              }
            }
        
        ///////Profile page
        
        import 'dart:io';
        
        import 'package:flutter/material.dart';
        import 'package:image_picker/image_picker.dart';
        import 'package:material_design_icons_flutter/material_design_icons_flutter.dart';
        import 'package:traveling/helpers/AppColors.dart';
        import 'package:traveling/helpers/AppStrings.dart';
        
        
        class EmployeeProfile extends StatefulWidget {
          final bool leadingIcon;
          EmployeeProfile({Key? key, required this.leadingIcon}) : super(key: key);
        
          @override
          _EmployeeProfileState createState() => _EmployeeProfileState();
        }
        
        class _EmployeeProfileState extends State<EmployeeProfile> {
          bool? visible;
          double? _width;
          File ?_image;
          final picker = ImagePicker();
          Future<void>_showChoiceDialog(BuildContext context)
          {
            return showDialog(context: context,builder: (BuildContext context){
        
              return AlertDialog(
                title: Text("Choose option",style: TextStyle(color: AppColors.hotelListDarkBlue),),
                content: SingleChildScrollView(
                  child: ListBody(
                    children: [
                      Divider(height: 1,color: AppColors.baseLightBlueColor,),
                      ListTile(
                        onTap: (){
                          Navigator.pop(context,_getImage(ImageSource.gallery));
                        },
                        title: Text("Gallery",style: TextStyle(color: AppColors.hotelListDarkBlue),),
                        leading: Icon(Icons.account_box,color: AppColors.baseLightBlueColor,),
                      ),
        
                      Divider(height: 1,color: AppColors.baseLightBlueColor,),
                      ListTile(
                        onTap: (){
                          Navigator.pop(context,_getImage(ImageSource.gallery));
                        },
                        title: Text("Camera",style: TextStyle(color: AppColors.hotelListDarkBlue),),
                        leading: Icon(Icons.camera,color: AppColors.baseLightBlueColor,),
                      ),
                    ],
                  ),
                ),);
            });
          }
        
          @override
          Widget build(BuildContext context) {
            _width = MediaQuery.of(context).size.width;
            return Scaffold(
              body: ListView(
                shrinkWrap: true,
                children: [
                  Container(
                    width: _width!,
                    color: AppColors.white,
                    child: Stack(
                      children: [
                        Column(
                          children: [
                            Material(
                              color: AppColors.baseLightBlueColor,
                              elevation: 15,
                              shape: RoundedRectangleBorder(
                                borderRadius:
                                BorderRadius.only(bottomRight: Radius.circular(30)),
                              ),
                              child: Container(
                                height: 180,
                                decoration: BoxDecoration(
                                  color: AppColors.baseLightBlueColor,
                                  // AppColors.blue,
                                  borderRadius:
                                  BorderRadius.only(bottomRight: Radius.circular(30)),
                                ),
                              ),
                            ),
                            Container(
                              // color: AppColors.green,
                              width: _width! * 0.90,
                              height: 140,
                              margin: EdgeInsets.only(top: 60),
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                // mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                                children: [
                                  Row(
                                    // crossAxisAlignment: CrossAxisAlignment.start,
                                    children: [
                                      Text(
                                        AppStrings.personalInformation,
                                        // "Informations personelles",
                                        style: TextStyle(
                                          color: Color(0xff919AAA),
                                        ),
                                      )
                                    ],
                                  ),
                                  Row(
                                    children: [
                                      Container(
                                        height: 100,
                                        width: 50,
                                        child: Column(
                                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                                          crossAxisAlignment: CrossAxisAlignment.start,
                                          children: [
                                            Text(
                                              AppStrings.name,
                                              style: TextStyle(
                                                fontSize: 15,
                                                color: AppColors.hotelListDarkBlue,
                                              ),
                                            ),
                                            Text(
                                              AppStrings.email,
                                              style: TextStyle(
                                                fontSize: 15,
                                                color: AppColors.hotelListDarkBlue,
                                              ),
                                            ),
                                            Text(
                                              AppStrings.phone,
                                              // "Phone",
                                              style: TextStyle(
                                                fontSize: 15,
                                                color: AppColors.hotelListDarkBlue,
                                              ),
                                            ),
                                          ],
                                        ),
                                      ),
                                      SizedBox(
                                        height: 100,
                                        width: 30,
                                      ),
                                      Container(
                                        height: 100,
                                        width: 200,
                                        child: Column(
                                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                                          crossAxisAlignment: CrossAxisAlignment.start,
                                          children: [
                                            Text(
                                              "Laure Beno",
                                              style: TextStyle(
                                                fontSize: 15,
                                                fontWeight: FontWeight.bold,
                                                color: AppColors.hotelListDarkBlue,
                                              ),
                                            ),
                                            Text(
                                              "laure.beno@gmail.com",
                                              style: TextStyle(
                                                fontSize: 15,
                                                fontWeight: FontWeight.bold,
                                                color: AppColors.hotelListDarkBlue,
                                              ),
                                            ),
                                            Text("+33 (0)6 45 23 65 77",
                                                style: TextStyle(
                                                  fontSize: 15,
                                                  fontWeight: FontWeight.bold,
                                                  color: AppColors.hotelListDarkBlue,
                                                )),
                                          ],
                                        ),
                                      ),
                                    ],
                                  ),
                                ],
                              ),
                            ),
                            Container(
                              width: _width! * 0.87,
                              child: Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  Text(
                                    AppStrings.myPoetryModes,
                                    style: TextStyle(
                                      color: AppColors.hotelListLightGreyColor,
                                    ),
                                  ),
                                  Text(
                                    "+ " + AppStrings.add,
                                    style: TextStyle(
                                      color: AppColors.hotelListLightGreyColor,
                                    ),
                                  ),
                                ],
                              ),
                            ),
                            SizedBox(
                              height: 20,
                            ),
                            Container(
                                width: _width! * 0.90,
                                child: atmCard(
                                    cardName: "VISA",
                                    image: "assets/Visa.png",
                                    height: 10)),
                            Container(
                                width: _width! * 0.90,
                                child: atmCard(
                                    cardName: "Master Card",
                                    image: "assets/MasterCard.png",
                                    height: 20)),
                          ],
                        ),
                        Positioned(
                            top: 80,
                            child: _image==null?Stack(
                              children: [
                                Container(
                                  height: 150,
                                  width:_width,
                                  child: Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                      Container(
                                        height: 120,
                                        width: 120,
                                        decoration: BoxDecoration(
                                            color: Colors.white,
                                            borderRadius: BorderRadius.circular(60),
                                            border: Border.all(color: AppColors.white, width: 2.0),
                                            image: DecorationImage(
                                              image: AssetImage("assets/managerPicture.jpeg"),fit: BoxFit.cover,
                                            )
                                          /*gradient: LinearGradient(
                                  begin: Alignment.topRight,
                                  end: Alignment.bottomLeft,
                                  colors: [
                                    Color(0xff00519E),
                                    AppColors.blue,
                                    Colors.blue.shade900,
                                  ],
                                )*/
                                        ),
                                        /* child: ClipRRect(
                                borderRadius: BorderRadius.circular(60.0),
                                child: Image.asset("assets/manager.jpeg",height: 100,width: 100,)
                              //Icon(Icons.person, size: 100),
                              // child: Image.asset("assets/logo/profile.png", fit: BoxFit.fill),
                            ),*/
                                      ),
                                    ],
                                  ),
                                ),
                                Positioned(
                                  top: 60,
                                  right: 0,
                                  left: 100,
                                  bottom: 0,
                                  child: GestureDetector(
                                    onTap: (){
                                      _showChoiceDialog(context);
                                    },
                                    child: Container(
                                      height: 10,
                                      width: _width,
                                      child: Row(
                                        mainAxisAlignment: MainAxisAlignment.center,
                                        children: [
                                          Container(
                                            height: 35,
                                            width: 35,
                                            decoration: BoxDecoration(
                                              color: AppColors.profiePicBackground,
                                              borderRadius: BorderRadius.circular(60),
        
                                              //border: Border.all(color: Colors.blue.shade900, width: 2.0),
                                            ),
                                            child: ClipRRect(
                                              borderRadius: BorderRadius.circular(60.0),
                                              child: Icon(MdiIcons.squareEditOutline,color: AppColors.popUpBlueColor,size: 20,),
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                  ),)
                              ],
                            ):Stack(
                              children: [
                                Container(
                                  height: 150,
                                  width:_width,
                                  child: Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                      Container(
                                        height: 120,
                                        width: 120,
                                        decoration: BoxDecoration(
                                          color: Colors.white,
                                          shape: BoxShape.circle,
                                          image: DecorationImage(
                                            fit: BoxFit.fill,
                                            image:  FileImage(_image!),
                                          ),
                                          border: Border.all(color: AppColors.white, width: 2.0),
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                Positioned(
                                  top: 60,
                                  right: 0,
                                  left: 100,
                                  bottom: 0,
                                  child: GestureDetector(
                                    onTap: (){
                                      _showChoiceDialog(context);
                                    },
                                    child: Container(
                                      height: 10,
                                      width: _width,
                                      child: Row(
                                        mainAxisAlignment: MainAxisAlignment.center,
                                        children: [
                                          Container(
                                            height: 35,
                                            width: 35,
                                            decoration: BoxDecoration(
                                              color: AppColors.profiePicBackground,
                                              borderRadius: BorderRadius.circular(60),
        
                                              //border: Border.all(color: Colors.blue.shade900, width: 2.0),
                                            ),
                                            child: ClipRRect(
                                              borderRadius: BorderRadius.circular(60.0),
                                              child: Icon(MdiIcons.squareEditOutline,color: AppColors.popUpBlueColor,size: 20,),
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                  ),)
                              ],
                            )
                        ),
                        Positioned(
                            top: 40,
                            child: Container(
                              width: MediaQuery.of(context).size.width,
                              padding: EdgeInsets.only(left:8,right: 8),
                              child: Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  widget.leadingIcon == true
                                      ? Align(
                                    alignment: Alignment.topLeft,
                                    child: GestureDetector(
                                        onTap: () {
                                          Navigator.pop(context);
                                        },
                                        child: Icon(
                                          MdiIcons.arrowLeft,
                                          color: Colors.white,
                                        )),
                                  )
                                      : Container(),
                                  Align(
                                    alignment: Alignment.topCenter,
                                    child: Text(AppStrings.myAccount,
                                        style: TextStyle(
                                            fontSize: 15,
                                            color: AppColors.white,
                                            fontWeight: FontWeight.bold)),
                                  ),
                                  Align(
                                    alignment: Alignment.topRight,
                                    child: GestureDetector(
                                        onTap: () {},
                                        child: Icon(
                                          MdiIcons.pencilOutline,
                                          color: AppColors.white,
                                        )),
                                  ),
        
        
                                ],
                              ),
                            )
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            );
          }
        
          //ImageSource: Camera and Gallery.
          _getImage(ImageSource imageSource) async
          {
            PickedFile? imageFile = await picker.getImage(source: imageSource);
        //if user doesn't take any image, just return.
            if (imageFile == null) return;
            setState(
                  () {
        //Rebuild UI with the selected image.
                _image = File(imageFile.path);
              },
            );
          }
        
          Widget atmCard({String? image, String? cardName, double? height}) {
            return GestureDetector(
              onTap: () {
                // Navigator.push(
                //     context, MaterialPageRoute(builder: (context) => Class()));
              },
              child: Card(
                elevation: 2,
                margin: EdgeInsets.only(bottom: 15, right: 5, left: 5),
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(15.0),
                ),
                child: Container(
                  height: 80,
                  // width: _width! * 0.90,
                  padding: EdgeInsets.only(
                    // top: 5,
                    left: 20,
                    // right: 20,
                  ),
                  decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(15), color: Colors.white),
        
                  child: Row(
                    children: [
                      Image.asset(
                        image.toString(),
                        height: height,
                      ),
                      //Icon(Icons.atm,color: AppColors.hotelListDarkBlue,),
                      SizedBox(
                        width: 30,
                      ),
                      Container(
                        width: MediaQuery.of(context).size.width * 0.62,
                        height: 50,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              cardName.toString(),
                              // "MasterCard",
                              style: TextStyle(
                                  color: AppColors.hotelListDarkBlue,
                                  fontSize: 12,
                                  fontWeight: FontWeight.bold),
                            ),
                            Text(
                              "4******12345678",
                              style: TextStyle(
                                  fontSize: 14,
                                  color: AppColors.hotelListLightGreyColor),
                            ),
                          ],
                        ),
                      )
                    ],
                  ),
                ),
              ),
            );
          }
        }
    

    【讨论】:

    • 感谢您的分享,但您似乎没有使用 auto_route 库。正常情况下,给其他类传值很容易,但是 auto_route 让我很难。
    猜你喜欢
    • 2020-07-26
    • 2020-07-12
    • 2019-09-21
    • 1970-01-01
    • 2020-02-20
    • 1970-01-01
    • 2020-02-16
    • 2021-11-07
    • 2023-01-23
    相关资源
    最近更新 更多