Not able to use setState while I have BottomNavigatorBar

Question

My problem is that if I want to update the view from the toggle I can't because I need to create a new class for the screens. I want when I press the button to update my view and move the slider from the first element to the second one and I don't know how to do it work. If I want to move from the first toogleelement to the second the action work,I tried with a print but I wan't it to be more interactive so I want the slider to move. I also use a neumorphic package for design to make it a lot easier.

This is the place that have the slider,I want the slider to make a move to be interactive:

screenCatalog() {
  return SingleChildScrollView(
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: <Widget>[
        SizedBox(height: 40,),
        NeumorphicToggle(
          height: 30,
          selectedIndex: _selectedIndex,
          displayForegroundOnlyIfSelected: true,
          children: [ ToggleElement(
            background: Center(child: Text('Semestrul 1',
                style: TextStyle(fontWeight: FontWeight.w200)),),
            foreground: Center(child: Text('Semestrul 1',
                style: TextStyle(fontWeight: FontWeight.w400)),),
          ),
            ToggleElement(
              background: Center(child: Text('Semestrul 2',
                  style: TextStyle(fontWeight: FontWeight.w200)),),
              foreground: Center(child: Text('Semestrul 2',
                  style: TextStyle(fontWeight: FontWeight.w400)),),
            )
          ],
          thumb: Neumorphic(
            boxShape: NeumorphicBoxShape.roundRect(BorderRadius.circular(10)),
            style: NeumorphicStyle(
              lightSource: LightSource.topLeft,
              intensity: 0.8,
              shape: NeumorphicShape.flat,
              depth: 3,
              color: Colors.grey[100],
            ),
          ),
          onChanged: (value) {
             //here I want to make the setState but i can't,it gives me error
          },
        ),
        SizedBox(height: 10,),
      ],
    ),
  );
}

This is the entire code:

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_neumorphic/flutter_neumorphic.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:onefocus/services/customicons.dart';
import 'package:onefocus/data_processing/elev_processing_data.dart';

int _selectedIndex = 0;

class ElevHomePage extends StatefulWidget{
  @override
  _ElevHomePageState createState() => _ElevHomePageState();
}
class _ElevHomePageState extends State<ElevHomePage> {

  int _currentIndex = 0;

  List<Widget> tabs = [
    screenHome(),
    screenCatalog(),
    Center(child: Text('In WORK'),),
    Center(child: Text('In WORK'),)
  ];

  tapped(int tappedIndex) {
    setState(() {
      _currentIndex = tappedIndex;
    });
  }

  changed(int introducedIndex) {
    setState(() {
      _selectedIndex = introducedIndex;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: tabs[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
          currentIndex: _currentIndex,
          onTap: tapped,
          showSelectedLabels: false,
          showUnselectedLabels: false,
          type: BottomNavigationBarType.fixed,
          items: [
            BottomNavigationBarItem(
              icon: SvgPicture.asset(CustomIcons[0],
                width: 30,
                height: 30,),
              title: Text(''),
            ),
            BottomNavigationBarItem(
              icon: SvgPicture.asset(CustomIcons[1],
                width: 30,
                height: 30,),
              title: Text(''),
            ),
            BottomNavigationBarItem(
              icon: SvgPicture.asset(CustomIcons[2],
                  width: 30,
                  height: 30),
              title: Text(''),
            ),
            BottomNavigationBarItem(
              icon: SvgPicture.asset(CustomIcons[3],
                width: 30,
                height: 30,),
              title: Text(''),
            ),
          ]),
    );
  }
}
screenHome() {
  return SingleChildScrollView(
    child: Container(
      padding: EdgeInsets.only(left: 20, right: 20),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          SizedBox(height: 100,),
          NeumorphicButton(
            onClick: () {},
            boxShape: NeumorphicBoxShape.roundRect(BorderRadius.circular(20)),
            style: NeumorphicStyle(
              lightSource: LightSource.topLeft,
              intensity: 0.8,
              shape: NeumorphicShape.flat,
              depth: 3,
              color: Colors.grey[100],
            ),
            child: Column(
              children: <Widget>[
                SizedBox(height: 20,),
                Container(
                  child: Center(
                    child: Text(
                      'Matematica',
                      style: TextStyle(
                          fontSize: 35, fontWeight: FontWeight.w200),
                    ),
                  ),
                ),
                SizedBox(height: 8,),
                Container(padding: EdgeInsets.only(left: 15),
                    child: Row(
                        children: <Widget>[
                          Text('Ultima nota: 9',
                            style: TextStyle(
                                fontSize: 22, fontWeight: FontWeight.w200),
                          ),
                        ]
                    )
                ),
                SizedBox(height: 10,),
                Container(
                  padding: EdgeInsets.only(left: 15),
                  child:
                  Row(
                    children: <Widget>[
                      Text('Media: 10',
                        style: TextStyle(fontSize: 22, fontWeight: FontWeight
                            .w200),
                      ),
                      SizedBox(width: 5,),
                      Icon(Icons.arrow_upward, color: Colors.greenAccent,)
                    ],
                  ),
                ),
                SizedBox(height: 10,),
                Container(padding: EdgeInsets.only(left: 15),
                    child: Row(
                        children: <Widget>[
                          Text('Urmatoarea ora: 24.09.20 - 11:00',
                            style: TextStyle(
                                fontSize: 22, fontWeight: FontWeight.w200),
                          ),
                        ]
                    )
                ),
                Container(
                  padding: EdgeInsets.only(right: 10),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.end,
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: <Widget>[
                      Icon(
                        Icons.arrow_forward, color: Colors.lightBlueAccent,),
                    ],
                  ),
                ),

                SizedBox(height: 10,),
              ],
            ),
          ),
          SizedBox(height: 15,),
          Text('Recente',
            style: TextStyle(fontSize: 19,
                fontWeight: FontWeight.w500,
                color: Colors.grey[400]),
          ),
          ListView.builder(
              scrollDirection: Axis.vertical,
              shrinkWrap: true,
              itemCount: recente.length,
              itemBuilder: (BuildContext context, int index) {
                return Column(

                  children: <Widget>[

                    Neumorphic(
                      boxShape: NeumorphicBoxShape.roundRect(
                          BorderRadius.circular(14)),
                      style: NeumorphicStyle(
                        lightSource: LightSource.topLeft,
                        intensity: 0.8,
                        shape: NeumorphicShape.flat,
                        depth: 3,
                        color: Colors.grey[100],
                      ),
                      child:
                      Container(
                        padding: EdgeInsets.only(top: 13, left: 13),
                        height: 60,
                        width: 370,
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: <Widget>[
                            Text(recente[index].event,
                              style: TextStyle(
                                  fontSize: 25, fontWeight: FontWeight.w200),
                            ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.end,
                              children: <Widget>[
                                Text(recente[index].data,
                                  style: TextStyle(fontSize: 15,
                                      fontWeight: FontWeight.w200),
                                ),
                                SizedBox(width: 10,)
                              ],
                            ),
                          ],
                        ),
                      ),
                    ),
                    SizedBox(height: 30,),
                  ],);
              }
          ),
          SizedBox(height: 10,),
        ],
      ),
    ),
  );
}

screenCatalog() {
  return SingleChildScrollView(
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: <Widget>[
        SizedBox(height: 40,),
        NeumorphicToggle(
          height: 30,
          selectedIndex: _selectedIndex,
          displayForegroundOnlyIfSelected: true,
          children: [ ToggleElement(
            background: Center(child: Text('Semestrul 1',
                style: TextStyle(fontWeight: FontWeight.w200)),),
            foreground: Center(child: Text('Semestrul 1',
                style: TextStyle(fontWeight: FontWeight.w400)),),
          ),
            ToggleElement(
              background: Center(child: Text('Semestrul 2',
                  style: TextStyle(fontWeight: FontWeight.w200)),),
              foreground: Center(child: Text('Semestrul 2',
                  style: TextStyle(fontWeight: FontWeight.w400)),),
            )
          ],
          thumb: Neumorphic(
            boxShape: NeumorphicBoxShape.roundRect(BorderRadius.circular(10)),
            style: NeumorphicStyle(
              lightSource: LightSource.topLeft,
              intensity: 0.8,
              shape: NeumorphicShape.flat,
              depth: 3,
              color: Colors.grey[100],
            ),
          ),
          onChanged: (value) {
             //here I want to make the setState but i can't,it gives me error
          },
        ),
        SizedBox(height: 10,),
      ],
    ),
  );
}

Answer 1

The problem was here:

 NeumorphicToggle(
          height: 30,
          selectedIndex: _selectedIndex,
          displayForegroundOnlyIfSelected: true,
          children: [ ToggleElement(
            background: Center(child: Text('Semestrul 1',
                style: TextStyle(fontWeight: FontWeight.w200)),),
            foreground: Center(child: Text('Semestrul 1',
                style: TextStyle(fontWeight: FontWeight.w400)),),
          ),
            ToggleElement(
              background: Center(child: Text('Semestrul 2',
                  style: TextStyle(fontWeight: FontWeight.w200)),),
              foreground: Center(child: Text('Semestrul 2',
                  style: TextStyle(fontWeight: FontWeight.w400)),),
            )
          ],
          thumb: Neumorphic(
            boxShape: NeumorphicBoxShape.roundRect(BorderRadius.circular(10)),
            style: NeumorphicStyle(
              lightSource: LightSource.topLeft,
              intensity: 0.8,
              shape: NeumorphicShape.flat,
              depth: 3,
              color: Colors.grey[100],
            ),
          ),
          onChanged: (value) {
             //here I want to make the setState but i can't,it gives me error
          },
        ),

If you use the bottomnavigationbar you need a list of widgets without state. If you want to make animated transitions in pages you will need this:

 StatefulBuilder(
             builder:(BuildContext context, StateSetter setState) {
return //Whatever you want to use here ();
},
),

After this you will be able to use setState where you need it to make your app more dynamic.