How to enable disable edit mode on tabs view in Flutter

Question

I want to enable "edit" mode for some elements in selected tab, the problem is if im using edit btn in appBar menu i enable edit mode for all the tabs not just selected.

When user select tab and click edit from appBar i want to switch view to edit mode for that tab only ,and on save to switch back. If user quit in the middle of editing by clicking other tab or swipe, i want to show non editing tabs again.

Im calling this fro edit btn.

  void _editModeCall(String u) {
    setState(() {
      _editMode = true;
    });

  }

Than i got five tabs like this:

  firstTab(){
    if(_editMode){
      return _editmodeView();
    }else{
      return _defoultView();
    }
  }

And on save btn aim switching bool _editMode,, that is working but this way i enable "editMode" on all tabs not just selected.

How to get index or someother way to know on witch tab are user and enable edit view just for that tab?

Solution

You can use the TabController class for this. You can create a new TabBar Widget and append a TabController to it:

_tabController = new TabController(length: 3, vsync: this);
TabBar(controller: _tabController);

Then to get the current index, call _tabController.index. Then use a setState() call and change the State of only the visible TabBarView page.

Reference: https://api.flutter.dev/flutter/material/TabController-class.html

Comments

[Alex Apps]

Thanks for response, So this cant be done in DefaultTabController witch i have? I also have TabBar And how exactly i change view in TabBarView?

[gi097]

The DefaultTabController does not give you the option you want, hence the custom TabController. You can change the view in your TabBarView.