pageView with a bottomNavigationBar = error

Asked

Viewed 167 times

0

Friends, I’m trying to make a pageView with a bottomNavigationBar, but I’m getting an error that I don’t understand why. In this line: currentIndex: controller.page.round(), the page is coming with null. I looked in the documentation and saw this: page Property, I think there is, but I didn’t quite understand it. I appreciate the help.

import 'package:flutter/material.dart';
import 'package:my/resources/colors.dart';
import 'package:my/screens/atividade_fisica_page.dart';
import 'package:my/screens/glicose_page.dart';
import 'package:my/screens/grafico_page.dart';
import 'package:my/screens/refeicao_page.dart';

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  PageController controller;
  List<Widget> pages;

  void _onItemTapped(int index) {
    controller.animateToPage(index,
        curve: Curves.bounceIn, duration: Duration(milliseconds: 300));
  }

  @override
  initState() {
    super.initState();
    controller = PageController(initialPage: 0);
    pages = [
      GraficoPage(),
      GlicosePage(),
      RefeicaoPage(),
      AtividadeFisicaPage()
    ];
  }

  @override
  dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: colorSecondaryLight,
      appBar: AppBar(
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.keyboard_arrow_left),
            onPressed: () {
              controller.previousPage(
                  duration: Duration(milliseconds: 300), curve: Curves.easeIn);
            },
          ),
          IconButton(
            icon: Icon(Icons.keyboard_arrow_right),
            onPressed: () {
              controller.nextPage(
                  duration: Duration(milliseconds: 300), curve: Curves.easeIn);
            },
          ),
        ],
        title: Text("myGlico"),
      ),
      body: PageView.builder(
        controller: controller,
        itemCount: pages.length,
        itemBuilder: (BuildContext context, int index) {
          return Center(
            child: pages[index],
          );
        },
      ),
      bottomNavigationBar: AnimatedBuilder(
          animation: controller,
          builder: (BuildContext context, Widget child) {
            return BottomNavigationBar(
              currentIndex: controller.page.round(),
              selectedItemColor: colorSecondaryDark,
              onTap: _onItemTapped,
              backgroundColor: Colors.red,
              items: const <BottomNavigationBarItem>[
                BottomNavigationBarItem(
                  icon: Icon(Icons.show_chart),
                  title: Text("Gráfico"),
                  backgroundColor: colorPrimary,
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.pin_drop),
                  title: Text("Glicose"),
                  backgroundColor: colorPrimary,
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.pan_tool),
                  title: Text("Refeição"),
                  backgroundColor: colorPrimary,
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.directions_walk),
                  title: Text("Exercício"),
                  backgroundColor: colorPrimary,
                ),
              ],
            );
          }),
    );
  }
}

I/flutter (13159): EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════ I/flutter (13159): The following Nosuchmethoderror was thrown building Animatedbuilder(Animation: I/flutter (13159): Pagecontroller#820ac(one client, offset null), Dirty, state: _Animatedstate#ea014): I/flutter (13159): The method 'round' was called on null. I/flutter (13159): Receiver: null I/flutter (13159): Tried Calling: round() I/flutter (13159): I/flutter (13159): The Relevant error-causing widget was: I/flutter (13159): Animatedbuilder I/flutter (13159):
package:myglico/screens/my_home_page.Dart:72 I/flutter (13159): I/flutter (13159): When the Exception was thrown, this was the stack:

1 answer

0


At the index line you need to check if the page is null:

BottomNavigationBar(
   currentIndex: controller.page?.round() ?? 0,
   ...
  • 1

    Making use of the null-Aware Operator and of conditional access to property, this expression could get even more interesting: controller.page?.round() ?? 0. ;)

  • Very interesting, I will update the answer, and to tell you the truth will help me reduce the code of an app I’m developing, thank you!

  • That’s what I had done, but it seems a little wrong since theoretically the controller was created with the initial page at 0, so I should return this page there.

  • Thanks for the answers.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.