BottomNavigationBar Flutter не обновляет выбранный элемент при нажатии - PullRequest
Новая
       1

BottomNavigationBar Flutter не обновляет выбранный элемент при нажатии

0 голосов
/ 09 мая 2020

Я новичок во Flutter и сейчас пробую очень простые упражнения, чтобы понять основы. Я только что создал базовый c Home с BottomNavigationBar в самом низу экрана. Но когда я нажимаю на значок панели, он не меняет цвета, чтобы выглядеть так, как если бы он был нажат. Мне нужно перезагрузить его, чтобы обновить. Я не могу обновить состояние значка из класса ' MyBottmNavigationBar ' ... Если я просто скопирую / вставлю образец кода Flutter.dev, он заработает ... Что мне нужно исправить в моем коде? Не стесняйтесь указывать на любые ошибки или подсказки! Заранее спасибо! 

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Home();
  }
}

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyScaffold(),
    );
  }
}

class MyScaffold extends StatefulWidget {
  @override
  _MyScaffoldState createState() => _MyScaffoldState();
}

class _MyScaffoldState extends State<MyScaffold> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Hey Flutter'),),
      body: MyListView(),
      bottomNavigationBar: MyBottomNavigationBar(),
    );
  }
}


class MyListView extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ListView(
      padding: const EdgeInsets.all(2),
      children: <Widget>[
        Container(
          height: 50,
          color: Colors.amber[600],
          child: const Center(child: Text('Entry A')),
        ),
        Container(
          height: 50,
          color: Colors.amber[500],
          child: const Center(child: Text('Entry B')),
        ),
        Container(
          height: 50,
          color: Colors.amber[100],
          child: const Center(child: Text('Entry C')),
        ),
        Container(
          height: 50,
          color: Colors.amber[600],
          child: const Center(child: Text('Entry A')),
        ),
      ],
    );
  }
}

class MyBottomNavigationBar extends StatefulWidget {
  MyBottomNavigationBar({Key key}) : super(key: key);

  @override
  _MyBottomNavigationBarState createState() => _MyBottomNavigationBarState();
}

class _MyBottomNavigationBarState extends State<MyBottomNavigationBar> {
  int _selectedIndex = 0;
  void _onItemTapped(int index){
    _selectedIndex = index;
    print('Selected: ${_selectedIndex} CurrentIndex: ${index}');
  }
  @override
  Widget build(BuildContext context) {
    return BottomNavigationBar(
      currentIndex: _selectedIndex,
      selectedItemColor: Colors.pink,
      onTap: _onItemTapped,
      items: const <BottomNavigationBarItem>[
        BottomNavigationBarItem(
          icon: Icon(Icons.home),
          title: Text('Home'),
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.table_chart),
          title: Text('Projects'),
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.people),
          title: Text('Teams'),
        ),
      ],
    );
  }
}
```

1 Ответ

0 голосов
/ 09 мая 2020

Вы забыли вызвать setState в своей функции _onItemTapped.

Чтобы решить эту проблему, замените приведенный ниже код своей функцией _onItemtapped: 

void _onItemTapped(int index){
    // add the setstate callback here
    setState(() { 
    _selectedIndex = index;
    });
    print('Selected: ${_selectedIndex} CurrentIndex: ${index}');
  }

Надеюсь это помогает.

...