更改标签与按钮颤抖问题

时间:2020-06-03 16:30:25

标签: flutter button dart tabs

您好,我正在尝试制作一个带有标签的应用,到目前为止,我有2个标签。我需要创建一个转到特定选项卡的按钮,但遇到了一些问题。为此,我使用了以下问题:Flutter: Changing the current tab in tab bar view using a button

这是我的代码(简称)

首先是我的main.dart,是我组织的标签:

import 'package:flutter/material.dart';
import 'package:projetradioactif/accueil.dart';
import 'package:projetradioactif/page1.dart';

void main() {
  runApp(MaterialApp(home:MyTabbedPage()));
  }

class MyTabbedPage extends StatefulWidget {
    //const Screen({Key key}) : super(key: key);
    @override
    _MyTabbedPageState createState() => _MyTabbedPageState();
  }

class _MyTabbedPageState extends State<MyTabbedPage> with SingleTickerProviderStateMixin {

    TabController tabController;

    @override
    void initState() {
      super.initState();
      tabController = new TabController(vsync: this, length: 4);
    }


    @override
    Widget build(BuildContext context) {
      return DefaultTabController(
          length:2,

          child : Scaffold(
              appBar: AppBar(
                title:Text(
                  "Accueil",
                  style: TextStyle(fontSize: 22),
                ),
                centerTitle: true,
                backgroundColor: Color.fromRGBO(248, 160, 8, 1),
//you click to have tabs
                bottom:TabBar(
                  controller: tabController,
                  tabs: [
                    Tab(icon: Image(image:AssetImage("assets/centrale.png"))),
                    Tab(icon: Image(image:AssetImage("assets/bouteille.png"))),

                  ],
                ),
              ),
              body: TabBarView(
                  controller: tabController,
                  children: [
                    Accueil(),                    
                    Page2(),
                  ]
              ),
            ),
          )
      );
    }
  }

这是Acceuil类,如果我有一个需要更改标签的按钮:

import 'package:flutter/material.dart';
import 'package:projetradioactif/main.dart';

class Acceuil extends StatelessWidget {

  static final _myTabbedPageKey = new GlobalKey<_MyTabbedPageState>();

  @override
  Widget build(BuildContext context) {


    return Container(
      key: _myTabbedPageKey,
      color: Colors.yellow,

      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
RaisedButton.icon(
            elevation: 10,
            //padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
            color: Colors.yellow,
            icon: Icon(Icons.add),

            label: Text("Voir l'exposé"),

            onPressed: () {
           Acceuil._myTabbedPageKey.currentState.tabController.animateTo(1);
            },
          ),
        ],

      ),
    );
  }
}

static final _myTabbedPageKey = new GlobalKey<_MyTabbedPageState>();中的行出现问题:'dynamic' doesn't extend 'State<StatefulWidget>'

2 个答案:

答案 0 :(得分:0)

尝试更改

onPressed: () {
    Acceuil._myTabbedPageKey.currentState.tabController.animateTo(1);
},

为此:

onPressed: () {
  setState(){
      Acceuil._myTabbedPageKey.currentState.tabController.animateTo(1);
  }
},

答案 1 :(得分:0)

我改变了:

body: TabBarView(
                  controller: tabController,
                  children: [
                    Accueil(),                    
                    Page2(),
                  ]

致:

body: TabBarView(
                  controller: tabController,
                  children: [
                    Acceuil(tabController),
                    Page1(tabController),
                    Page2(tabController),
                    Page3(tabController),

                  ]
              ),

在 Acceuil 课上我改变了这个:

static final _myTabbedPageKey = new GlobalKey<_MyTabbedPageState>();

为此:

  TabController tabController;
  Acceuil(TabController ptabController){

    this.tabController = ptabController;
  }