颤振构建被重复调用

时间:2021-02-20 12:31:02

标签: flutter

当我push或pop路由时调试下面的代码,build被重复调用,print(1)总是调用并打印到控制台。

import 'package:demo/route/demo.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(Home());
}

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Body(),
    );
  }
}

class Body extends StatefulWidget {
  @override
  _BodyState createState() => _BodyState();
}

class _BodyState extends State<Body> with SingleTickerProviderStateMixin {
  TabController _controller;
  @override
  void initState() {
    super.initState();
    _controller = TabController(length: 2, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    print(1);
    return Scaffold(
      appBar: AppBar(
        title: Text('home'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          Navigator.of(context).push(
            MaterialPageRoute(
              builder: (context) => DemoPage(),
            ),
          );
        },
        child: Icon(Icons.plus_one),
      ),
      body: Column(
        children: [
          TabBar(
            labelPadding: EdgeInsets.symmetric(vertical: 15),
            tabs: [
              Text(
                '1',
                style: TextStyle(color: Colors.black),
              ),
              Text(
                '2',
                style: TextStyle(color: Colors.black),
              ),
            ],
            controller: _controller,
          ),
          Expanded(
            child: TabBarView(
              controller: _controller,
              children: [
                ListItem(),
                ListItem(),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class ListItem extends StatefulWidget {
  @override
  _ListItemState createState() => _ListItemState();
}

class _ListItemState extends State<ListItem> with AutomaticKeepAliveClientMixin {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Text('1'),
    );
  }

  @override
  bool get wantKeepAlive => true;
}

DemoPage() 是一个非常简单的页面。

我尝试注释代码找出问题出在哪里,当我注释TabBarTabBarView Widget,以及initstate中的初始化tabcontroller时,情况会不会再发生了。所以我认为问题出在 tabcontroller 上,我不确定它是否正确。

我想知道为什么会这样,是我的问题还是正常的。

感谢大家的帮助。

1 个答案:

答案 0 :(得分:1)

这是完全正常的。您应该期望框架随时重建小部件。

假设您有动画。 Flutter 将重建 60 次/秒。