CurrentIndex не обновляется в представлении Dots_Indicator в флаттере - PullRequest
0 голосов
/ 30 марта 2019

Я работал над PageView, и мой просмотр страницы работает нормально.Но есть один, так как я использовал dots_indicator 0.0.4 , чтобы он представлял, на котором я сейчас нахожусь.Я запутался в том, как это сделать.Мой индикатор показывает нормально, но проблема в том, как обновить index in the position element to update the active dots.

. Я пытался всеми возможными способами обновить его, но это меня смущает.То, что я хочу:

  • Когда я нажимаю на кнопку, это должно изменить индекс элемента
  • . Когда я прокручиваю страницу, это должно изменить индекс

Поскольку я попробовал их обоих, например, создать переменную с именем index и попытаться обновить ее значение, когда мы нажмем кнопку.Но это не обновило значение.

Я не знаю, как мы предполагаем изменить значение при прокрутке страницы.

У меня есть changePage(), когда мы нажимаем кнопку, чтобы перейти на следующую страницу, но значение индекса не обновлялось в DotsIndicator().

CODE:

class OnboardingPage extends StatelessWidget {
    final PageController controller = new PageController();
    var index = 0;

    final List<OnboardingPageItem> pages = [
       //I do have a onboarding page widget which is coming up fine
       //so this is not our concern
    ];

    PageView getPages(){
      return PageView(
        controller: this.controller,
        children: this.pages
      );
    }

    //this is a method which controls the button hit for changing the page
    changePage(BuildContext context) {
      //tried here to update the value of the index by assigning the value to it
      //index = this.controller.page.toInt()
      if (this.controller.page >= this.pages.length - 1) {
        Navigator.pushNamed(context, '/signin');
      }
      this.controller.nextPage(duration: Duration(milliseconds: 200), curve: Curves.easeIn);
    }

    @override
    Widget build(BuildContext context) {
      return Material(
       child: Stack(children: <Widget>[
         Positioned(
           left: 24, right: 24, top: 0, bottom: 80, child: this.getPages()),
         Positioned(
           child: DotsIndicator(
             numberOfDot: 3,
             position: this.index,
             dotColor: Theme.of(context).primaryColor.withOpacity(0.5),
             dotActiveSize: new Size(12.0, 12.0),
             dotActiveColor: Theme.of(context).primaryColor
           ),
           bottom: 100.0,
           left: 150.0,
           right: 150.0
         ),
         Positioned(
          child: TMButton(
            text: "Next",
            onPressed: () {changePage(context);},
          ),
          bottom: 24,
          left: 24,
          right: 24
         )
     ]));
   }
}

РЕДАКТИРОВАТЬ

Я пытался использовать this.controller.hasClients для обновления, когда оно изменяется на true, но ничего не работаетдля меня.Похоже, что это статический параметр DotsIndicator.

position: this.controller.hasClients ? this.controller.page.toInt() : this.controller.initialPage;

currentIndex остается на начальной странице и не изменяется вообще.

Любая помощь будет принята с благодарностью.Спасибо:)

1 Ответ

1 голос
/ 30 марта 2019

, как только у вас есть изменяемое состояние (index) в вашем виджете, вы не должны использовать StatelessWidget, но создайте StatefulWidget с соответствующим State. И при изменении index обернуть его в setState(() { index = ... ; }); это гарантирует, что ваш метод build будет вызван при изменении состояния.

Нет скрытой магии, которая бы контролировала ваше состояние. Ваш виджет будет восстановлен только если вы позвоните setState из StatefulWidget.

...