Использование кнопок действий на панели приложений в качестве вкладок. (Флаттер) - PullRequest
Новая
       5

Использование кнопок действий на панели приложений в качестве вкладок. (Флаттер)

0 голосов
/ 13 января 2019

[введите описание изображения здесь] [1] Я делаю проект во флаттере. У меня есть три кнопки действий на панели приложений, и я хочу использовать те же вкладки на той же панели приложений с индикаторами. Как мне этого добиться?

[1]: пример просмотра. https://i.stack.imgur.com/2beQx.png

1 Ответ

0 голосов
/ 13 января 2019 
TabController tabController;
final selectedColor = Colors.red;
int currentTab;
@override
void initState() {
  super.initState();
  tabController = TabController(length: 3, vsync: this);
  currentTab = 0;
}


//add this function to your build function.

void goTo(int index){
  this.tabController.animateTo(index);
  setState(() {
    this.currentTab = index;
  });
}

// and in your Scaffold:

appBar: AppBar(
        title: Text("Test page 1"),
        actions: [
          IconButton(
            icon: Icon(Icons.storage, color: currentTab == 0 ? selectedColor : Colors.white,),
            onPressed: () {
              goTo(0);
            },
          ),
          IconButton(
            icon: Icon(Icons.account_box, color: currentTab == 1 ? selectedColor : Colors.white,),
            onPressed: () {
              goTo(1);
            },
          ),
          IconButton(
            icon: Icon(Icons.shopping_basket, color: currentTab == 2 ? selectedColor : Colors.white,),
            onPressed: () {
              goTo(2);
            },
          )
        ],
      ),


body: TabBarView(
        controller: tabController,
        children: <Widget>[
          Container(
            child: Icon(Icons.storage),
          ),
          Container(
            child: Icon(Icons.account_box),
          ),
          Container(
            child: Icon(Icons.shopping_basket),
          )
        ],
      ),
...