flutter BottomNavigationBar更改图标,但不更改页面

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

对编码和抖动不熟悉,我一直在尝试将bottomNavigationBar的页面从home page更改为chatroom,但是我尝试的所有方法都不起作用,我看了很多视频,但它们的bottomNavigationBar在它们的内部正文,当我应用它们的操作时,在正文之后padding下的红线和在return Scaffold( 图像链接位于代码末尾]之前的括号中的appBar:红线。

     import 'package:flutter/material.dart';
    import 'package:flutter/cupertino.dart';
    import 'package:flutter_rating_bar/flutter_rating_bar.dart';
    import 'package:trading/core/const.dart';
    import 'package:trading/models/apartment_model.dart';
    import 'package:trading/pages/chat.dart';
    import 'package:trading/pages/detail_page.dart';

    class Homepage extends StatefulWidget {
      @override
      _HomepageState createState() => _HomepageState();
    }

    class _HomepageState extends State<Homepage> {
      var data = ApartmentModel.list;

      int _selectedIndex = 0;
       List<Widget> `enter code here`pages=[
       Homepage(),

       Chatroom(),

        ];




      @override
      Widget build(BuildContext context) {
        return Scaffold(


          appBar: AppBar(
            backgroundColor: Colors.transparent,
            elevation: 0,
            title: Text(
              "find your product",
              style: TextStyle(color: Colors.black87, fontWeight: FontWeight.bold),
            ),
            actions: <Widget>[
              IconButton(
                  icon: Icon(
                    Icons.search,
                    color: Colors.black38,
                  ),
                  onPressed: () {}),
              IconButton(
                  icon: Icon(
                    Icons.filter_list,
                    color: Colors.black38,
                  ),
                  onPressed: () {}),
            ],

          ),



bottomNavigationBar: 

   BottomNavigationBar(
      showSelectedLabels: false,
      showUnselectedLabels: false,
      type: BottomNavigationBarType.fixed,
      selectedItemColor: AppColors.stylecolor,
      unselectedItemColor: Colors.black38,
        currentIndex: _selectedIndex,




      items: [
        BottomNavigationBarItem(

            icon: Icon(Icons.home), title: Text("datsa")),
        BottomNavigationBarItem(

            icon: Icon(Icons.chat), title: Text("data"),),
        BottomNavigationBarItem(
            icon: Icon(Icons.person), title: Text("data")),
      ],

      ),


  body: 
     pages.elementAt(_selectedIndex),
  Padding(    
    padding: EdgeInsets.all(16.0),

    child:   

    Column(

      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Text(
          "65 result in your area",
          style: TextStyle(color: Colors.black38),
        ),
        Expanded(
          child: ListView.builder(

            physics: BouncingScrollPhysics(),
            itemCount: data.length,
            itemBuilder: (context, index) {
              return GestureDetector(
                  onTap: () {
                    Navigator.of(context).push(
                      MaterialPageRoute(
                        builder: (_) => DetailPage(
                          data[index]
                        ),
                      ),
                    );
                      },
                      child: _buildItem(context, index));
                },
              ),
            ), 
         //   Container(       child: _builBottomNavigationBar),
          ],

        ),

      ),

    );  
  }

here is a pic of the red line that I was saying

我对编码和颤动是陌生的,我一直在努力使我的bottomNavigationBar从主页更改为聊天室,但是我尝试的所有方法都无法正常工作,但是我看了很多视频,但它们却......>

您必须制作一个包含页面的Widgets列表,并在body中根据Widget填充Selected Index

示例:

List<Widget> pages=[
  Dashboard(),
  Profile(),
  Settings(),
];

然后将页面在正文中显示为:

body:
   pages.elementAt(_selectedIndex),

主体可以再容纳一个小部件,如果您要同时使用两个列,则可以分配页面和填充]

flutter bottomnavigationview flutter-navigation flutter-appbar flutter-bottomnavigation
2个回答
0
投票

您必须制作一个包含页面的Widgets列表,并在body中根据Widget填充Selected Index


0
投票

主体可以再容纳一个小部件,如果您要同时使用两个列,则可以分配页面和填充]

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