Слайдер Flutter в BottomNavigationBar не обновляется

Question

Использование флаттера. Я создаю виджет Slider в дочернем элементе BottomNavigationBar-Widget. Определена его функция onChanged, которая должна изменить значение Slider.

Если я помещу ползунок в простой виджет Scaffold, он будет работать нормально.

Как мне заставить это работать в BottomNavigationBar? Что-то не хватает (слушатель / обратный вызов или что-то), что я должен объявить в BottomNavigationBar-Widget?

Я использую стабильный канал Flutter с Android Studio 3.1.4.

Следует нерабочий код. Также есть виджет без BottomNavigationBar, где ползунок работает как положено.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Issue Slider in BottomNavigationBar',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new SliderInNavigationBar(),
      // home: new MyHomePage(),
    );
  }
}

class SliderInNavigationBar extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new _SliderInNavigationBarScreenState();
  }
}

class _SliderInNavigationBarScreenState extends State<SliderInNavigationBar> {
  int _currentIndex = 0;
  List<Widget> _children;
  int _period = 0;

  @override
  void initState() {
    super.initState();

    _children = [
      new Slider(
          value: _period.toDouble(),
          min: 0.0,
          max: 100.0,
          onChanged: (double value) {
            print('OnChanged');
            setState(() {
              _period = value.round();
            });
          }),
    ];
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Slider in BottomNavigationBar'),
      ),
      body: _children[_currentIndex],
      bottomNavigationBar: new BottomNavigationBar(
        currentIndex: _currentIndex,
        type: BottomNavigationBarType.fixed,
        items: [
          new BottomNavigationBarItem(
            icon: Icon(Icons.timelapse),
            title: Text('Page 1'),
          ),
          new BottomNavigationBarItem(
            icon: Icon(Icons.message),
            title: Text('Page 2'),
          ),
        ],
      ),
    );
  }
}

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

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _period = 0;

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Slider in AppBar"),
      ),
      body: new Center(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Slider(
                value: _period.toDouble(),
                min: 0.0,
                max: 100.0,
                onChanged: (double value) {
                  print('OnChanged');
                  setState(() {
                    _period = value.round();
                  });
                }),
          ],
        ),
      ),
    );
  }
}

Вывод врача с коротким порывом:

flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel beta, v0.5.1, on Microsoft Windows [Version 10.0.17134.228], locale de-DE)
[√] Android toolchain - develop for Android devices (Android SDK 27.0.3)
[√] Android Studio (version 2.3)
[√] Android Studio (version 3.1)
[!] VS Code, 64-bit edition (version 1.24.1)
[√] Connected devices (1 available)

! Doctor found issues in 1 category.

Answer 1

Добрый день,

Вы должны объявить Slider непосредственно в теле, а не как List , созданный в initState ().

Следующий код должен работать:)

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Issue Slider in BottomNavigationBar',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new SliderInNavigationBar(),
      // home: new MyHomePage(),
    );
  }
}

class SliderInNavigationBar extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new _SliderInNavigationBarScreenState();
  }
}

class _SliderInNavigationBarScreenState extends State<SliderInNavigationBar> {
  int _currentIndex = 0;
  //List<Widget> _children;
  int _period = 0;

  @override
  void initState() {
    super.initState();

    /**
    _children = [
      new Slider(
          value: _period.toDouble(),
          min: 0.0,
          max: 100.0,
          onChanged: (double value) {
            print('OnChanged');
            setState(() {
              _period = value.round();
            });
          }),
    ];**/
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Slider in BottomNavigationBar'),
      ),
      body: new Slider(
          value: _period.toDouble(),
          min: 0.0,
          max: 100.0,
          onChanged: (double value) {
            print('OnChanged');
            setState(() {
              _period = value.round();
            });
          }),
      bottomNavigationBar: new BottomNavigationBar(
        currentIndex: _currentIndex,
        type: BottomNavigationBarType.fixed,
        items: [
          new BottomNavigationBarItem(
            icon: Icon(Icons.timelapse),
            title: Text('Page 1'),
          ),
          new BottomNavigationBarItem(
            icon: Icon(Icons.message),
            title: Text('Page 2'),
          ),
        ],
      ),
    );
  }
}

Я прокомментировал неправильный код.